0% found this document useful (0 votes)
7 views9 pages

HTML Tags and Their Functions Explained

The document provides an overview of basic HTML elements and their functions, including the structure of a webpage with tags such as <head>, <body>, <h1> to <h5>, <p>, <a>, <img>, <audio>, and <video>. It explains various formatting tags like <b>, <i>, <u>, and list types such as unordered, ordered, and description lists. Additionally, it covers the creation of tables and buttons, along with styling options using attributes.

Uploaded by

mahnoortalib44
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
7 views9 pages

HTML Tags and Their Functions Explained

The document provides an overview of basic HTML elements and their functions, including the structure of a webpage with tags such as <head>, <body>, <h1> to <h5>, <p>, <a>, <img>, <audio>, and <video>. It explains various formatting tags like <b>, <i>, <u>, and list types such as unordered, ordered, and description lists. Additionally, it covers the creation of tables and buttons, along with styling options using attributes.

Uploaded by

mahnoortalib44
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd

<!

DOCTYPE> is the declaration that the given file is html

Head tag shows the information about the web page such as title

Body tag shows the everything that needs to be shown on a website

Then there are h1 to h5 tags which are for heading or showing the most important content on the
webpage

P tag is used to show the paragraph on the page

A tag is used to add the hyperlinks

<br> is used for line break and it is self closing tag

<hr> tag is used to add a horizontal line on a page

Used to add a comment

There is a <pre> tag which is used to write a paragraph with spacing as <p> tag generally omits spacing

More properties of <a> tag

Target = _blank will open link in new tab

Title will show a “youtube” or any given text when the curson will be on the button
EXAMPLE
Img tag is used to add an image here having some attribute well we add only 1 at a time from height and
width

Alt will show the text in case image is unable to be shown just as give below

Now using image tag in <a> tag

Changing the song file


Add up an audio through audio tag and inside use source tag too add up a music now also add some
features like control (it will show up things like Pause/Resume, Sound, Fast Forward etc.), auto play (It
will automatically play music when the things will run), muted (It means that the music will initially be
muted), loop (thee song will run on loop)
Like audio in same way add up a video too

Video should be of mp4, webm, ogg format with same features

We can also use <a> tag with the file if we want to move to any of the web page

Now the code for video will be

<video src="Music/Forest Find - TrackTribe.mp4" controls width=”500px”


autoplay muted loop>
</video>

Now add an icon to our webpage

Add a link tag and tell the relation is icon than give the image type as jpg or png etc. and then image link

Now text formatting in html is as follows

<b> tag is for bold

<i> for italic

<u>underline

<d> deleted text like text and it is cut with a line

<sub><sup> than subscript and superscript

<tt>monotext
<mark> will kinda highlight the text

For changing color add an attribute <mark style=”background-color :lightgreen”

<big> <small> is like a text will be bigger or smaller in size than normal text

Then there are span and div tags

Span tag is used take things in one container as inline container, it is for styling of in css, it just applies
changes where the line or thing ends

Whereas div tag is a block container it is also used for styling in css but it applies changes or styling to
the whole width of a document

Now create a list of things

But there are the types of lists

Unordered List (It will add the bullets)

<ul> tag along <li> tag will be used (a tag witin a tag can also be used)
Ordered List (It will add the numbers)

<ol> tag along <li> tag will be used (a tag witin a tag can also be used)

Description List (It will write up things and will provide description of them)

<dl> tag along <dt> and <dd> tag will be used (a tag witin a tag can also be used)

We can add borders and change the style by adding attribute style:”background-color : yellow”
border:”2px solid”
Making tables

Use table tag along <tr> (table row) <th> (table header which are column names) <td> (table detail
which is actually column and row values) Also use attributes according to need

Now create buttons

After pressing

You might also like