2. General block of HTML code
<html>
<head>
<title> My Title</title>
</head>
<body>
</body>
</html>
3. Advantages of HTML
1 Easy to learn, use & implement.
2 No special software is required
3 It contains powerful text formatting facility.
4 HTML Page can be created on any hardware.
Platform using any text editor .
5 It is not case sensitive language because of hyper
linking facility visitors or users can traverse to any
HTML document.
4. Disadvantages of HTML
1 HTML is not a programming language.
2 Any type of calculation can not be done in HTML it
can not be used to display even date.
3 Syntax errors are not identified or displayed by html.
4 To Handel calculation , valuation & events with html
we need scripting language.
6. Input: Big & Small
<html>
<body><h5>We are<big>IT</big>student</h5><br>
<h1>small tag<small></small></h1>
</body>
</html>
Output : - We are IT Student
11. Order Type =“A”,”a”,”I”,”i”
<html>
<body>
<ol type=“A”>Subject
<li>IT</li>
<li>Marathi</li>
<li>Physics</li>
</ol>
</body>
</html>
Output: Subject Classes
A IT a I i
B Marathi b II ii
C Physics c III iii
12. 1] Order List
<html>
<body>
<ol>Subject
<li>IT</li>
<li>Marathi</li>
<li>Physics</li>
</ol> Output: Subject
</body> 1 IT
</html> 2 Marathi
3 Physics
14. Attribute of <ol> Tag
( Type Attributes This property is used to
decide the style of list then marker that could
be of the following types:
“1” –To create a number list with lower numbers
“a” – to create number list with lower case
letters
“A” – To create a number list with upper case
letter.
“I” – To create a number list with upper case
Roman number
“i” – To create a number list with lower case
Roman number
17. To insert image on web page we
used <img>
1] src –path of image file
2] hight
3] width
4] Border
5]Align value for align (Top,bottom,center,left,right)
6]’H’space /’V’ space text
ggggggggggggg‘h’ space ............
.............
‘V’space ..............
...............
...............
..............
Image
18. <IMG>
<html>
<title>Display image</title>
<Body bgcolor="yellow">
<h1>here we are going to insert the image</h1>
<p>
<img src="C:UsersPublicPicturesSample
PicturesChrysanthemum.jpg"width="400" hight="400"
border="5" align="right">
</p>
</Body>
</html>
19. Tables-
<Table> tag is used to define a table in Html. It
begging with a <table> tag & close with </table>tag.
<caption>tag- is used to define title of the table
<TR>-This tag is used to define table rows
<TH>-is used to specify a column heading. it makes
the text bold & centered
<TD>- This tag is used to define table data
21. Different attributes of table
1 ] Border
2] Align
3] Width
4] Border Color
5 ] Cellspacing – It spacifies the width of the border
betn indivual cell of table & border of the table itself.
6 ] Cellpadding – It spacifies the space to be left
inpixces the border of table cell & it contains.
cellspace
cellpadding
3
22. Different attributes of table
colspan – It will combine different COLUMNS.
Rowspan – It will combine rows.
27. Hyperlink
Hyperlink – It is used to connect to diffrent web pages.
HTML links are hyperlinks.
You can click on a link and jump to another document.
When you move the mouse over a link, the mouse arrow
will turn into a little hand.
Note: A link does not have to be text. A link can be an
image or any other HTML element!
HTML Links - Syntax
The HTML <a> tag defines a hyperlink. It has the following
syntax:
Ankair tag <a> is used to hyperlink.
<A Href=“Path of HTML Document”> TEXT </A>
28. This example shows how to create
a link to W3Schools.com:
<!DOCTYPE html>
<html>
<body>
<h1>HTML Links</h1>
<p><a href="https://www.w3schools.com/">Visit
W3Schools.com!</a></p>
</body>
</html>
29. By default, links will appear as follows in all browsers:
An unvisited link is underlined and blue
A visited link is underlined and purple
An active link is underlined and red
30. Forms & Frame
A Form is a collection of Fields of the information on
a page.
The various fields of data in a form may contain text
boxes, radio buttons, drop-down menus, check boxes,
password boxes, and other elements. These element
are called Form Controls.
31. Forms & Frame
Syntax <HTML>
<FROM>
FORM ELEMENTS
</FROM>
</BODY>
</HTML>
32. Input Elements
Input elements are the form element that can accept input from
the user. the following are the some of the input elements that
can be added to form .these are also called form Controls.
Text Box
Check Box
Radio Button
Password box
Buttons
Drop down list
Combo box
Text area
33. Input tag & Its Attributes
<HTML>
<BODY bgcolor="yellow">
<H1>registration FORM</h1>
<FORM>
First name:<input type="text"><br><br>
Last name:<input type="text"><br><br>
password:<input type="Password"><br><br>
phone no:<input type="text"><br><br>
select gender
<input type="radio"name="gender">male
<input type="radio"name="gender">female
<input type="radio"name="gender">transgender<br><br>
<input Type =“checkbox” Name =“Check”>set Google as my default home page.<br><br>
<button type="submit" value="Submit">submit form </button>
</FORM>
</HTML>
35. CSS is the language we use to style an html document.
CSS describe how HTML ELEMENTS should be
displayed
https://www.youtube.com/watch?v=79qvk2T6R68
36. An id name cannot start with a
number! The CSS class Selector.
The class selector selects HTML
elements with a specific class
attribute
38. An id name cannot start with a
number! The CSS class Selector. The
class selector selects HTML elements
with a specific class attribut
39. CSS Introduction
CSS is the language we use to style a Web page.
What is CSS?
CSS stands for Cascading Style Sheets
CSS describes how HTML elements are to be displayed
on screen, paper, or in other media
CSS saves a lot of work. It can control the layout of
multiple web pages all at once
External stylesheets are stored in CSS files
41. Three Ways to Insert CSS
There are three ways of inserting a style sheet:
External CSS
Internal CSS
Inline CSS
Using CSS
CSS can be added to HTML documents in 3 ways:
Inline - by using the style attribute inside HTML
elements
Internal - by using a <style> element in
the <head> section
External - by using a <link> element to link to an
external CSS file
42. External CSS
External CSS
With an external style sheet, you can change the look
of an entire website by changing just one file!
Each HTML page must include a reference to the
external style sheet file inside the <link> element,
inside the head section.
43. Example
External styles are defined
within the <link> element,
inside the <head> section of
an HTML page: "mystyle.css"
Example
External styles are defined within the <link>
element, inside the <head> section of an
HTML page:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="mystyle.css">
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
body {
background-color: lightblue;
}
h1 {
color: navy;
margin-left: 20px;
}
