1
Frontend Web Development
Study Notes ( learn HTML, CSS, Js )
Lecture # 1
There are two types of Websites
Static website Dynamic website
• Data not control on user Control data of user
and clients
• Limited of pages most website are dynamic
• Can’t do changes youtube is a dynamic
website
HTML ( Hyper Text Markup Language )
HTML is the standard markup language for creating web pages and web
applications .
Syntax of Elements
Opening Tags Closing Tags
<TagName> </TageName>
, 2
Some elements don’t have closing tags like image element because in this do
not text in this use location of picture .
What is Attributes ?
Every elements ko additional property dyty hy . Used for Formatting our text .
Openting Tags :
<TagName attributename = “attribute Value”>
If we use paragraph tag we use align name attribute
<p align = “Left”>Welcome to our home </p>
Boolean Attributes
This attribute have no value . Like when our submitted any form its
background coding ,
<input type = “text” required >
General Purpose Attributes
ID < tagname id = “ Attribute value “> use unique name of element
Paragraph tag <p> Used to display normal text
Class Non unique <p class = “first” > This is first blog
, 3
Open your browser search Emmet and open cheat sheet in which syntax or
tools
For speed increasing .
Revising HTML Language
Google / Emmet / Cheat Sheet ( All emmet use without space )
• Ul > li * 5 For unordered list
• Table > . row > . col use table/tr/td
Firstly we use simple editor Notepad ,Then Use Visual Studio Code text editor
, 4
Lecture # 2
Some Important < Elements >
Line < br > eak Used for line break
Horizontal rule < hr > Used to add horizontal line in our html document .
Entities In HTML FOR White Spaces in HTML
Entities means Display reserved characters in HTML . This used to Display .
• Reserved characters
• Special characters
• Emojis & Symbols
Syntax of Entities
&entity _name; OR &#entity_number;
Search on Google ….. HTML entities opening angle bracket
Frontend Web Development
Study Notes ( learn HTML, CSS, Js )
Lecture # 1
There are two types of Websites
Static website Dynamic website
• Data not control on user Control data of user
and clients
• Limited of pages most website are dynamic
• Can’t do changes youtube is a dynamic
website
HTML ( Hyper Text Markup Language )
HTML is the standard markup language for creating web pages and web
applications .
Syntax of Elements
Opening Tags Closing Tags
<TagName> </TageName>
, 2
Some elements don’t have closing tags like image element because in this do
not text in this use location of picture .
What is Attributes ?
Every elements ko additional property dyty hy . Used for Formatting our text .
Openting Tags :
<TagName attributename = “attribute Value”>
If we use paragraph tag we use align name attribute
<p align = “Left”>Welcome to our home </p>
Boolean Attributes
This attribute have no value . Like when our submitted any form its
background coding ,
<input type = “text” required >
General Purpose Attributes
ID < tagname id = “ Attribute value “> use unique name of element
Paragraph tag <p> Used to display normal text
Class Non unique <p class = “first” > This is first blog
, 3
Open your browser search Emmet and open cheat sheet in which syntax or
tools
For speed increasing .
Revising HTML Language
Google / Emmet / Cheat Sheet ( All emmet use without space )
• Ul > li * 5 For unordered list
• Table > . row > . col use table/tr/td
Firstly we use simple editor Notepad ,Then Use Visual Studio Code text editor
, 4
Lecture # 2
Some Important < Elements >
Line < br > eak Used for line break
Horizontal rule < hr > Used to add horizontal line in our html document .
Entities In HTML FOR White Spaces in HTML
Entities means Display reserved characters in HTML . This used to Display .
• Reserved characters
• Special characters
• Emojis & Symbols
Syntax of Entities
&entity _name; OR &#entity_number;
Search on Google ….. HTML entities opening angle bracket
