Home > Article > Web Front-end > Why is there a dotted line under the Chinese text in html?
Why is there a dotted line under the Chinese text in html?
- 醉折花枝作酒筹Original
- 2021-06-04 14:31:3012963browse
In HTML, you can use border-bottom to set a dashed line under the text. You only need to set the "border-bottom:width dashed color" style for the text element. When setting the style of the lower border of an element, the border may appear only if this value is not none.
The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.
border-bottom shorthand property sets all properties of the bottom border into one statement.
You can set the following properties in order:
border-bottom-width
- ##border-bottom-style
- border-bottom-color
border-bottom:width style color;If you don’t set one of the values, there will be no problem. For example, border-bottom:solid #ff0000; is also allowed. When setting the style of the bottom border of an element, the border may appear only when this value is not none.
<html>
<head>
<style type="text/css">
p {
border-style: solid;
}
p.none {
border-bottom-style: none;
}
p.dotted {
border-bottom-style: dotted;
}
p.dashed {
border-bottom-style: dashed;
}
p.solid {
border-bottom-style: solid;
}
p.double {
border-bottom-style: double;
}
p.groove {
border-bottom-style: groove;
}
p.ridge {
border-bottom-style: ridge;
}
p.inset {
border-bottom-style: inset;
}
p.outset {
border-bottom-style: outset;
}
</style>
</head>
<body>
<p class="none">No bottom border.</p>
<p class="dotted">A dotted bottom border.</p>
<p class="dashed">A dashed bottom border.</p>
<p class="solid">A solid bottom border.</p>
<p class="double">A double bottom border.</p>
<p class="groove">A groove bottom border.</p>
<p class="ridge">A ridge bottom border.</p>
<p class="inset">An inset bottom border.</p>
<p class="outset">An outset bottom border.</p>
</body>
</html>Effect:
border-bottom-color Sets the color of the element's bottom border.
Only solid colors can be defined, and the border may appear only when the border style is a value other than none or hidden.
Note: Please always declare the border-style attribute before the border-color attribute. The element must get a border before you can change its color.
Attribute value:
Recommended learning:
html video tutorialThe above is the detailed content of Why is there a dotted line under the Chinese text in html?. For more information, please follow other related articles on the PHP Chinese website!