Scribd
Upload
5 views3 pages

HTML Notes

Uploaded by

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

HTML Notes

Uploaded by

Sajal Raj
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

26/02/2022, 01:18 OneNote

Tuesday, February 22, 2022 9:19 PM

Html introduction
• <!Doctype html> - Specifies this is an html5 document
• <html> - root of an HTML page
• <head> - Contains page metadata
• <title> Sajal website </title> - Contains title
• </head>
• <body> - Main body of the page (rendered by browser)
• <h1> This is a heading </h1> - heading tag
• >p> My paragraph </p> - paragraph tag
• </body> - closing body tag
• </html> - closing html tag

BODY
Empty elements

<br> - use to break the line.

Html comment - [<!-- HTML Comment -->]

HTML Element
• Everything from starting to the ending tag
<body> - Opening tag
-Content-
</body> - Closing tag

HTML Attributes
Used to add more information corresponding to an HTML tag.
Example: <a href=”https://google.com”>google</a>

Note-
<a href="https://google.com" target="_blank">google</a>
target="_blank – refer to open the page in another window

The Heading Tag


Heading tag is used to mark heading in HTML. From h1 to h6, we have tags for the
most important to the least important heading.
<h1> Most important heading </h1>
<h2> Another heading H2 </h2>

The Paragraph Tag


Paragraph tags are used to add paragraphs to an HTML page.
https://onedrive.live.com/redir?resid=3BFA5DB51C72FA04%21345&page=Edit&wd=target%28Quick Notes.one%7C6775d0ad-f511-4628-8f5e-2acf7cf9e91f… 1/3
26/02/2022, 01:18 OneNote
<p> This is a paragraph </p>

Q. How to go from one page to another page in your website?

Make different html files and line that file in body through

Suppose you make a file name tracking.html and want to open that side while
clicking track button
<a href="https://tracking.html">track</a>

The img Tag


img tag is used to add images in an HTML page.
<img src=”image.jpeg”>
Note: In src attribute, we have to specify the relative path of the image.

Note-
<b> This is bold </b>
<i> This is italic </i>
<u> This is underline </u>
<hr> tag in HTML is used to create a horizontal ruler often used to separate the
content.

Lists
Unordered list: Used to list unordered items
<ul>
<li> Home </li>
<li> About </li>
.
.
</ul>
Like dot , circle , squar.
We use - <ul type= "circle">

Ordered list: Used to list ordered items


<ol>
<li> Phone </li>
<li> PC </li>
<li> Laptop </li>
</ol>
We use- <ol type="a">

Tables
The <table> tag is used to define tables in HTML.
tr tag: used to display table row
td tag: used to display table data

https://onedrive.live.com/redir?resid=3BFA5DB51C72FA04%21345&page=Edit&wd=target%28Quick Notes.one%7C6775d0ad-f511-4628-8f5e-2acf7cf9e91f… 2/3


26/02/2022, 01:18 OneNote
th tag: used in place of table data for displaying table headers

To add a caption to the table, we use <caption> tag inside the table.
thead tag: used to wrap table head (caption & tr with th)
tbody tag: used to wrap the table body

HTML Forms
An HTML form is used to collect input from the user.
form tag is used for the same
<form>
-Element of the form-
</form>

• input element: Can be of type text, checkbox, radio, button and submit. We
also have a ‘file’ type
• textarea element: Defines a multi-line text input. Cols and rows attributes
can be used to size the textarea.
• select element: Defines a drop down list

• Embedding Videos
Video tag is used to play videos in HTML
<video src=”harry.mp4”> Error </video>

<span> xyz</span>
Span attribute is use to merge different paragraph to one single paragraph

Emmet : shortcuts of html

span.redBg - <span class="redBg"></span>


span#mainspan - <span id="mainspam"></span>

' . ' will give class


' # ' will give id

-------------------------------------------------------------------------------------------------------------

https://onedrive.live.com/redir?resid=3BFA5DB51C72FA04%21345&page=Edit&wd=target%28Quick Notes.one%7C6775d0ad-f511-4628-8f5e-2acf7cf9e91f… 3/3

You might also like