- HTML Tags for Text Formatting
- The — Tags
- Example of the HTML — tags:
- Result
- The and Tags
- Example of the HTML and tags:
- The and Tags
- Example of the HTML and tags:
- The Tag
- Example of the HTML tag:
- Result
- The Tag
- Example of the HTML tag:
- The and Tags
- Example of the HTML tag:
- Example of the HTML tag:
- The and Tags
- Example of the HTML tag:
- Result
- Example of the HTML tag:
- Example of the HTML and tags:
- Result
- The Tag
- Example of the HTML tag:
- The , and Tags
- Example of the HTML tag:
- Example of the HTML tag:
- Example of the HTML tag:
- HTML Text Formatting
- Example
- HTML Formatting Elements
- HTML and Elements
- Example
- Example
- HTML and Elements
- Example
- Example
- HTML Element
- Example
- HTML Element
- Example
- HTML Element
- Example
- HTML Element
- Example
- HTML Element
- Example
- HTML Element
- Example
- HTML Exercises
- HTML Text Formatting Elements
- # Text Formatting
- # Highlighting
- # Bold, Italic, and Underline
- # Bold Text
- # Italic Text
- # Underlined Text
- # Abbreviation
- # Inserted, Deleted, or Stricken
- # Superscript and Subscript
- HTML text formatting
- Text formatting
- Tags for code
- Abbreviations
- Text direction
- Quotations
- Removed and inserted text
HTML Tags for Text Formatting
In HTML, a number of elements are used to format text. The formatting tags are divided into two groups: physical tags, that are used to style the text (visual appearance of the text) and logical or semantic tags that add semantic value to the text parts (e. g., inform search engines for which keywords a web page should be ranked).
Let’s dive deeper and talk about formatting tags in details.
The — Tags
The — tags are used to define HTML headings. There are 6 levels of headings in HTML, the defines the most and the least important headings.
Example of the HTML — tags:
html> html> head> title>Title of the document title> head> body> h1>This is heading 1 h1> h2>This is heading 2 h2> h3>This is heading 3 h3> h4>This is heading 4 h4> h5>This is heading 5 h5> h6>This is heading 6 h6> body> html>
Result
The and Tags
Example of the HTML and tags:
html> html> head> title>Title of the document title> head> body> p>We use the <strong> tag to highlight the importance strong> of this part of the text strong>. p> p>The <b> tag is a physical tag that stands for b>bold text b>. p> body> html>
The and Tags
Example of the HTML and tags:
html> html> body> p>This is a paragraph p> p>The important part of the text is defined em> in italic em>. p> p>i>Lorem ipsum i>, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs. p> body> html>
html> html> head> title>Title of the document title> head> body> pre>Spaces and line breaks within this element are shown as typed. pre> body> html>
The Tag
Example of the HTML tag:
html> html> head> title>Title of the document title> head> body> p>Learn the HyperText Markup Language on mark>W3Docs.com mark>. p> body> html>
Result
The Tag
Example of the HTML tag:
html> html> head> title>Usage of the SMALL tag title> head> body> p>The interest rate is only 10%* p> small>* per day small> / body> html>
The and Tags
Example of the HTML tag:
html> html> head> title>Title of the document title> head> body> p> She likes del>violets del> snowdrops․ p> body> html>
Example of the HTML tag:
html> html> head> title>Title of the document title> head> body> p>s>I am studying in high school. s> p> p>I am studying in a university. p> body> html>
The content of both tags is displayed as strikethrough. However, despite the visual similarity, these tags cannot replace each other.
The and Tags
Example of the HTML tag:
html> html> head> title>Title of the document title> head> body> p>She likes del>violets del> ins>snowdrops ins>․ p> body> html>
Result
Example of the HTML tag:
html> html> head> title>Title of the document title> head> body> p>Here we used u>the <u> tag u>. p> body> html>
The and
Example of the HTML and tags:
html> html> head> title>Title of the document title> head> body> p>The formula of water is Hsub>2 sub>O, and the formula of alcohol is Csub>2 sub>Hsub>5 sub>ОН p> p>E = mcsup>2 sup>, where E — kinetic energy, m — mass, c — the speed of light. p> body> html>
Result
The Tag
Example of the HTML tag:
html> html> head> title>Title of the document title> head> body> p>dfn>HTML dfn> (HyperText Markup Language ) — The standardized markup language for documents on the World Wide Web. Most web pages contain a description of the markup in the language HTML p> body> html>
The
,
and
Tags
Example of the HTML
tag:
html> html> head> title>Title of the document title> head> body> p>The first paragraph p> p>The second paragraph p> body> html>
Example of the HTML
tag:
html> html> head> title>Title of the document. title> head> body> h1>How to use the <br> tag h1> p> We can insert the <br /> tag inside the paragraph, br /> to transfer a part of the text to another line if necessary. p> body> html>
Example of the HTML
tag:
html> html> head> title>Title of the document title> head> body> h1>Football h1> p>A team sport involving kicking a ball to score a goal. p> hr> h1>Basketball h1> p>A game that is played between two teams of five players. p> body> html>
HTML Text Formatting
HTML contains several elements for defining text with a special meaning.
Example
This is subscript and superscript
HTML Formatting Elements
Formatting elements were designed to display special types of text:
- — Bold text
- — Important text
- — Italic text
- — Emphasized text
- — Marked text
- — Smaller text
- — Deleted text
- — Inserted text
- — Subscript text
- — Superscript text
HTML and Elements
The HTML element defines bold text, without any extra importance.
Example
The HTML element defines text with strong importance. The content inside is typically displayed in bold.
Example
HTML and Elements
The HTML element defines a part of text in an alternate voice or mood. The content inside is typically displayed in italic.
Tip: The tag is often used to indicate a technical term, a phrase from another language, a thought, a ship name, etc.
Example
The HTML element defines emphasized text. The content inside is typically displayed in italic.
Tip: A screen reader will pronounce the words in with an emphasis, using verbal stress.
Example
HTML Element
The HTML element defines smaller text:
Example
HTML Element
The HTML element defines text that should be marked or highlighted:
Example
Do not forget to buy milk today.
HTML Element
The HTML element defines text that has been deleted from a document. Browsers will usually strike a line through deleted text:
Example
My favorite color is blue red.
HTML Element
The HTML element defines a text that has been inserted into a document. Browsers will usually underline inserted text:
Example
HTML Element
The HTML element defines subscript text. Subscript text appears half a character below the normal line, and is sometimes rendered in a smaller font. Subscript text can be used for chemical formulas, like H2O:
Example
HTML Element
The HTML element defines superscript text. Superscript text appears half a character above the normal line, and is sometimes rendered in a smaller font. Superscript text can be used for footnotes, like WWW [1] :
Example
This is superscripted text.
HTML Exercises
HTML Text Formatting Elements
Tag | Description |
---|---|
Defines bold text | |
Defines emphasized text | |
Defines a part of text in an alternate voice or mood | |
Defines smaller text | |
Defines important text | |
Defines subscripted text | |
Defines superscripted text | |
Defines inserted text | |
Defines deleted text | |
Defines marked/highlighted text |
For a complete list of all available HTML tags, visit our HTML Tag Reference.
# Text Formatting
While most HTML tags are used to create elements, HTML also provides in-text formatting tags to apply specific text-related styles to portions of text. This topic includes examples of HTML text formatting such as highlighting, bolding, underlining, subscript, and stricken text.
# Highlighting
The element is new in HTML5 and is used to mark or highlight text in a document «due to its relevance in another context». 1
The most common example would be in the results of a search were the user has entered a search query and results are shown highlighting the desired query.
p>Here is some content from an article that contains the mark>searched querymark> that we are looking for. Highlighting the text will make it easier for the user to find what they are looking for.p>
A common standard formatting is black text on a yellow background, but this can be changed with CSS.
# Bold, Italic, and Underline
# Bold Text
To bold text, use the or tags:
strong>Bold Text Herestrong>
What’s the difference? Semantics. is used to indicate that the text is fundamentally or semantically important to the surrounding text, while indicates no such importance and simply represents text that should be bolded.
If you were to use a text-to-speech program would not say the word(s) any differently than any of the other words around it — you are simply drawing attention to them without adding any additional importance. By using , though, the same program would want to speak those word(s) with a different tone of voice to convey that the text is important in some way.
# Italic Text
To italicize text, use the or tags:
What’s the difference? Semantics. is used to indicate that the text should have extra emphasis that should be stressed, while simply represents text which should be set off from the normal text around it.
For example, if you wanted to stress the action inside a sentence, one might do so by emphasizing it in italics via : «Would you just submit the edit already?»
But if you were identifying a book or newspaper that you would normally italicize stylistically, you would simply use : «I was forced to read Romeo and Juliet in high school.
# Underlined Text
While the element itself was deprecated in HTMl 4, it was reintroduced with alternate semantic meaning in HTML 5 — to represent an unarticulated, non-textual annotation. You might use such a rendering to indicate misspelled text on the page, or for a Chinese proper name mark.
p>This paragraph contains some u>mispelledu> text.p>
# Abbreviation
To mark some expression as an abbreviation, use tag:
p>I like to write abbr title="Hypertext Markup Language">HTMLabbr>!p>
If present, the title attribute is used to present the full description of such abbreviation.
# Inserted, Deleted, or Stricken
To mark text as inserted, use the tag:
To mark text as deleted, use the tag:
To strike through text, use the tag:
s>Struck-through text heres>
# Superscript and Subscript
To offset text either upward or downward you can use the tags and .
HTML text formatting
In HTML, there are tags for changing the appearance of the text, such as and . They are used to select text in bold or italic, such tags in HTML are called tags for formatting.
Text formatting
This example demonstrates how you can edit text in an HTML document using special tags:
Text
Text
Text
Text
Text
This is the subscript and the superscript
Tag
The
tag allows you to select a part of the source text that should be displayed by the browser in its original form, that is, the same characters and with the same number of spaces and line breaks. All text between the openingtag and the closingtag will be displayed in monospaced font:
It saves the author's text formatting (leaves unchanged) and makes the font monospacedTags for code
The example shown below demonstrates the difference in output of the contents of the tags to the screen:
Source code
Keyboard input
Sample code
Selecting a variableThese tags are usually used to show the program code on the page.
Tag
The address is a common element of many HTML documents, to allocate an address on the page, there is a special tag separating the text enclosed in it from all other content.
Most often it is used to highlight contact information, for example, an e-mail address or a method of communication with the author/owner of the document, article or site:
Abbreviations
The example shows how you can write an abbreviation:
UFO
The title attribute is needed for the tooltip, it appears when you move the cursor over the abbreviation.Text direction
The example shows how you can change the direction of the text:
The bdo tag specifies the direction of the text - from left to right and vice versa.
This is our textQuotations
In HTML, there are two tags for highlighting quotes in the text - and . The tag is a inline element and is intended to highlight short citations directly in the paragraph text. Text placed inside the element is displayed by default in double quotes by most browsers.
Unlike the tag, the tag is a block element, it is intended to highlight long quotes that are more similar in volume to whole paragraphs. In most browsers, the text of the element will be displayed with a small indent to the right and have line breaks before and after itself:
A long quote:
This is a very long quote.This is a very long quote.This is a very long quote. This is a very long quote.This is a very long quote.This is a very long quote.For long quotes, the browser inserts indents from all sides.
Short quote:This is a short quote.
Short quotes are enclosed in double quotes.Removed and inserted text
The example demonstrates how you can mark text in a document that has been deleted (marked as a crossed outline) or inserted (marked as underlined):
The contents of the del tag, most browsers display
strikethrough, and the content of the ins tag - underlinedNote: you can also specify a strikethrough and an underscore using the CSS property of text-decoration .
Copying materials from this site is possible only with the permission of the site administration and
when you specify a direct active link to the source.
2011 - 2021 © puzzleweb.ru