HTML Root Tags represent the main or the starting tag that should be present in all the HTML documents. The HTML tag is the first tag that comes after the <!DOCTYPE> tag and within which other HTML tags are specified. This tag allows the browser to identify the document type.
As the HTML tag is the root tag of the HTML document, so the following table provides the description of the attributes of the HTML tag:
| Attribute | Value | Description |
|---|---|---|
| class | class-name | Specifies the class for an element in an HTML document |
| id | unique-id | Specifies a unique alphanumeric identifier for an element |
| dir | ltr - left to right rtl - right to left |
Specifies the direction of the text for the content in an element |
| lang | language-code | Specifies the base language used for an element |
| xmlns | http://www.w3.org/1999/xhtml | Declares a namespace for tags used in an HTML document |
| xml:lang | language-code | Specifies the base language used for an element in the eXtensible HyperText Markup Language (XHTML) documents |
| hidden | hidden | Declares an element as a hidden element. Hidden element are not displayed in the document |
| manifest | Universal Resource Locator (URL) | Defines a URL containing the document's cache information |
| contextmenu | menu-id | Specifies the context menu for an element |
| contenteditable | true, false | Specifies whether or not you can edit the content in the document |
| accesskey | character | Specifies a keyboard shortcut to access an element |
| draggable | true, false, auto | Specifies whether or not you can drag an element |
| tabindex | number | Specifies the tab order index of an element |
| spellcheck | true, false | Specifies whether an element should be checked for spelling and grammar or not |
| style | style-definition | Specifies an inline style in the HTML document by using the <style> element |
| title | text | Specifies the title of an HTML document |
Here is an example of root tags in HTML:
<!DOCTYPE HTML>
<html>
<head>
<title>HTML Root Tag Example</title>
<style>
#top{ color:red; }
#middle{ color:blue; }
.para{ color:green; }
</style>
</head>
<body>
<h1 id="top">HTML Root Tag (top)</h1>
<p class="para">HTML Root Tag (para)</p>
<h2 id="middle">HTML Root Tag (middle)</h2>
<p class="para">HTML Root Tag (para)</p>
</body>
</html>
Here is the sample output produced by the above HTML Root Tags Example code:
Here is another HTML Root Tag example.
<!doctype html>
<html>
<head>
<title>HTML Root Tag Example</title>
<meta name="tutorial" content="tutorial on root tags">
<style type="text/css">
body{color:green;}
</style>
</head>
<body>
<h1>HTML Root Tag</h1>
<p>This content is related to HTML Root Tag with example.</p>
<a href="http://codescracker.com/html/html-basic-tags.htm">HTML Basic Tags</a> -
<a href="http://codescracker.com/html/html-elements.htm">HTML All Tags</a>
</body>
</html>
Following is the sample output of the above HTML root tags example code:
