Tech Honey

The #1 Website for Oracle PL/SQL, OA Framework and HTML

HTML Nav Tag

by

HTML Nav TagHTML Nav Tag <nav> is used to define a section of links, used for navigation, in an HTML Resource or webpage.

It’s not important to keep all the links of a resource or webpage in the HTML Nav tag, only the major and important links should be kept in the Nav tag .

HTML Nav Tag <nav> is a closed tag and needs a closing Nav Tag </nav>.

Syntax of HMTL Nav Tag

<nav>
Some links here..
</nav>

Example of HTML Nav Tag

HTML Nav Tag Code Output 
<nav>
<a href="http://techhoney.com/oracle-sql-plsql/">PL/SQL</a>,
<a href="http://techhoney.com/category/oaf-miscellaneous/">OA Framework</a>,
</nav>

In the example above we can see that we have created 2 links, one for Oracle PL/SQL and another for OA Framework by using  Nav HTML Tag.

Once we click on any of the link we will be able to navigate to the corresponding page and view all the content.

HTML Nav Tag supports all HTML Global Attributes and HTML Event Attributes

HTML Nav Tag Supporting Browsers

S. No. Browser Supported(Yes/No)
1 Internet Explorer Yes (from IE-9 onwards)
2 Firefox Yes
3 Google Chrome Yes
4 Opera Yes
5 Safari Yes

HTML S Tag

by

HTML S Tag <s> is used when we want to render a strikethrough text on a browser.

Any text within the HTML S tag <s> will be rendered as strikethrough, a strikethrough text is the one in which there is a cut like line passing through the text.

S tag <s> is a closed tag and needs a closing HTML S tag </s>

Syntax of HTML S Tag

<s>
Some text here
</s>

Example of HTML S Tag

HTML S Tag Code Output 
<p> <s>I have a black dog. </s></p>
<p> Now I have a new fawn dog </p>
I have a black dog.

Now I have a new fawn dog

In the above S Tag output we can see that the text “I have a black dog” is being rendered as cut or strikethrough because we have wrapped it within the HTML 5 S tag.

HTML S Tag Supports all HTML Global Attributes and HTML Event Attributes.

HTML S Tag Supporting Browsers

S. No. Browser Supported(Yes/No)
1 Internet Explorer Yes
2 Firefox Yes
3 Google Chrome Yes
4 Opera Yes
5 Safari Yes

HTML Span Tag

by

HTML Span TagHTML Span Tag <span> is used to group certain elements within an HTML resource or webpage.

HTML Span Tag <span> usage itself will not change the way in which the spanned part of HTML resource is rendered, but yes by using the span HTML Tag we can change the way an element appears in a browser.

Once an element or a portion of HTML resource is wrapped within the span HTML Tag, we can then style the element with CSS Properties or even Javascript.

HTML Span tag <span> is a closed tag and hence needs a closing HTML Span tag </span>.

Syntax of using HTML Span Tag

<span>
Some text Here …
</span>

Example of using HTML Span Tag

HTML Span Tag Code Output 

 I have two cars.
One is <span style="&quot;color: red; font-weight: bold;"> RED </span>
and other is <span>GREEN
</span>.
I have two cars. One is RED and other is GREEN.

In the HTML Span Tag example above we can see that the output contains the text “RED” and “GREEN” in red and green colors respectively. What we have done here is that we have formatted the “RED” and “GREEN” text using the Span HTML Tag so that they appear bold and in red and green color.

HTML Span Tag Support all HTML Global Attributes and HTML Event Attributes.

HTML Span Tag Supporting Browsers

S. No. Browser Supported(Yes/No)
1 Internet Explorer Yes
2 Firefox Yes
3 Google Chrome Yes
4 Opera Yes
5 Safari Yes

HTML DT Tag

by

HTML DT Tag <dt> is used to identify an item in a definition list.

HTML DT Tag is used with the HTML DD Tag <dd> (characterize items in list of definitions) and with HTML DL Tag <dl> (list of definition).

DT Tag is a closed tag and needs to be closed using HTML closing DT Tag </dt>

Syntax of HTML DT Tag

<dt>
Item goes here
</dt>

Example of HTML DT Tag

HTML dt Tag Code Output 
<dl>
<dt>Sugar</dt>
<dd>Sweet in Taste<dd>
<dt>Salt</dt>
<dd>Salty in Taste</dd>
</dl>
Sugar
Sweet in Taste
Salt
Salty in Taste

In the example output observe that we have used the HTML dt tag to identify items that we have described in the list.

Also note the usage of HTML DD Tag and HTML DL Tag in the example.

HTML dt tag supports all HTML Global Attributes and HTML Event Attributes.

HTML DT Tag Supporting Browsers

S. No. Browser Supported(Yes/No)
1 Internet Explorer Yes
2 Firefox Yes
3 Google Chrome Yes
4 Opera Yes
5 Safari Yes

HTML Dl Tag

by

HTML DL Tag <dl> is used to define a definition list.

DL tag is used with the HTML dd tag <dd> (characterize items in list of definitions) and with HTML dt Tag <dt> (name the items in the list of definition).

HTML dl tag is a closed tag and needs to be closed using HTML closing dl tag </dl>

Syntax of HTML DL Tag

<dl>
List goes here
</dl>

Example of HTML DL Tag

HTML dl Tag Code Output 
<dl>
<dt>Sugar</dt>
<dd>Sweet in Taste</dd>
<dt>Salt</dt>
<dd>Salty in Taste</dd>
</dl>
Sugar
Sweet in Taste
Salt
Salty in Taste

In the example output observe that we have used the DL Tag to create a list of definitions having items as “Sugar” and “Salt” and respective properties in dd tag.

Also note the usage of HTML dd tag and HTML dt tag in the example.

HTML DL tag supports all HTML Global Attributes and HTML Event Attributes.

HTML DL Tag Supporting Browsers

S. No. Browser Supported(Yes/No)
1 Internet Explorer Yes
2 Firefox Yes
3 Google Chrome Yes
4 Opera Yes
5 Safari Yes