Shulou(Shulou.com)06/02 Report--

This article mainly explains "how css sets the shadow on the right and below the border". The content of the explanation in the article is simple and clear, and it is easy to learn and understand. Please follow the editor's train of thought to study and learn "css how to set the shadow on the right and below the border".

In css, you can use the "box-shadow" attribute to set the shadows to the right and below the border of the element, which is used to style the border shadow of the element with the syntax of "element {box-shadow: right shadow blur spread color;}".

The operating environment of this tutorial: windows10 system, CSS3&&HTML5 version, Dell G3 computer.

How css sets shadows on the right and bottom of the border

In css, you can use the box-shadow attribute to set the shadows to the right and below the border. The function of the box-shadow attribute is to set one or more drop-down shadow borders for the element. Its syntax format is as follows:

Box-shadow: h-shadow v-shadow blur spread color inset

Where the attribute value is represented as follows:

Examples are as follows:

123 div {width:300px;height:100px;background-color:yellow;box-shadow: 50px 20px 10px # 888888;}

Output result:

Thank you for your reading, the above is the "css how to set the right side of the border and the shadow below" the content, after the study of this article, I believe you on how to set the right side of the frame and the bottom of the shadow of this problem has a deeper understanding, the specific use of the need for you to practice and verify. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.