HTML Common Tags or Elements

Blog Desk May 1, 2021 4795 No Comments

HTML Common Tags or Elements

HTML common Tags or Elements are as follows:

HTML Heading Style

HTML Provides 6 types of heading style. The largest heading style is <h1> and smallest heading style is <h6>


<h1>Heading Text </h1>
<h2>Heading Text</h2>
<h3>Heading Text</h3>
<h4>Heading Text</h4>
<h5>Heading Text</h5>
</h6>Heading Text</h6>

HTML Formatting Elements

HTML Formatting Elements (Tags) are used for the html document formatting as per requirement we can use commonly used terms like: headings, text bold, italic, underline, strike, super script, sub script, displays deleted text and many more.


<!DOCTYPE html>
<html>
    <head>
       <title>formatting tag</title>
    </head>
<body>
    <b>This is bold style</b>
    <br>
    <strong>This is another bold style</strong>
    <br>
    <i>This is italic style</i>
    <br>
    <em>This is emphasized text like italic style</em>
    <br>
    <u>This is underline style</u>
    <br>
    <ins>This is another underline style</ins>
    <br>
    <strike>This is strike style</strike>
    <br>
    <del>This is another strike style it displays deleted text</del>
    <br>
    (a+b)<sup>2</sup>=a<sup>2</sup>+2ab+b<sup>2</sup>
    <br>
    H<sub>2</sub>O
    <br>
    <tt>This is Teletype Text Style</tt>
    <br>
    <big>This is larger font size text</big>
    <br>
    <small>This is small font size text </small>
    <br>
    <mark>This is Highlight text mark by mark element</mark>
    <br>
    <font size="7" color="red" face="arial">Welcome to Hi Tech</font>
</body>
</html>

<p>HTML Paragraph Elements

The <p> paragraph element contains and displays a block of text as a paragraph. We can all <p> attributes as well like: “left, right and justify”.

Example:


<p>This is paragraph text using <p> element</p>
<p align="justify"> Long paragraph goes here</p>

<img> Image Tag Element

HTML image <img elements embed images in pages. The src attribute contains the image URL and is mandatory. You must add alt attribute. You can use width, height, title attributes as per requirement. The alternative text will be displayed if an image fails to render due to an incorrect URL, if the image format is not supported by the browser, if the image is blocked from being displayed, or if the image has not been received from the URL. Attributes of <img> tag are: alt, title, width, height, hspace, vspace.


<img src="images/picture.jpg" alt="my picture">

<a> Anchor Element
The <a> anchor element is used to create hyperlinks in an HTML page. The hyperlinks can point to internal on the same website, page or external websites or files or any other URL via the hyperlink reference attribute, href. The href determines the location the linked element points to. <target> attribute on an <a> element specifies where a hyperlink should be opened
Example:


<a href="index.html"> <!-- internal link -->
<a href="http:// developer.mozilla.org" target="_blank"> <-- external link -->
<a href="mailto://youremail@mail.com"> <!-- email link-->
<a href="imgsrc="images/picture1.jpg"> <!-- this image link -->
   <img src="images/picture1.jpg" alt="my picture" width="250" height="180">
</a>

<marquee> Marquee Tag Element

The HTML <marquee> element is used for scrolling piece of text or image displayed either horizontally, vertically or randomly your website page depending on the settings.
Example:


<marquee behavior="scroll" scrollamount="6" scroll delay="85" bgcolor="pink">
Welcome to HTML Scroll
</marquee>

<marquee behavior="alternate" direction="up" width="250" bgcolor="yellow">
<strong>Heavy Discount Offer!</strong>
</marquee>

Specific Marquee Element Attributes

The HTML <marquee> tag also supports the following additional attributes −

Attribute	Value	Description
behavior	scroll slide alternate	Defines the type of scrolling.
bgcolor	rgb(x,x,x) #xxxxxx colorname	Deprecated − Defines the direction of scrolling the content.
direction	up down left right	Defines the direction of scrolling the content.
height	pixels or %	Defines the height of marquee.
hspace	pixels	Specifies horizontal space around the marquee.
loop	number	Specifies how many times to loop. The default value is INFINITE, which means that the marquee loops endlessly.
scrolldelay	seconds	Defines how long to delay between each jump.
scrollamount	number	Defines how how far to jump.
width	pixels or %	Defines the width of marquee.
vspace	pixels	Specifies vertical space around the marquee.

Follow the more references: Web technology reference | MDN (mozilla.org)

HTML Common Tags or Elements