HTML Session
HYPERTEXT MARKUP LANGUAGE
Instructor: Emad Elsaid
blazeeboy@[Link]
[Link]
Agenda
2
What is HTML ?
Writing process
HTML layout
Basic HTML page
Text format tags
Image tag
Table tags
List tags
Anchor tag
What is HTML ?
3
HTML describe page structure not layout
HTML can link pages and embed content
HTML is text only file
HTML is not compiled
Only web browsers can view it
n
e r
g
r
w
t
e e
e
Writing process
v b
x
e
t
4
r b
y r
e
o
d
wr e
sa
rew
ref
i
ite ve
d s
sh
HTML text doesn’t have a layout
5
Linear unindented Indented (recom)
<html><head><title>untitled</t <html> <html>
itle></head><body>.....</body> <head> <head>
<title>untitled</title>
</html> <title>untitled</title>
</head>
</head> <body>
<body> .....
..... </body>
</body> </html>
</html>
HTML tags
6
HTML consist of tags inside other tags
<tag>…….</tag>
Example1: <font>……</font>,<p>….</p>,
Example2: <img />,<br />,<hr />
<tag1><tag2>…</tag2></tag1>
Example: <font><p>….</p><i>….</i></font>
Make sure you close the first opening first
attributes
7
In order to determine tag properties you can add
attributes
<tag attribute1=“value” attribute2=“value”…></tag>
Ex:1 <p align=“center” ></p>
Ex2: <font color=“red” ></font>
Basic page
8
<html>
<head>
</head>
<body>
Hello world
</body>
</html>
Text format tags
9
Paragraph: <p>
Header: <h1>…..<h6>
Font: <font>
Bold, Italics, Underline: <b>,<i>,<u>
Image tag
10
<img
Src : source image
Width: image width
Height: image height
Align: image alignment
Table tags
11
<table>
<tr> : table row
<th> : table header
<td> : table cell
List tags
12
<ol> : Ordered list
<ul> : Unordered list
<li> : list item
Anchor tag
13
Anchore tag links between pages
You can make a download link for MP3 or image
<a>
Href: reference page
Title: tooltip text
Question
14
Question
Comments
Opinions