|
|
|
|
1. What is a website? | 2. Planning your site | 3. Get started with HTML | 4. Add Attributes | 5. CSS
Now that you have a basic page, it's time to learn about adding style to your tags. One of the most common ways to do this is use attributes. Attributes are commands that tell browsers more about a certain element, or part. They're included in the start tag, and have two parts, a name and a value. The best way to explain this is by example. The body element has an attribute called bgcolor that determines the background color of the page (normally white). If you wanted it to be red, the attribute would look like this: bgcolor="red". To add an attribute to a start tag, put it after the first word, seperated from it by a space.
Now you can experiment with that, and another element that makes text bigger: H1. There are several different 'H' elements (H stands for heading), and H1 is the biggest, followed by H2 and so on. We'll want people to quickly and easily see what our page is about, so H1 would be appropriate for the first line in our page. Make this change with the background color. It should look something like this (go ahead and pick a color other than red if you want, something like "blue", "green", or "yellow"):
<html>
<body bgcolor="red">
<h1>Welcome to Livewires!</h1>
</body>
</html>
Let's put in the P element again. Our new paragraph can contain some information about the page. It can go right below the H1 element. A new line isn't necessary, but is helpful to see how the page is organized.
A very important element in HTML is A. This element is called a hyperlink, or simply link. It uses the HREF attribute to specify which page viewers will be taken to when they click on the link. The value must include the full name of the file (if it's in the same folder) or the full web address, starting with 'http://'. Let's add a link inside the paragraph on our page:
<h1>Welcome to Livewires!</h1>
<p>Here you can find information on what we do and how to get involved in <a href="www.4-h.org">4-H</a>.</p>
Another very important part of HTML is images, or pictures. Pictures give character to your page that you can't get with just text. They catch peoples' eyes and make them want to read what's associated with the text. Images are another one of those elements with only one tag. After all, an image is an image. There's nothing inside. The tag is IMG, and the one necessary attribute is SRC. SRC works the same way as HREF works with A: it is the exact location and name of the image you want in the page.
bravenet.com