Home>Article>Web Front-end> How to set dotted border in css
You can use the border-top-style attribute to set the dashed border in css. You only need to add the "border-top-style:dashed;" style to the element. The border-top-style attribute can set the top border style of the element. When the value is dashed, the dashed line style can be defined.
The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.
In CSS, you can use the border-top-style attribute to set the dotted border.
The border-top-style attribute can set the top border style of the element. When the value is dashed, the dashed line style can be defined.
Let’s take a look at the code example below:
虚线上边框样式
Rendering:
Expand knowledge: border- The values that can be set for the top-style attribute
| Value | Description |
|---|---|
| none | Define no border. |
| hidden | Same as "none". Except when applied to tables, for which hidden is used to resolve border conflicts. |
| dotted | Define dotted border. Renders as a solid line in most browsers. |
| dashed | Define dashed line. Renders as a solid line in most browsers. |
| solid | Define a solid line. |
| double | Define double line. The width of the double line is equal to the value of border-width. |
| groove | Define the 3D groove border. The effect depends on the value of border-color. |
| ridge | Define the 3D ridge border. The effect depends on the value of border-color. |
| inset | Define the 3D inset border. The effect depends on the value of border-color. |
| outset | Define the 3D outset border. The effect depends on the value of border-color. |
(Learning video sharing:css video tutorial)
The above is the detailed content of How to set dotted border in css. For more information, please follow other related articles on the PHP Chinese website!