Introduction to box-shadow in CSS3, css3box-shadow

Introduction to box-shadow in CSS3, css3box-shadow

We usually use box-shadow to set box shadow, but some attributes are not used. This article will analyze the box-shadow attributes one by one.
Syntax

Copy the content to the clipboard using CSS Code.

E {box-shadow:inset x-offset y-offset blur-radius spread-radius color}  

　　

That is:

Object selector {box-shadow: Projection Method X axis offset Y axis offset shadow blur radius shadow extended radius shadow color}

Inset Projection Method
This parameter is an optional value. If no value is set, the default projection method is the outer shadow. If its unique value is "inset", the projection is the inner shadow;
X-offset
Horizontal offset;
Y-offset
Vertical offset;
Blur-radius fuzzy radius
Optional. It can only be an integer. The greater the value, the blurrier the shadow;
Spead-radius extension radius
Optional. It can be a positive or negative number. If it is a negative number, the entire Shadow will be reduced;
Color shadow color
Optional. If no value is set, the browser uses the default color. The default color is generally black.

Generally, we seldom use the inset and spead-radius attributes. If we use these two attributes well, we can produce very cool results.

• Text Effects
• Image magnifiers
• Juqery focus chart
• Waterfall stream
• Ad floating code
• Online Customer Service
• Webpage navigation menu