Home > Web Front-end > CSS Tutorial > How to set underline in css

How to set underline in css

下次还敢
Release: 2024-04-26 10:54:14
Original
1167 people have browsed it

The text-decoration property of CSS can be used to set underline. This can be achieved by following the following steps: Use the text-decoration: underline value to set underline. Optional parameters include: overline: Adds a line above the text. line-through: Add a line in the middle of the text. Stroke thickness and color can be adjusted via the text-decoration-thickness and text-decoration-color properties. The text-decoration-skip attribute controls the type of characters that dashes skip.

How to set underline in css

CSS underline setting

Use text-decoration attribute in CSS to set Decorative style for text, including underlining. Underlining can be set via the underline value of the text-decoration property.

Here's how to set underline in CSS:

<code class="css">/* 设置元素文本的划线样式 */
element {
  text-decoration: underline;
}</code>
Copy after login

Optional parameters

In addition to underline, ## The #text-decoration attribute also supports the following values ​​to control the style of the underline:

  • overline: Adds a line above the text.
  • line-through: Add a line in the middle of the text.

Example

<code class="css">/* 设置文本为红色实线划线 */
p {
  text-decoration: underline solid red;
}

/* 设置文本为绿色双线划线 */
h1 {
  text-decoration: double underline green;
}</code>
Copy after login

Other Tips

    Underline styles can be combined with other text decoration styles ( (such as underline and strikethrough) are used together.
  • The thickness and color of the stroke can be adjusted through the
  • text-decoration-thickness and text-decoration-color properties.
  • You can also use the
  • text-decoration-skip attribute to control the type of characters skipped by the dash.

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

Related labels:
css
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template