Tuesday, 14 February 2017

Dialog Tag HTML 5

Dialog Tag HTML 5 Example

The HTML <dialog> element represents a dialog box or window. It makes it easy to create popup dialogs and modals on a web page. The <dialog> element accepts a boolean attribute called open that sets the element to "active" and allows users to interact with it.

<html>
<body>

Details Tag HTML 5

Details Tag HTML 5

Detail tag is use to show some detail information about something which you want display in such manner when user can show and details. Like in copyright information in example only copyright small message is displaying and if user wants show detail then he needs to click on arrow symbol.

Note: The details tag is not supported in Internet Explorer.

<html>
<body>

BDI HTML 5

BDI tag isolates its text from default alignment of your HTML setting. Most of website language is English and its default alignment is left to right but when we write something in URDU then as we know alignment of URDU is right to left BDI tag help its alignment as in URDU. To check this then tries to use backspace from your browser. Text will be deleted from left to right.

<ul>
  <li>User <bdi>hrefs</bdi>: 60 points</li>
  <li>User <bdi>jdoe</bdi>: 80 points</li>
  <li>User <bdi>إيان</bdi>: 90 points</li>
</ul>

Next Topic

HTML 5 New Tag List

Page Structure

<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Title of the document</title>
</head>

<body>
    Content of the document......
</body>

</html>

HTML 5 New Tag List

Tag Name
Detail Description
<article>
Defines an article in the document
<aside>
Defines content aside from the page content
Defines a part of text that might be formatted in a different direction from other text
Defines additional details that the user can view or hide
Defines a dialog box or window
Defines a caption for a <figure> element
Defines self-contained content, like illustrations, diagrams, photos, code listings, etc.
<footer>
Defines a footer for the document or a section
<header>
Defines a header for the document or a section
<main>
Defines the main content of a document
<mark>
Defines marked or highlighted text
Defines a command/menu item that the user can invoke from a popup menu
Defines a scalar measurement within a known range (a gauge)
<nav>
Defines navigation links in the document
Defines the progress of a task
<rp>
Defines what to show in browsers that do not support ruby annotations
<rt>
Defines an explanation/pronunciation of characters (for East Asian typography)
<ruby>
Defines a ruby annotation (for East Asian typography)
<section>
Defines a section in the document
<summary>
Defines a visible heading for a <details> element
<time>
Defines a date/time
<wbr>
Defines a possible line-break