web analytics
Working with HTML5 Options

codeling 1392 - 5889
@2021-01-14 13:05:21

HTML5 is a markup language used for structuring and presenting content on the World Wide Web. It is the fifth and last major HTML version that is a World Wide Web Consortium (W3C) recommendation.

HTML5 was first released in a public-facing form on 22 January 2008, with a major update and "W3C Recommendation" status in October 2014. Its goals were to improve the language with support for the latest multimedia and other new features; to keep the language both easily readable by humans and consistently understood by computers and devices such as web browsers, parsers, etc., without XHTML's rigidity; and to remain backward-compatible with older software. HTML5 is intended to subsume not only HTML 4 but also XHTML 1 and DOM Level 2 HTML.


@2021-01-14 17:02:16

HTML5 Elements

The following list contains all elements belonging to the latest HTML5.

Root Element

  • <html>: Defines the root of an HTML document.

Document Metadata Elements

  • <head>: Defines the head portion of the document that contains information about the document such as title.

  • <title>: Defines a title for the document.

  • <base>: Defines the base URL for all relative URLs in a document.

  • <link>: Defines the relationship between the current document and an external resource.

  • <meta>: Provides structured metadata about the document content.

  • <style>: Inserts style information (commonly CSS) into the head of a document.

Scripting Elements

  • <script>: Places script in the document for client-side processing.

  • <noscript>: Defines alternative content to display when the browser doesn't support scripting.

Section Elements

  • <body>: Defines the document's body.

  • <section>: Defines a section of a document, such as header, footer etc.

  • <nav>: Defines a section of navigation links.

  • <article>: Defines an article.

  • <aside>: Defines some content loosely related to the page content.

  • <h1> to <h6>: Defines HTML headings.

  • <header>: Represents the header of a document or a section.

  • <footer>: Represents the footer of a document or a section.

  • <address>: Specifies the author's contact information.

Grouping Content Element

  • <p>: Defines a paragraph.

  • <hr>: Produce a horizontal line.

  • <br>: roduces a single line break.

  • <pre>: Defines a block of preformatted text.

  • <dialog>: Defines a dialog box or subwindow.

  • <blockquote>: Represents a section that is quoted from another source.

  • <ol>: Defines an ordered list.

  • <ul>: efines an unordered list.

  • <li>: Defines a list item.

  • <dl>: Defines a description list.

  • <dt>: Defines a term (an item) in a description list.

  • <dd>: represents the description, definition, or value, part of a term-description group in a description list (dl element), and the discourse, or quote, part in a conversation (dialog element).

Text-Level Semantics Elements

  • <a>: Defines a hyperlink.

  • <q>: Defines a short inline quotation.

  • <cite>: Indicates a citation or reference to another source.

  • <em>: Defines emphasized text.

  • <strong>: Indicate strongly emphasized text.

  • <small>: isplays text in a smaller size.

  • <mark>: Represents text highlighted for reference purposes.

  • <dfn>: Specifies a definition.

  • <abbr>: Defines an abbreviated form of a longer word or phrase.

  • <time>: Represents a time and/or date.

  • <progress>: Represents the completion progress of a task.

  • <meter>: Represents a scalar measurement within a known range.

  • <code>: pecifies text as computer code.

  • <var>: efines a variable.

  • <samp>: pecifies text as sample output from a computer program.

  • <kbd>: Specifies text as keyboard input.

  • <sub>: Defines subscripted text.

  • <sup>: Defines superscripted text.

  • <span>: Defines an inline styleless section in a document.

  • <i>: Displays text in an italic style.

  • <b>: Displays text in a bold style.

  • <bdo>: Overrides the current text direction.

  • <ruby>: Represents a ruby annotation.

  • <rt>: Defines the pronunciation of character presented in a ruby annotations.

  • <rp>: Provides fall-back parenthesis for browsers that that don't support ruby annotations.

Edit Elements

  • <ins>: Defines a block of text that has been inserted into a document.

  • <del>: Represents text that has been deleted from the document.

Embedded Content Elements

  • <figure>: Represents a figure illustrated as part of the document.

  • <img>: Represents an image.

  • <iframe>: Displays a URL in an inline frame.

  • <embed>: Embeds external application, typically multimedia content like audio or video into an HTML document.

  • <object>: Defines an embedded object.

  • <param>: Defines a parameter for an object or applet element.

  • <video>: Embeds video content in an HTML document.

  • <audio>: Embeds a sound, or an audio stream in an HTML document.

  • <source>: Defines alternative media resources for the media elements like <audio> or <video>.

  • <canvas>: Defines a region in the document, which can be used to draw graphics on the fly via scripting (usually JavaScript).

  • <map>: Defines a client-side image-map.

  • <area>: Defines a specific area within an image map.

Tabular Data Elements

  • <table>: Defines a data table.

  • <caption>: Defines the caption or title of the table.

  • <colgroup>: Specifies attributes for multiple columns in a table.

  • <col>: Defines attribute values for one or more columns in a table.

  • <tbody>: Groups a set of rows defining the main body of the table data.

  • <thead>: Groups a set of rows that describes the column labels of a table.

  • <tfoot>: Groups a set of rows summarizing the columns of the table.

  • <tr>: Defines a row of cells in a table.

  • <td>: Defines a cell in a table.

  • <th>: Defines a header cell in a table.

Form Elements

  • <form>: Defines an HTML form for user input.

  • <fieldset>: Specifies a set of related form fields.

  • <label>: Defines a label for an <input> control.

  • <input>: Defines an input control.

  • <button>: Creates a clickable button.

  • <select>: Defines a selection list within a form.

  • <datalist>: Represents a set of pre-defined options for an <input> element.

  • <optgroup>: Defines a group of related options in a selection list.

  • <option>: Defines an option in a selection list.

  • <textarea>: Defines a multi-line text input control (text area).

  • <output>: Represents the result of a calculation.

Interactive Elements

  • <details>: Represents a widget from which the user can obtain additional information or controls on-demand.

  • <command>:  Represents a command that the user can invoke.

  • <bb>: Represents a user agent command that the user can invoke.

  • <menu>: Represents a list of commands.

Miscellaneous Elements

  • <legend>: Defines a caption for a <fieldset> element.

  • <div>: Specifies a division or a section in a document.

@2021-01-15 15:05:39

Declaring your web page as HTML5

We recommend that you declare a true DOCTYPE within your web page. Within the examples here, we've declared our applications as HTML5 using the simple HTML5 DOCTYPE as shown below:

<!DOCTYPE html>

Most current browsers will render content that is declared with this DOCTYPE in "standards mode" which means that your application should be more cross-browser compliant. The DOCTYPE is also designed to degrade gracefully; browsers that don't understand it will ignore it, and use "quirks mode" to display their content.

@2021-02-08 22:21:31

<noscript> Element

In this HTML5 page example, a <script> tag is placed within the <body> tag to reference a javascript file called examples.js. Following that is a <nonscript> tag that will display alternate content if the <script> tag does not run (ie: either the browser's scripting has been disabled or the script type is not supported).

<!doctype html>

<meta charset="UTF-8">
<title>noscript element example</title>

<h1>Heading 1</h1>
<p>This is a paragraph.</p>
<script src="/scripts/examples.js"></script>
  <p>This is a <a href="examples.html">this is alternate content link if scripting is disabled</a>.</p>


You must Sign In to comment on this topic.

© 2021 Digcode.com