HTML and CSS Reference
Figure 4-9. The text-decoration property draws a line under, over, or through text or any combination
In CSS2.1, the color of the line is inherited from the text.
Changes to text-decoration in CSS3
The CSS3 Text module proposes improvements to the text-decoration property that allow you to set a different
color and change the style of the line. CSS3 introduces four new properties:
text-decoration-line This takes the same values as text-decoration in CSS2.1,
except blink , which has been dropped.
text-decoration-color This sets the color of the line(s).
text-decoration-style This sets the style of the line(s). Accepted values are solid ,
double , dotted , dashed , and wavy . The default is solid .
text-decoration-skip This specifies which elements, if any, the line(s) should
skip over. Accepted values are none , objects , spaces , ink , and edges . The default is
objects , which skips over images and inline blocks. The meaning of spaces is self-
explanatory. Specifying ink prevents the line(s) from being drawn over a character. The
edges keyword is mainly for use in Chinese. It creates a separate line for each character
in a group rather than one solid line.
he text-decoration property itself becomes the shorthand for these four new properties. This ensures
backward compatibility with CSS2.1 and older browsers. However, it means you need to be careful when
using the new properties in combination with text-decoration because the shorthand version overrides any
previously set values.
To maintain cross-browser compatibility, you need to specify text-decoration first for older browsers,
followed by the new properties to enhance the display in browsers that understand them. If you put
text-decoration last, the other properties won't be applied.
Currently, no browser supports text-decoration-skip . However, Firefox has supported the three other
CSS3 properties with the -moz- browser-specific prefix since version 6. It's also a good idea to follow the browser-
specific versions with the official properties so they'll be used as soon as browsers support them, for example like