Dragon Mage Graphics
HTML From Scratch
Now that you have the bare basics set up, you might want to start adding things to the page. To begin, let's add text.
<html>
<head>
<title> welcome
</title> </head>
<body bgcolor="#000000" text="#FFFFFF" link="#0000ff" vlink="#FF0000" alink="#FFFFFF">
<center>
<h1>
welcome!
</h1>
</center>
</body>
</html>
|
As you can see, the <center> and <h1> tags have been added. You should also notice that they have been closed (</center>) when you want the centering or the headings to stop. What does the <h1> tag do? It makes the text bigger. There are several headers. If you'd like to see the different types, please read the Headings Section.
Feel free to change "Welcome!" to whatever you want the first thing to read on your page to be. (On this page, it is "Dragon Mage Graphics")
<html>
<head>
<title> welcome
</title> </head>
<body bgcolor="#000000" text="#FFFFFF" link="#0000ff" vlink="#FF0000" alink="#FFFFFF">
<center>
<h1>
welcome!
</h1>
</center>
<P>
This is my web page, I hope you like it,
be sure to visit me often, because I update often. I like e-mail,
and you can do so by clicking<br>
<a href="mailto:email@mailer.com">Right Here!</a>.
<p>
Please visit
<a href="http://mage.itgo.com/index.html">
this page</a>
</body>
</html>
|
Here, I've added the <p> tag. This adds a space between your text. Don't overuse it, but it can help make your page more readable. There is also the <br> tag. This moves the next tags down to another line, but does NOT leave a space.
I've also added links. For the mailing, you MUST have the "mailto" part in the <a href> tag. If you want to read more about links, try the Link Section.
<html>
<head>
<title> welcome
</title> </head>
<body bgcolor="#000000" text="#FFFFFF" link="#0000ff" vlink="#FF0000" alink="#FFFFFF">
<center>
<h1>
welcome!
</h1>
</center>
<P>
This is my web page, I hope you like it,
be sure to visit me often, because I update often. I like e-mail,
and you can do so by clicking<br>
<a href="mailto:email@mailer.com">Right Here!</a>.
<p>
Please visit
<a href="http://mage.itgo.com/index.html">
this page</a> <br>
Hey, look I can change
<font color="#0000FF"
size="-1" face="geneva, galliard, arial">colors, sizes, and font types!</font>
The best way to make something stand out is to <i>make it in italics</i>,
<u>underlining it</u>,
or <b>making it bold</b>
</body>
</html>
|
I've introduced the <font> tag for this page. If you'd like to explore tweeking fonts, please read all about them at Font Fun. You can also use the <b>, <i>, and <u> tags...respectively: bold, italics, and underlined. You should close them (</b>) when you want the font to be normal again.
<html>
<head>
<title> welcome
</title> </head>
<body bgcolor="#000000" text="#FFFFFF" link="#0000ff" vlink="#FF0000" alink="#FFFFFF">
<center>
<h1>
welcome!
</h1>
</center>
<P>
This is my web page, I hope you like it,
be sure to visit me often, because I update often. I like e-mail,
and you can do so by clicking<br>
<a href="mailto:email@mailer.com">Right Here!</a>.
<p>
Please visit
<a href="http://mage.itgo.com/index.html">
this page</a> <br>
Hey, look I can change
<font color="#0000FF"
size="-1" face="geneva, galliard, arial">colors, sizes, and font types!</font>
The best way to make something stand out is to <i>make it in italics</i>,
<u>underlining it</u>,
or <b>making it bold</b>
Look at this pretty picture!<p>
<center>
<img src="imagename.jpg">
</center>
</body>
</html>
|
This is the last part of the Basic from Scratch - the image. Change "image name" to the name of the image, of course! There are many things you can do with images, so feel free to read about them at Image Magic.
Want to see what the page will look like if you only use this stuff? Click here to see what we have created!
Back to the Previous Step.
Back to HTML Help.
Back to Dragon Mage Graphics.
© drago. Please do not remove anything from this page. The backgrounds are offered in the free graphics sections.
|