Tutorialspoint.dev

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:

    <!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>

    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:

    <!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>

    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:



    <!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>

    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:

    <!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>

    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:

    <!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>

    Output:

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

    <!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>

    Output:



This article is attributed to GeeksforGeeks.org

leave a comment

code

0 Comments

load comments

Subscribe to Our Newsletter