Professional Documents
Culture Documents
HTML Codes 1
HTML Codes 1
HTML Codes 1
<html> <!--this is the head section--> <head> <!--Created by: Azimah, CFSIIUM, 2010--> <title>MY FIRST HOMEPAGE</title> </head> <!--this is the body section--> <body> </body> </html>
head section
body section
The blank lines are not necessary, browsers ignore white spaces in HTML documents However, this makes your HTML document easier to read
Description to indicate that the file is an HTML document includes general information about the document (keywords for search engines) identifies the title of the Web page (will be displayed in the title bar) includes the content of the Web page along with the tags needed to format that content to add background color: <body bgcolor="#0000CC"> identify the author, purpose, date created or last updated, and other information as required browser ignores it and does not display it in a Web page Bold Italic Line break (blank line) Horizontal line Headings <h1> tag for a level-one heading <h6> tag for a level-six heading align attribute values: (left, right, center, justify) <h1 align="center">WELCOME</h1>
Onesided
Two-sided
color attribute: <h1 style="text-align: center; color:red">WELCOME</h1> OR <h1 align="center"> <font color="#FF0000">WELCOME</font> </h1>
Prepared by: Ms Azimah, Dept of ICT, CFSIIUM
<p> <li>
Paragraph align attribute values: (left, right, center, justify) <p align=center>hello and welcome</p> List 3 types of list: 1. Bulleted list (unordered list) <ul> with a bullet character 2. Numbered list (ordered list) <ol> with sequential numbering 3. Definition list <dl> terms <dt> with definitions <dd> Example: <ul> <li>ONE</li> ONE <li>TWO</li> TWO <li>THREE</li> THREE </ul>
<img/> <a>
Pictures <img src="photo.jpg" alt="my photo" border=1 height=100 width=100/> Anchor Text hyperlink: <a href="http://www.google.com">Click to visit Google.com</a> -attribute target: _blank, _parent, _self, _top target="_blank" E-mail hyperlink: <a href="mailto://me@google.com">Click to e-mail me</a> Bookmark: -need to assign ID to an element: <img id="top" src=photo.jpg/> -then use anchor tag to refer to that ID <a href="#top">Back to top</a>