HTML | Quotations

The Quotation elements in HTML are used to insert quoted texts in a web page, that is, portion of texts different from the normal texts in the web page.

Below are some of the most used quotation elements of HTML:

  1. <q> element:
    The <q> element is used to set a set of text inside the quotation marks. It has both opening and closing tags.
    Example:



    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <!DOCTYPE html>
    <html>
    <head>
        <title>Quotations</title>
    </head>
    <body>
        <h3>GeeksforGeeks</h3>
        <p>The quick brown fox jumps over the lazy dog<br></p>
        <!--Inside quotes-->
        <p><q>The quick brown fox jumps over the lazy dog</q></p>
    </body>
    </html>

    chevron_right

    
    

    Output:

  2. <blockquote> element:
    The <blockquote> element is also used for quotations in a different way. Instead of putting the text in quotes, it changes the alignment to make it unique from others. It has both opening and closing tags.
    Example:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <!DOCTYPE html>
    <html>
    <head>
        <title>Blockquote</title>
    </head>
    <body>
        <h3>GeeksforGeeks</h3>
        <p>The quick brown fox jumps over the lazy dog<br></p>
        <!--Inside blockquotes-->
        <p><blockquote>The quick brown fox jumps 
    over the lazy dog</blockquote></p>
    </body>
    </html>

    chevron_right

    
    

    Output:

  3. <address> element:
    Using the <abbr> element, we can define an address in a webpage and the text put inside the address tag will be emphasized. It has both opening and closing tags.
    Example:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <!DOCTYPE html>
    <html>
    <head>
        <title>Address</title>
    </head>
    <body>
        <h3>GeeksforGeeks</h3>
        <address>
        <p>Address:<br>
        710-B, Advant Navis Business Park,<br>
        Sector-142, Noida Uttar Pradesh – 201305</p>
        </address>
    </body>
    </html>

    chevron_right

    
    

    Output:

  4. <abbr> element:
    The <abbr> element is used to define a text as an acronym or abbreviations. It has both opening and closing tags. This is useful for browsers and search engines.
    Example:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <!DOCTYPE html>
    <html>
    <head>
        <title>Abbreviations</title>
    </head>
    <body>
        <h3>GeeksforGeeks</h3>
        <!--Here the marked text is the acronym-->
        <p>Welcome to <abbr title="GeeksforGeeks">GfG</abbr></p>
    </body>
    </html>

    chevron_right

    
    

    Output:

  5. <bdo> element:
    The <bdo> element is used to define a bidirectional override which means that the text written from right to left or left to right. It has both opening and closing tags. It is used to over-ride the current text direction.It takes an attribute “rtl” to display the text from right to left.
    Example:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <!DOCTYPE html>
    <html>
    <head>
        <title>Bidirectional</title>
    </head>
    <body>
        <h3>GeeksforGeeks</h3>
        <!--Normal text-->    
        <p>The quick brown fox jumps over the lazy dog<br></p>
        <!--Inside <bdo> tag-->
        <p><bdo dir="rtl">The quick brown fox jumps 
    over the lazy dog</bdo></p>
    </body>
    </html>

    chevron_right

    
    

    Output:

  6. <cite> element:
    This element is used define a title of a work and emphasizes a text.
    Example:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <!DOCTYPE html>
    <html>
    <head>
        <title>Cite</title>
    </head>
    <body>
        <h3>GeeksforGeeks</h3>
        <!--The title is kept in cite tag-->
        <p>The <cite>GeeksforGeeks</cite> is the best site to<br>
        to search for articles and practice problems.</p>
    </body>
    </html>

    chevron_right

    
    

    Output:



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.



Improved By : davidhandl