In CSS, you can set one or more drop-down shadow boxes through the box-shadow attribute. The usage syntax of this attribute is such as "box-shadow:Xpx Ypx Zpx #888888;", where X represents the horizontal shadow, Y represents vertical shadow, Z represents gradient effect, and "#888888" represents shadow color.
The operating environment of this article: Windows7 system, HTML5&&CSS3 version, Dell G3 computer.
CSS Set Border Shadow Effect
The box-shadow property can set one or more drop-down shadow boxes.
box-shadow: Xpx Ypx Zpx #888888;
X: Horizontal shadow (offset value)
Y: Vertical shadow (offset value)
Z: Gradient effect
#888888: Shadow color
<!DOCTYPE html> <html> <head> <style> div { width:300px; height:100px; background-color:yellow; box-shadow: 12px 12px 500px #888888; } </style> </head> <body> <div></div> </body> </html>
[Recommended learning: css video tutorial】
The above is the detailed content of How to set css border shadow. For more information, please follow other related articles on the PHP Chinese website!