Computers, Programming
How to make crossed-out text in CSS
CSS allows you to perform a variety of operations associated with the decorative decoration of the entire page. Particular attention is paid to the text, which in most cases fills most of all sites. Today we will consider one interesting property: an overlined, underlined and crossed out text. All these effects are set using a single CSS rule.
Assignment
To emphasize and cross out the text in CSS, you can use the command "text-decoration". The effect will depend on the value specified. CSS was coined to separate the logical and structural part of a web page. But before the appearance of cascading style sheets HTML tags were used, which had a similar meaning. For example, an element such as allows you to display a strikethrough text. Now this tag is considered undesirable, and its use will automatically make your page code invalid. Although this element is still supported by all modern browsers and is used by some developers. But back to CSS. The command "text-decoration" can have the following values:
- Underline. By assigning this value, you get the underlined text.
- Overline. The line will pass over a certain fragment of the page.
- Line-through. Creates a strikethrough or strikethrough text.
- Blink. The selected fragment of the document will periodically disappear and reappear.
- Also there are values of "none" and "inherit". The first cancels all effects, and the second orders inherit the property of the parent element.
Purpose
It would seem that in CSS, strikethrough text and similar effects only serve to decorate the text. In most cases this statement is true. But sometimes it is worth thinking about the question: why such elements were created? For example, an already outdated "strike" tag was used to refer to incorrect or old information. Readers, seeing the crossed out text, understand the hidden meaning of this designation. The underlined words are always immediately distinguished from the general flow. Therefore, this effect should be used to highlight important information. The value of "blink", which makes the text blinking, is used quite rarely, since among programmers it is considered to be such an unacceptable effect. After all, few of your readers like flickering symbols that will constantly distract them. Well, the value of "overline" is used only to decorate the text.
Features
Although all values of the "text-decoration" property are included in the specification of cascading table versions, some values are not supported by modern browsers. For example, the flashing text will not be visible in IE. Google Chrome does not accept certain values. Mobile platforms inadequately support this feature.
Conclusion
Effects such as strikethrough text and other similar meanings are often used on the Internet. Their use allows you to correctly express the author's main idea, helping to focus readers' attention on the right part of the text. But do not be too zealous and at every opportunity to apply the property of "text-decoration". After all, unnecessary adornment of the text can harm you and your readers.
Similar articles
Trending Now