underline code in css code example
Example 1: text-decoration css
h1 {
text-decoration: overline;
}
h2 {
text-decoration: line-through;
}
h3 {
text-decoration: underline;
}
h4 {
text-decoration: underline overline;
}
Example 2: css text decoration
/******************* How to style your text? ************************/
tag_name {
text-decoration-line: underline; /* or overline; line-through; ... */
/*OR: */
text-decoration: underline overline dotted red; /* text-decoration-line (can be more than one); text-decoration-style; text-decoration-color; */
color: blue; /* Sets the color of the text */
text-decoration-color: yellow; /* Sets the color of the text decoration */
text-decoration-style: solid; /* Sets the style of the text decoration (like solid, wavy, dotted, dashed, double) */
font-style: italic; /* Specifies the font style for a text, like, if you want it as normal, italic, oblique,... */
font-size: 1.6em; /* Sets the size of the text */
letter-spacing: 5px; /* Sets the space between letters */
line-height: 20px /* Sets the space between lines */
font-family: "Times New Roman", Times, serif; /* specifies the font for an element. It can hold several font names as a "fallback" or stack system.
If the browser does not support the first font, it tries the next font */
text-shadow: 2px 2px 8px; /* horizontal_shadow; vertical_shadow; blur-radius; color|none|initial|inherit; */
/*OR */
text-shadow: 0 0 #FF0000; /* The blur is optional */
/*OR: */
text-shadow: 0 0 3px #FF0000, 0 0 5px #0000FF; /* Text-shadow with a red and blue neon glow */
text-indent: 40px; /* Indents the first line of text with different values (can be negative values) */
text-align: center; /* Specifies the horizontal alignment of text in an element,by choosing, for exemple, justify, right, left, ... */
overflow: hidden; /* Specifies what should happen if content overflows an element's box, by choosing, for exemple, visible; auto; scroll; ... */
white-space: nowrap; /* Specifies how white-space inside an element is handled, by choosing, for exemple, pre; normal; nowrap;... */
text-overflow: ellipsis; /* Specifies how overflowed content that is not displayed should be signaled to the user, for exemple, with 3 dots */
word-break: break-all; /* Specifies how words should break when reaching the end of a line, by choosing, for exemple, keep-all; normal; break-word; ... */
word-wrap: break-word; /* Allows long words to be able to be broken and wrap onto the next line. */
}