HTML5 Tutorial HTML5 is a Web page (or HTML document) in a plain text file that has been encoded using Hypertext Markup Language (HTML) to appear in a Web browser. Here is a meaning of HTML word-by-word:
Hypertext: – is a text that a user will click to jump from one document to another document. This is a reference of Web pages to link to one another.
Markup: – are the tags that apply layout and formatting conventions to plain text. In a simple way, the plain text is “marked up” with the tags.
Language: – is a reference to the fact that HTML is considered as a programming language.
The <figure> Element is used to call an image file inside the fixed container. There are some attributes of <figure> element:- Accesskey Class Contenteditable Contextmenu Dir Draggable Hidden Id Lang Spellcheck Style Tabindex title Here we will illustrate an example putting the <figure> element in the script: Code Output
The <footer> Element is used define the Footer area of the page. The <footer> element contains information about its containing element. A <footer> element contain the following information. Authorship information copyright information Contact information Sitemap back to top links Related documents A user can define several <footer> elements in one document. There are some attributes of <footer> element:- Accesskey Class Contenteditable Contextmenu Dir Draggable Hidden …
The <header> element is used for defining the header for a particular document or section. The <header> element is a container for the introductory content or a set of navigational links. A <header> element contains: one or more heading elements (<h1> – <h6>) logo or icon authorship information A user can define several <header> elements in one document. There are some attributes of <header> element:- …
The <keygen> tag represents key-pair generator controls for private and public keys used for forms. When the form is submitted, the private key is stored locally, and the public key is sent to the server. There are some attributes of <keygen> element:- Autofocus Challenge Disabled Form Keytype name Here we will illustrate an example putting the <keygen> element in the script: …
The <mark> Element is basically used to highlight the text with another background color, which attracts the reader and focus the particular text for the reference using. There are some attributes of <mark> element:- accesskey class contenteditable contextmenu dir draggable hidden id Lang Spellcheck Style Tabindex title Here we will illustrate an example putting the <mark> element in the script: Code …
The <meter> Element is basically used for scalar measurement for known range or known a fractional value. There are six attributes allowed in <meter> Element:- Value Min Max High Low Optimum Form Here we will illustrate an example putting the <meter> element in the script: Code Output
The <nav> Element is basically used to define a set of navigational links. It can be defined as a section of page or part of a page which links to another page or parts within the page. The <nav> element is also common for footer section for linking to another page and for sidebar menu. There are some attributes of <nav> element:- …
The <output> element is a control that displays the result of a calculation. There are some attributes of <output> element:- For Form Name Here we will illustrate an example putting the <output> element in the script: Code Output
The <progress> Element is used to show the completion or progress of a specific task. We often see that on the website while downloading some text or video and even on uploading some contents on Internet, a progress bar comes before us and displays its current progress or completion of the specific task. There are some attributes …
The <rp> element is part of the <ruby> element, which displays annotations for text. The <rp> element encloses its text in parentheses inside the ruby text.
The <ruby> Element is used to properly rendering the East Asian’s languages. The <ruby> Element is basically used to give a pronunciation help in a phonetic script for Chinese, Japanese and Korean languages. There are mainly three attributes can be called with RUBY Element. rt (ruby text) rp (ruby parenthesis) and rb (ruby base).
The < Source > Element The <source> Element is used as a child element of AUDIO and VIDEO Element. It searches the source file and call it inside the main element. The <source> Element contains mainly three attributes:- src (media file searching) type (media file format) and media
The <time> element represents a human-readable date/time. This element can also be used to encode dates and times in a machine-readable way so that user agents can offer to add birthday reminders or scheduled events to the user’s calendar, and search engines can produce smarter search results. Here we will illustrate an example putting the <time> element in the …
Applying Table Borders While creating a Table using the default settings are quite plain, so it is difficult to distinguish between where one cell ends and the next cell begins. To overcome or to reduce this problem, a user can place borders around cells. A user can also fill (shade) certain cells to make them …
Applying Borders by Using Attributes in HTML5 By default, a table has no border. To add a one-pixel border around both side of the table as around each individual cell. To add attribute to the <table> tag, use this text Like :- <table border=”1″> The value of the border attribute increases the width of the …
Applying Borders by Using Styles InHTML5 You can also apply borders by using cascading style sheets (CSS), which is the most flexible and consistent method. There are certain attributes that are used <table> and <td> tags. The border-width attribute controls the thickness of the border. Specify a value in pixels. The border-color attribute controls the color of the border. Specify a color by …
Here, you will learn how to apply a different color background to a heading row to make it exceptional or change the color of every other line in a table to help users to track a line across the table. To apply a background color to a table, use the background-color. Like :- <tr style=”background-color: pink”> …
How to Applying Background and Foreground Fills HTML Read More »
Cell padding, cell spacing, and cell alignment are three different ways by which you can control how cell content appears on a page. Let us discuss the following concepts:-cell padding, cell spacing, and alignment. Cell Padding – refers to space between the cell border and the text or graphic within it. Cell Spacing – refers to the …
Setting Cell Padding To set the padding for the entire table, use the cellpadding attribute in the <table> tag. Like :- <table cellpadding=”4px”> To set the padding for an individual cell, use the padding attribute in a style. Like :- <td style=”padding: 4px”>
Setting Cell Spacing The default table border looks like a double line, but this effect is just a combination of the border around the table as a whole and the border around each cell. The double effect is created by the spacing between the cells. To make the borders a single solid line between one …