• Tech
  • Forums
  • Jobs
  • Books
  • Events
  • Videos
  • Live
    • Interviews
    • Certification
    • Training
    • Career
    • Members
    • News
    • Blogs
  • An Article
  • A Blog
  • A Video
  • An Ebook
  • An Interview Question
  • Feed
  • Dashboard
  • Wallet
  • Learn
  • Achievements
  • Network
  • Rewards
  • SharpGPT
  • Premium
  • Register
  • Login
HTML 5

Working With the <dl>, <dt> and <dd> Tags

  • WhatsApp
  • Valon Ademi
  • 13y
  • 25.8k
  • 0
  • 0
    • 100
  • Article
dl-dt-dd.zip


The HTML5 dl, dt and dd tags used to list data.

The <dl> tag is used to specify (start) the definition list. This tag is commonly used to implement a glossary. You can put only <dt> and <dd> tags inside the <dl> tag.

The <dt> tag is used to specify the definition terms or items in a definition list. You can put paragraphs, line breaks, images, links, lists, etc. inside the <dd> tag. You can also use a <dt> tag within <details> and <figure> tags to represent a caption for content.

The <dd> tag is used to describe an item within a list of defined terms enclosed by a definition list. You can put paragraphs, line breaks, images, links, lists, etc inside the <dd> tag.Syntax

<dl>
        <dt></dt>
             <dd>
             </dd>
</dl>

Element-Specific Attribute for <dl> tag

compact This attribute reduces the white space between list items.

Element-Specific Attribute for <dt> and <dd> tag

nowrap This attribute is used to control the wrapping of text within a <dd> tag. This attribute ensure that the contents always remain as they are, and don't wrap. If set to yes, text should not wrap. The default is no. CSS (style sheet) should be
used instead of this attribute.

HTML5 Event Attributes

onabort; onblur oncanplay
oncanplaythrough onchange onclick
oncontextmenu ondblclick ondrag
ondragend ondragenter ondragleave
ondragover ondragstart ondrop
ondurationchange onemptied onended
onerror onfocus onformchange
onforminput oninput oninvalid
onkeydown onkeypress onkeyup
onload onloadeddata onloadedmetadata
onloadstart onmousedown onmousemove
onmouseout onmouseover onmouseup
onmousewheel onpause onplay
onplaying onprogress onratechange
onreadystatechange onscroll onseeked
onseeking onselect onshow
onstalled onsubmit onsuspend
ontimeupdate onvolumechange onwaiting

Code:

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <h5>
        start &lt;dl&gt; tag </h5>
    <dl>
        <dt>This is first dt tag defines items in the list</dt>
        <dd>
            This is first dd tag describe an item in a definition list.</dd>
        <dt>This is second defines items in the list</dt>
        <dd>
            This is second dd tag describe an item in a definition list.</dd>
    </dl>
    <h5>
        close &lt;dl&gt; tag</h5>
    <br /><br /><br /><br />
    <dl>
        <dt>Our Network</dt>
        <dd>
            .NET Heaven
        </dd>
        <dd>
            C# Corner
        </dd>
        <dd>
            DbTalks
        </dd>
        <dd>
            Interview Corner
        </dd>
        <dd>
            Longhorn Corner
        </dd>
        <dd>
            Mindcracker
        </dd>
        <dd>
            VB.NET Heaven</dd>
    </dl>
    <br /><br /><br /><br />
    <dl>
        <dt>Our Network</dt>
        <dd>
            <a href="http://www.dotnetheaven.com/">.NET Heaven</a></dd>
        <dd>
            <a href="http://www.c-sharpcorner.com/">C# Corner</a>
        </dd>
        <dd>
            <a href="http://www.dbtalks.com/">DbTalks</a>
        </dd>
        <dd>
            <a href="http://www.interviewcorner.com/">Interview Corner</a>
        </dd>
        <dd>
            <a href="http://www.longhorncorner.com/">Longhorn Corner</a>
        </dd>
        <dd>
            <a href="http://www.mindcracker.com/">Mindcracker</a>
        </dd>
        <dd>
            <a href="http://www.vbdotnetheaven.com/">VB.NET Heaven</a></dd>
    </dl>
</body>
</html>

Output

Internet Explorer

dl,dt,dd tag

Chrome

dl,dt,dd tag

Fire Fox

dl,dt,dd tag

Safari

dl,dt,dd tag

Opera

dl,dt,dd tag

  • css
  • dd tag
  • dl dt dd tag in html5
  • dl tag
  • dt tag
  • HTML5
  • XHTML
Up Next
    Ebook Download
    View all
    C# Corner Ebook
    New Layout Design using HTML and CSS
    Read by 1 people
    Download Now!
    Learn
    View all
    Learn Image
    Learn HTML 5, HTML 5
    Leaderboard
    View all
    Sarthak Varshney

    Sarthak Varshney
    +0
    Deepak Tewatia

    Deepak Tewatia
    +0
    View all
    Yesterday's leader
    Sarthak Varshney  
    Sarthak Varshney
    Pune (India)
    70
    102
    1.7k
    100
    Member of the month
    Rinki  
    Rinki
    Chennai (India)
    15
    5.4k
    14.8k
    50
    Speaker of the month
    Shivam Payasi  
    Shivam Payasi
    C#, .NET
    Chitrakoot (India)
    8
    21.1k
    19.7k
    10
    Upcoming events
    View all
    • The Cloud Show with Magnus Mårtensson ft. Oscar Garcia Colon - Ep: 45
    • Bhubaneswar Chapter
    • Building Websites with Microsoft Power Pages: Exploring WebPage, WebTemplate, and Page Templates - Microsoft Business Application Ep. 25
    Suggested for you
    View all
    Harshit Pandey Harshit Pandey
    Follow
    Praveen Moosad Praveen Moosad
    Follow
    Rathrola Prem Kumar Rathrola Prem Kumar
    Follow
    Jemmy Jackson James Jemmy Jackson James
    Follow
    Priyanshu Agnihotri Priyanshu Agnihotri
    Follow

    CSharpBot

    Get Started

    You need to be a premium member to use this feature. To access it, you'll have to upgrade your membership.

    Become a sharper developer and jumpstart your career.

    Basic

    $0

    $

    . 00

    monthly

    Sign-Up Now

    For Basic members:

    • Standard Profile
    • Access learning courses
    • Access free e-books
    • 1x point
    Premium

    $20

    $

    . 00

    monthly

    Sign-Up Now

    For Premium members:

    • Earn 2x reward points
    • Premium profile with Verified check
    • Premium Avatar with status update
    • Learning courses
    • Unlimited Certifications and badges on profile
    • Unlimited Book downloads
    • Access to Premium content
    • Online Training
    • Unlimited PDF conversions and downloads
    • Professional Resume Writing
    • Interview Preparations Guide
    • 25 messages per month
    • 1 "Kodzu" avatar, basic
    Elite

    $45

    $

    . 00

    monthly

    Sign-Up Now

    For Elite members:

    • Bundle E-books
    • Access to all Learn Series
    • Unlimited Apply Jobs
    About Us Contact Us Privacy Policy Terms Media Kit Partners C# Tutorials Consultants Ideas Report A Bug FAQs Certifications Sitemap Stories CSharp TV DB Talks Let's React Web3 Universe Interviews.help Jumpstart Blockchain Build with JavaScript

    ©2024 C# Corner.

    All contents are copyright of their authors.