How to write shadow: 1. Text shadow “text-shadow: h-shadow v-shadow blur color;”; 2. Border shadow “box-shadow: h-shadow v-shadow blur spread color inset; ".

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

1. How to write css text shadow

In css, you can use the text-shadow attribute to implement shadowed text. The text-shadow attribute is applied to shadow text. .

Syntax

text-shadow: h-shadow v-shadow blur color;

Note: The text-shadow property connects one or more shadow text. The property is a shadow, specifying every 2 or 3 length values and an optional color value separated by commas. The expired length is 0.

Example:

      
  
文本阴影！
  

Rendering:

2. How to write css border shadow

In CSS, you can use the box-shadow attribute to achieve the border shadow effect. The box-shadow attribute can set one or more drop-down shadow boxes.

Syntax

box-shadow: h-shadow v-shadow blur spread color inset;

Note: The boxShadow property adds one or more drop shadows to the box. This property is a comma-separated list of shades, each shade specified by 2-4 length values, an optional color value, and an optional inset keyword. The value for omitted length is 0.

Example:

    
  
边框阴影
  

Rendering:

(Learning video sharing:css video tutorial)

The above is the detailed content of How to write css shadow. For more information, please follow other related articles on the PHP Chinese website!