HTML – PHRASE TAGS
HTML – Phrase Tags
In HTML, phrase tags are used to add semantic meaning to specific parts of text. These tags help describe the role of the text within the content, aiding both readability and accessibility. Below are commonly used phrase tags and their purposes:
Phrase tags in HTML are used to define the meaning or structure of a section of text, providing semantic context. These tags describe the purpose of the content (e.g., emphasized text, citations, abbreviations), rather than its appearance.
<em>...</em> (Emphasis)
Description: Used to emphasize text.
Effect: Usually italicizes the text by default.
Example
This is <em>important</em> text.
This will produce the following result:
<strong> (Strong Emphasis)
Description: Indicates strong importance or seriousness.
Effect: Usually bolds the text by default.
Example
This is <strong>very important</strong>.
This will produce the following result:
<abbr> (Abbreviation)
Description: Defines an abbreviation or acronym, often with a title attribute for full text.
Example
<abbr title="HyperText Markup Language">HTML</abbr>
This will produce the following result:
<cite> (Citation)
Description: Represents the title of a work (e.g., a book, movie, or research paper).
Effect: Usually italicizes the text.
Example
<cite>The Great Gatsby</cite> is a classic novel.
This will produce the following result:
<code> (Code)
Description: Used to display computer code.
Effect: Displays text in a monospace font.
Example
Use the <code>print()</code> function in Python.
This will produce the following result:
<q> (Quote)
Description: Defines a short inline quotation.
Effect: Adds quotation marks around the text by default.
Example
She said, <q>HTML is easy to learn.</q>
This will produce the following result:
<mark> (Highlight)
Description: Highlights or marks text for reference.
Effect: Usually renders the text with a yellow background.
Example
This is <mark>highlighted</mark> text.
This will produce the following result:
<var> (Variable)
Description: Represents variables or placeholder text in programming or mathematics.
Effect: Usually italicizes the text.
Example
The formula is <var>x</var> + <var>y</var> = 10.
This will produce the following result:
<samp> (Sample Output)
Description: Represents sample output from a computer program.
Effect: Displays text in a monospace font.
Example
The output is <samp>Hello, World!</samp>. This will produce the following result:
<kbd> (Keyboard Input)
Description: Denotes text input via a keyboard.
Effect: Displays text in a monospace font.
Example
Press <kbd>Ctrl</kbd> + <kbd>C</kbd> to copy. This will produce the following result:
<kbd> (Keyboard Input)
<small> (Small Text)
Description: Reduces the size of the text.
Example
This is <small>smaller</smalll> text.This will produce the following result:
<del> (Deleted Text)
Description: Indicates text that has been deleted.
Effect: Strikes through the text.
Example
This is <del>incorrect</del> text.This will produce the following result:
<ins> (Inserted Text)
Description: Denotes text that has been inserted.
Effect: Underlines the text.
Example
This is <ins>new</ins> text.This will produce the following result:
<b> (Bold Text)
Description: Simply makes the text bold without indicating importance.
Example
This is <b>bold</b> text.This will produce the following result:
<i> (Italic Text)
Description: Simply italicizes text without emphasizing it.
This is <i>italic</i> text.This will produce the following result:
