15
HTML Programming
HTML Programming
What is HTML?
An acronym for HyperText Markup Language, (HTML)
Is the language used to tag various parts of a Web
document so browsing software will know how to
display that document's links, text, graphics and
attached media.
HTML is a markup language (computer laguange)
HTML documents are also called web pages
Introduced by Tim Berners-Lee in 1989
EXTENTION – .html or .htm
What is HTML tag?
HTML markup tags are usually called HTML tags
HTML tags are keywords (tag names) surrounded by
angle brackets like <html>
HTML tags normally come in pairs like <b> and </b>
The first tag in a pair is the start tag, the second tag is
the end tag
The end tag is written like the start tag, with a forward
slash before the tag name
Start and end tags are also called opening tags and
closing tags
What is an HTML File?
HTML stands for Hyper Text Markup Language
An HTML file is a text file containing small markup tags
The markup tags tell the Web browser how to display
the page
An HTML file must have an htm or html file extension
An HTML file can be created using a simple text editor
HTML Editor
• You can easily edit HTML files using a WYSIWYG (what
you see is what you get) editor like FrontPage,
Publisher, Adobe Dreamweaver, Adobe Flash, Claris
Home Page, or Adobe Page Mill instead of writing your
markup tags in a plain text file.
HTML Code
EXAMPLE
<html>
<head>
<title>Title of page</title>
</head>
<body>This is my first homepage.
<b>This text is bold</b>
</body>
</html>
HTML Code
LINE BREAK
Use the <br> tag if you want a line break
(a new line) without starting a new paragraph
This is a paragraph
<br>This is another paragraph
PARAGRAPH
Paragraphs are defined with the <p> tag.
<p>This is a paragraph</p>
<p>This is another paragraph</p>
HTML Code
PARAGRAPH: center, left, right, justify
<body>
<P align=center>
This is a centered paragraph.
</P>
</body>
HTML Code
FONT : color, type of font
<body>
<center>
untuk set center
<P>
<font color=blue>
xxxxxx
</font>
</body>
</center>
HTML Code
BACKGROUND & TEXT COLOR
<BODY bgcolor=black text=white>
<H1>Hi! I am Megat.</H1>
</BODY>
Text in white color
Background in black color
HTML Code
HEADING
• Headings are defined with the <h1> to <h6> tags.
• <h1> defines the most important heading.
• <h6> defines the least important heading.
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
HTML Code
LIST : UNORDERED LIST
• An unordered list starts with the <ul> tag. Each list item
starts with the <li> tag.
• The list items are marked with bullets (typically small
black circles).
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
HTML Code
LIST : ORDERED LIST
• An ordered list starts with the <ol> tag. Each list item
starts with the <li> tag.
• The list items are marked with numbers.
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
Lets’ Try This <html>
<head>
<!– Tajuk Dokumen -->
<title>Tajuk</title>
</head>
<body>
<!– Isi Kandungan -->
<h1>Tajuk Pertama</h1>
<p>Tulis sesuatu berkenaan diri anda</p>
<h2>Tajuk Kedua</h2>
<!-- seterusnya -->
</body>
</html>
Other resources
• HTML Tutorial
• http://www.w3schools.com/html/default.asp
• A beginer Guide to HTML
• http://www.htmlgoodies.com/primers/html/
• http://www.htmlcodetutorial.com/
