Basic Html (for Us Kids)

Acidify

Aug 2 2005, 10:46 AM

What is HTML? HTML (hypertext markup language) is computer language that is used to webpages. It can be confusing to understand for some of us kids. HTML pages are text files that has of HTML tags (they can place the text or images whereever you want to place it), and text you can place between the tags so the text willshow up on your page when you put it on the WWW. Tags are instructions that tell your browser what to show on ya website. They break up your webpage into basic sections. All tags start with a < (left bracket) and end with a > (right bracket).

If you are a starter you need 4 tools An editor to save your html or website in or just for htm notes such as notepad.You also need webspace in which trap17 will provide to you.You also most likely will need graphics.And the last thing is ideas because you dont want you site to be like everyone else.

how to set up ya page basic page setup is easy. You can copy and paste this code into your editor and just add your own stuff in between the <body> and </body> tags:

this tag only works in the IE browser. Netscape will ignore the tag, showing a regular background instead. CSS gives you more freedom with backgrounds but this is a html tourial and were not gonna go into css untill my next tourials maybe.

CODE

<html>
<head>
<title>Your page title goes here</title>
</head>
<body>

---Everything that appears on your page will be entered here---

</body>
</html>

Here is a more exciting page.

CODE

<html>
<head>
<title>trap17 is great</title>

<style type="text/css">

body { background-color: #33ccff; }
h1 {font-family: arial, verdana;
color: 6600ff }
p {font-family: arial, verdana;
color: 6600ff }

</style>

</head>

<body>

<div align="center"><h1>Max's Page</h1></div>

<div align="center"><p>My name is ----. I'm ----- pet poodle. This is my first and probably my last web page.</p></div>

<div align="center"><img src="max.jpg" width="161" height="195" alt="Max"></div>

</body>
</html>

Now the page begins with <html> and ends with </html>.These are the tags they begin and even with.The head tag has the title of your page, and between the <body> tag and the </body> tag is where you put all the text and images and stuff that will appear on your page. tags must always be nesting. For example, <b><u><Hello</u></b> is correct, <b><u><Hello</b></u> is not. basic tags are covered in the HTML sections of this page.

how to add image background To add a background image to your page, you need to add this tag after the </head> tag, remember that you can use a .gif or a .jpg, you just have to change the filename in the code if you use a .jpg

CODE

If you just want a background color, you would add this tag after the </head> tag:

CODE

QUOTE

The background image has to be uploaded

How do I add text to my page? To add text, you need to set up headers and paragraphs

CODE

<h1>This is a header</h1>

CODE

<p>This is a paragraph.anyway to let you know a little more about headers, a header is kinda like a title. You can have less important headers named h2, h3, h4, h5, and h6. You can change the header font, font color, font size, etc. by using style sheets.</p>

You can align your paragraphs this way, the default is aligned left:
<p>You write your text here</p>

Now To center your text you do this:

CODE

<div align="center"><p>This will center your text</p></div>

To align your text on the right you do this:

CODE

<div align="right"><p>This will align your text to the right</p></div>

To make your text bold you do this:

CODE

To italicize your text you do this:

CODE

<p><i>This will italicize your text</i></p>

To underline your text you do this:

CODE

<p><u>This will underline your text</u></p>

In order to make a line break you need to add this tag wherever you want to return to the next line: <br>. You can use this tag to make vertical spaces between images, and it works just like the enter key on your keyboard.

For example, to write an address:

CODE

<p>trap smithz<br>
123 Any Street<br>
Anywhere, Any State 12345</p>

A <br> tag does not need a closing tag

You can wrap your text around an image like this:

CODE

<p><img src="turtle1.gif" width="75" height="50" alt="turtle" align="left">Adding your text here will wrap your text around your graphic, with your graphic on the left and your text aligned to the left of the graphic.</p>

Text wrapping with forced line breaks to form paragraphs:

CODE

If you want to change the font for just a portion of your text you can override your style sheet by adding this code:

<font face="your font" size="your size #" color="#your color number">your text goes here</font>

All of the text in between <font> and </font> will be changed, but the text before and after this tag will be the default font that you set up in the basefont tag.

I will add more advanced html tourials.I might add another later or probly in a few days so study this one because its more to come.I might also add a css tourial but I am not sure.

There is no need to put so many spaces inbetween each line. One is enough.

Basic Html (for Us Kids)

Basic Html (for Us Kids)

Latest Entries