Html display text with formatting

  This is some misspelled text.  Invest in your potential. Develop skills for as low as £24.99 £14.99 — today only! 

Big and Small

Making text larger: If you want to put your font size larger than the rest of the text then put the content within . . It increase one font size larger than the previous one. Making text smaller: The is used to make the text smaller. The text that needs to be displayed smaller should be written inside . tags.

  This is the first sentence. This whole sentence is in bigger letters.   This is the first sentence. This whole sentence is in small letters.  

Delete and Insert

Striking through the text: The element is used to strike through the text marking the part as deleted. It also has an opening and a closing tag.
Adding a text: The element is used to underline a text marking the part as inserted or added. It also has an opening and a closing tag.

  My favourite code editor is Sublime Text VS Code ! 

Subscript and Superscript

Making a text Subscript or Superscript: The ^{element is used to superscript a text and the element is used to subscript a text. They both have an opening and a closing tag.}

  Make sure to drink plenty of H 2 O whilst working on your coding skills.  The world's most famous equation: E = mc 2
  

Conclusion

• – Bold text
• – Important text
• – Italic text
• – Emphasised text
• – Marked text
• – Teletype text (Not Supported in HTML5)
• – Underline text
• – Draw a strikethrough a section of text (Not Supported in HTML5)
• – Increase font size by one conventional unit (Not Supported in HTML5)
• – Decrease font size by one unit from the base font size
• – Deleted text
• – Inserted text
• – Subscript text
• – Superscript text

I hope you find these HTML formatting elements useful in making your next web page more appealing.

Further reading

Explore some other interesting HTML5 elements; over on MDN Web Docs – HTML elements reference – HTML: HyperText Markup Language | MDN.

See also

If you liked this article, then please share. You can also find me on Twitter for more updates.

Источник

Text Formatting Tags in HTML

HTML formatting is a process by which we style our content to make it more informative and attractive by using different types of HTML formatting tags. There are more than 13 HTML formatting tags presented to us. HTML formatting tags allow us to style text without using CSS.

HTML Formatting

Through text formatting tags in HTML, we can make our content more attractive. We use HTML formatting tags to tell the browser how our content should be displayed. HTML formatting allows us to style our text in various ways.

Text formatting tags in HTML give us the freedom to italicize, underline or make our text bold just like in MS word. We can also write mathematical and chemical formulas using HTML text formatting tags.

For example in the image below, we have used formatting tags to display bold, italic, superscript, and subscript text

Text Formatting Tags

There are various types of formatting tags available to us through which we can write texts in different styles and formats. Different types of formatting tags are:

1. Bold tag
2. Italic tag
3. Underline tag
4. Mark tag
5. Strike tag
6. Monospace tag
7. Subscript tag
8. Superscript tag
9. Delete and Insert tag
10. Big and Small tag

Bold Text

Bold texts are used to highlight words that are important. They are also used to write title and headings in atricles. In HTML we have and tags to write bold texts.

tag - It does not hold any extra importance other than making text bold.

tag-Other than making text bold tag have symantic importance and it is used to give extra stress and emphasize important words.

and tag are used to write in bold font.

and tags are non void elements so they must have a closing tag.

In the example below, "Formatting tags" is written with bold tag to write in bold font and "Helpful" is written with strong tag to give emphasis on the word "Helpful".

Italic Text

Italics font is used to emphasize titles of articles, stories, poems, etc. In HTML, we can italicize our text using and tag.

tag - This tag is just used to write text in italic font, it does not hold any special meaning.

tag - It is used to emphasize the text. Screen readers put extra verbal stress while reding the text in tags. tag was intoduced in HTML5.

and tags are used to write in italic font.

and tags are non void elements therefore they must have a closing tag.

In the example below, "Formatting tags" is written using tag and BEST! is written using tag to emphasize the word BEST!.

Underlined Text

Underline tags are used on important words which require the attention of readers or can be used to underline headings or subheadings.

It is used to underline a word.

tag is a non-void element therefore it must have a closing tag.

"Formatting tags" is underlined using tag in the example below.

Marked Text

This tag is relatively a new tag that was introduced in HTML5. It is used to highlight a word in a sentence. Mark tag highlights the words by giving them a yellow background. It is supported by all major browsers.

Mark tag is used to highlight a word.

tag is a non-void element therefore it must have a closing tag.

Here "Formatting tags" is highlighted with a yellow background using tag.

Striked Text

In HTML4 tag is used to put a horizontal line through words. It can be used in articles to show that some items are deleted or updated from a list or article.

In HTML5 tag is used to write striked text. It is used when a word is no longer relevent or requierd in an article. We should not use tag to represent deleted text tag must be used in that case.

NOTE- tag is not supported in HTML 5. We can use or instead.

and tag are used to put a horizontal line through a word.

and tags are non void elements therefore they must have a closing tag.

In the example below, "Formatting tags" is striked out using tag.

Monospace Font

This tag is used to display text as it would display on fixed width displays such as line printer, teletype, etc. The browser renders the text enclosed in tags in monospace font. It is no longer supported in HTML5. Instead of tag we can use , , , , or CSS.

Note- This tag is not supported in HTML5.

tag is a non-void element therefore it must have a closing tag.

Subscript Text

A Subscript is a letter, symbol or a number which is usually in a smaller font size and half a character below the normal line. Subscript tags are used to write chemical formulas like H 2 O H_O H 2 ​ O , N 2 O N_O N 2 ​ O , etc. Here 2 is a subscript.

This tag is used to write the subscripts.

tag is a non-void element therefore it must have a closing tag.

As shown in the example below, 2 is a subscript and it is written using tag.

Superscript Text

A Superscript is a number, letter or symbol which is usually in a smaller font size and half a character above the normal line. Superscript tags are used to write mathematical equations like x 2 + y 2 x^2+y^2 x 2 + y 2 . Here 2 is a superscript.

This tag is used to write superscripts.

tag is a non-void element therefore it must have a closing tag.

In the equation shown in the example below, 2 is a subscript generated using tag.

Deleted and Inserted Texts

When we have to update something in our article we use delete and insert tags.Delete tag is used for text which is no longer required or has to be deleted. Browsers render deleted text as strike-through text. While tag is used to insert updated or new text in the article. Text enclosed by tag is renderd as underlined text by browsers.

Delete and insert tags are used to add and remove words.

and tags are non void elements therefore they must have a closing tag.

HTML4 is deleted using tag and HTML5 is inserted using tag as shown in exmple below.

Big and Small Texts

HTML tag makes the font of text one size bigger than the surrounding text i.e from small to medium, medium to big.

HTML tag makes font of text one size smaller than the surrounding text i.e from big to medium, medium to small.

Note- Big tag is not supported in HTML5 while the small tag is.

Big and small tags are used to make the font one size bigger and smaller than the default font size.

Instead of the big tag, we can change the font size of the text by using CSS.

and tags are non-void elements therefore they must have a closing tag.

Notice in example below, 'small tag' has one size smaller and 'big tag' one size bigger than the surrounding text.

Summary

• HTML formatting is writing articles in an attractive and more informative way by writing bold, italic, and underlined articles.
• HTML formatting tags tell the browser how the content should be displayed and formatted.

Источник