HTML | Phrase Tag

Phrase Tag: In HTML, phrase tag is used to indicate the structural meaning of a block of text. For example, abbr tag indicates that the phrase contained the abbreviation word. Some examples of phrase tags are: abbr, strong, mark, . . . etc.

Emphasized Text: The em tag is used to emphasized the text and this tag displays the italic font in a browser. It simply means anything written within em tag is shown as emphasized Text.
Syntax:

<em> Text Content </em>

Example:



filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>Emphasized Text</title>
        <style>
            .gfg {
                font-size:40px;
                color:#090;
                font-weight:bold;
                text-align:center;
            }
            p {
                font-size:20px;
                text-align:center;
            }
        </style>
    </head>
    <body>
        <div class = "gfg">GeeksforGeeks</div>
        <p><em>GeeksforGeeks</em> emphasized tag</p>
    </body
</html>                    

chevron_right


Output:
emphasize tag

Text Abbreviation: To abbreviate a text in HTML use abbr tag. Abbreviation of text written within opening and closing abbr tag.
Syntax:

<abbr title = "GeeksforGeeks">GFG</abbr>

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>Text Abbreviation</title>
        <style>
            .gfg {
                font-size:40px;
                color:#090;
                font-weight:bold;
                text-align:center;
            }
            p {
                font-size:20px;
                text-align:center;
            }
        </style>
    </head>
    <body>
        <div class = "gfg">GeeksforGeeks</div>
        <p><abbr title = "GeeksforGeeks">GFG</abbr> abbreviation tag</p>
    </body
</html>        

chevron_right


Output:
text abbreviation tag



Acronym Element This tag is used to indicate that the content written inside opening and closing acronym tag is an acronym.
Syntax:

<acronym> Text Content </acronym>

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>Acronym tag</title>
        <style>
            .gfg {
                font-size:40px;
                color:#090;
                font-weight:bold;
                text-align:center;
            }
            p {
                font-size:20px;
                text-align:center;
            }
        </style>
    </head>
    <body>
        <div class = "gfg">GeeksforGeeks</div>
        <p><acronym>GeeksforGeeks</acronym> acronym tag</p>
    </body
</html>                    

chevron_right


Output:
acronym tag

Text Direction: The bdo tag stands for Bi-directional Override. It is used to override the current text direction. Default text direction is from left to right. But it can override by using bdo tag.

  • ltr: specifies text direction from left to right.
  • rtl: specifies text direction from right to left.
  • auto: In this tag, browser figure out the text direction, based on the content (only recommended if the text direction is unknown).

Syntax:

<bdo dir = "ltr/rtl/auto"> Text Content </bdp>

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>Text decoration tag</title>
        <style>
            .gfg {
                font-size:40px;
                color:#090;
                font-weight:bold;
                text-align:center;
            }
            p {
                font-size:20px;
                text-align:center;
            }
        </style>
    </head>
    <body>
        <div class = "gfg">GeeksforGeeks</div>
        <p>GeeksforGeeks text decoration tag</p>
        <p><bdo dir = "rtl">GeeksforGeeks text decoration tag</bdo></p>
    </body
</html>                    

chevron_right


Output:
text decoration tag

Short Quotations: To add double quotes within a sentence use q tag. The content written inside opening and closing q tag will be printed in quotes.
Syntax:



<q> Text Content </q>

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>Quotation tag</title>
        <style>
            .gfg {
                font-size:40px;
                color:#090;
                font-weight:bold;
                text-align:center;
            }
            p {
                font-size:20px;
                text-align:center;
            }
        </style>
    </head>
    <body>
        <div class = "gfg">GeeksforGeeks</div>
        <p><q>GeeksforGeeks</q> quotation tag</p>
    </body
</html>        

chevron_right


Output:
short quotation tag

Marked Text: The content written within open and close mark tag will display as yellow mark. Basically it works like highlighter and it is used to highlight some words in a sentence.
Syntax:
<mark> Text Content </mark>
Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>Mark tag</title>
        <style>
            .gfg {
                font-size:40px;
                color:#090;
                font-weight:bold;
                text-align:center;
            }
            p {
                font-size:20px;
                text-align:center;
            }
        </style>
    </head>
    <body>
        <div class = "gfg">GeeksforGeeks</div>
        <p><mark>GeeksforGeeks</mark> mark tag</p>
    </body
</html>        

chevron_right


Output:
marked tag

Strong Text: The strong tag is used to show important words in a sentence. The content written within open and close strong tag will display as important word.
Syntax:

<strong> Text Content </strong>

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>strong tag</title>
        <style>
            .gfg {
                font-size:40px;
                color:#090;
                font-weight:bold;
                text-align:center;
            }
            p {
                font-size:20px;
                text-align:center;
            }
        </style>
    </head>
    <body>
        <div class = "gfg">GeeksforGeeks</div>
        <p><strong>GeeksforGeeks</strong> strong tag</p>
    </body
</html>        
<head>

chevron_right


Output:
strong tag

Quoting Text: The blockquote tag is used in quotation sentence. It means the content written in between open and close blockquote tag will be considered as a quoting text.
Syntax:
<blockquote> Text Content </blockquote>
Example:



filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>Blockquote tag</title>
        <style>
            .gfg {
                font-size:40px;
                color:#090;
                font-weight:bold;
                text-align:center;
            }
        </style>
    </head>
    <body>
        <div class = "gfg">GeeksforGeeks</div>
        <blockquote>GeeksforGeeks is a computer science
        portal where you can learn programming. It contains
        well written, well thought and well explained 
        computer science and programming articles, quizzes
        and ...</blockquote>
    </body
</html>        
<head>

chevron_right


Output:
blockquote tag

Programming Code: To represent programming code in html code tag is used. The content written within opening and closing code tag is considered as programming code.
Syntax:

<code> Text Content </code>

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>code tag</title>
        <style>
            .gfg {
                font-size:40px;
                color:#090;
                font-weight:bold;
                text-align:center;
            }
            p {
                font-size:20px;
                text-align:center;
            }
        </style>
    </head>
    <body>
        <div class = "gfg">GeeksforGeeks</div>
        <p><code>GeeksforGeeks Programming</code> code tag</p>
    </body>
</html>                    

chevron_right


Output:
code tag

Program Output: The output of program written in samp tag. The content written within opening and closing samp tag will print the sample output.
Syntax:

<samp> Text Content </samp>

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>Program output tag</title>
        <style>
            .gfg {
                font-size:40px;
                color:#090;
                font-weight:bold;
                text-align:center;
            }
            p {
                font-size:20px;
                text-align:center;
            }
        </style>
    </head>
    <body>
        <div class = "gfg">GeeksforGeeks</div>
        <p><samp>GeeksforGeeks</samp> program output tag</p>
    </body>
</html>                    

chevron_right


Output:
output tag

Address Text: The address tag is used to display the address in web browser. The content written within opening and closing address tag is considered as an address in HTML.
Syntax:

<address> Text Content </address>

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>Address tag</title>
        <style>
            .gfg {
                font-size:40px;
                color:#090;
                font-weight:bold;
                text-align:center;
            }
            address {
                font-size:20px;
                text-align:center;
            }
        </style>
    </head>
    <body>
        <div class = "gfg">GeeksforGeeks</div>
        <address>GeeksforGeeks office, sector-142, Noida, India</address>
    </body>
</html>                    

chevron_right


Output:
address tag



My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.




Article Tags :
Practice Tags :


Be the First to upvote.


Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.