Now, I will tell you about how to creating simple web pages that involve text elements, line, color and image. Where there is at least a heading and the color line, the picture with a frame/border and the main page with a background. Like This:
HEADING LEVEL TAG
To make the title text with a larger size, we use a Heading Level Tag. These are not the same as the <head> ... </head> tags used to demarcate the header section of an HTML source code document.
HTML uses six levels of “heading level” tag pairs; the smaller the heading level number, the larger is the print size:
<H1>heading</H1> creates heading level #1 (24 point type—largest)
<H2>heading</H2> creates heading level #2 (18 point type)
<H3>heading</H3> creates heading level #3 (14 point type)
<H4>heading</H4> creates heading level #4 (12 point type)
<H5>heading</H5> creates heading level #5 (10 point type)
<H6>heading</H6> creates heading level #6 (8 point type—smallest)
A line space automatically is inserted before and after a heading (that is, an entire line is skipped between a heading and any text before and after it).
INSERT IMAGE
You can insert image in to your page, we will use the <img> tag. For example, to insert an image called picture.gif, located in the same directory as the file that is going to show it, we write:
<img src="picture.gif"></img>
And to make its border, you can type the following
border="5"
HORIZONTAL RULE
To add a horizontal rule to your page, you will need to locate the <hr>
And to resize this horizontal rule, you can type the following
width="35%"
If you will change the color of horizontal rule you can type the following
color="red"
BACKGROUND IMAGE
To add a background image to your page, you will need to locate the <body> tag in your document. What we are going to do is add a command after the word body. So, go to the end of the word body, skip a space, and type the following:
background=""
Now your body tag should look something like this:
<body background="">
Now, we are going to place the url of the image inside the quotation marks. So, if the image I want to use is at http://www.mysite.com/image1.gif, I would insert this into the command, like this:
<body background="http://www.mysite.com/image1.gif">
Finally
And this is my sample HTML code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<body background=”Gita_Gutawa-078.jpg”>
<h1>MERAIH MIMPI</h1>
<HR COLOR="BLUE">
<p align="justify">Kuberjalan Raih cita.. Untuk dunia yang baru di depan mataku.. Tak ada ketakutan akan gelapnya malam.. Fajar kan beri arti dan sinari dunia.. Mimpi kan menjadi nyata bila ku tetap percaya.. Walau rintangan menghalang kekuatan masih ada.. Kubernyanyi hingga fajar.. Cinta dan keyakinanku percaya akan diriku.. Mampu jalani hidupku.. Uuuu Kau takkan tau bila tak mencoba.. Jalanmu masih panjang.. Percayalah!!!</p>
<HR COLOR="RED">
<RIGHT>
<p> </p>
<HR align="right" WIDTH="35%" COLOR="BLUE">
<p align="right"><img src="361.jpg" width="154" height="148" border="5" /></p>
</RIGHT>
</body>
</html>
