Site hosted by Angelfire.com: Build your free website today!


 Your current location:
- WC
- Unique
- HTML Help
- Page 2

The Western Capital is an original fansite. Reproduction in whole or in part is strictly prohibited.

Guestbook
Sign | View

HTML Help-Page 2

Welcome to the HTML Help section! This is a guide to the basics and even somewhat difficult HTML tags, inserts and other website-related items.


Introduction for Page 2
This page goes on to more difficult and advanced steps in HTML. This includes images, links, tables and E-mail. Below is an outlook of what you will see in The Western Capital's own HTML Help.

Title of Lesson
Brief introduction to the item being highlighted.
Important: An important note that either points out an essential mark or provides a common fact regarding the lesson.
Example An example including what the item will look like in the finished product.


Images
Images are an attractive (in most cases) way to catch your visitors' attention. You can put up an image using many different techniques. The tag "img" indicates that an image is to come. The image tag is closely followed by the insert tag "src", which specifies the location (URL) of the image on the web. Also, note the "div" tag. This is an optional tag that allows you to add additional characteristics to your images. The "div" tag lets you align the image without including a center tag and separates the image from all other text and HTML. This is a trick I learned early on and has proven to be invaluable when posting images. Its use is highly recommended! On a side note, images can even be taken from sites of a different server, although it is not proper. This causes bandwidth problems, which usually ends up harming the individual's site that you took is from. View the examples below, using an image titled "logo.jpg."
Important: You can either substitute your own height and width of the image using the proportion insert tags or keep it the same. This is optional and will work both ways.
Examples:
Standard SizeCustom Size
<div align="center"><img src="logo.jpg"></div><div align="center"><img src="logo.jpg" height="400" width="550"></div>
<img><src="logo.jpg"></img><img><src="logo.jpg" height="400" width="550"></img>


Captions
Now that you know how to add images to your site, I'll briefly take you through captions. Captions are short or long sentences that can be added to your images. When the mouse goes over an image, the caption will appear. Captions are great for adding descriptions or comments to an image. The "alt" insert tag, along with an equal sign, starts the caption.
Important: Quotation marks are required for the caption to work! ALWAYS add the caption tag after the "img" tag and "src" insert tag!
Example: <div align="center"><img src="logo.jpg" height="400" width="550" alt="You would enter your caption here!"></div>
Links
Links are images or text that connects one section of a site (or another site) to another section. When your mouse glides over a link, the cursor will turn into a hand with the index finger extended. These are found throughout websites. If links weren't available, there would be only main pages and nothing else. When creating a link, keep the URL of the section you are linking in mind. You must enter it into the link tags correctly or else it will not work.
Important: Links are always started with "<a href=" and always end with "</a>."
Example: A link from HTML Help to The Western Capital's Main Page would go:
<a href="https://www.angelfire.com/ne2/efdbzhp/index.html">The Western Capital's Main Page</a>
Image Links
This a very quick example of a link on an image.
Important: An image links retains all qualities of a link and an image at the same time. The following example uses the previous link and image. Keep your URL handy!
Example: <a href="https://www.angelfire.com/ne2/efdbzhp/index.html"><img src="logo.jpg"></a>
Tables
Tables are an easy way to sort items in a desired order. The table has many tags that need to put in correct order. The "<table>" tag says there is a table to come. The "<tr>" tag specifies a new row. The "<th>" is an optional tag that specifies a new heading. And the "<td>" tag specifies a new data cell. Got all that? Don't worry, you'll catch on...
Important: The order the tags go in are: table, row, data cell. They can also go: table, row, heading, row, data cell. Pay close attention to this example!!!
Example: <table border="3"><tr><td>Row 1, Data Cell 1</td><td>Row 1, Data Cell 2</td></tr>
<tr><td>Row 2, Data Cell 1</td><td>Row 2, Data Cell 2</td></tr></table>

Which would look like this:
Row 1, Data Cell 1Row 1, Data Cell 2
Row 2, Data Cell 1Row 2, Data Cell 2


E-mail
An effective way to recieve feedback is to have your E-mail address posted through a link. This is done quickly and easily. The example below uses my E-mail address.
Important: The "mailto:" insert tag is always entered before the E-mail address but after the link tag. Place the quotation marks before the mail tag and after the address. Notice how there are no spaces in the HTML.
Example: <a href="mailto:Ritick86@yahoo.com">E-mail me</a>
E-mail with Set Subject
Once you have the E-mail link down, you can also set the subject of the message in the link itself!
Important: Do not put quotation marks around the subject! The question mark acts as a space but cannot be removed for the link to work.
Example: <a href="mailto:Ritick86@yahoo.com?subject=Enter Subject Here">E-mail me</a>
Further Help
If you would like to know more on HTML, I suggest visiting HTML Goodies.
Want to know how I set the actual code? Right click and go to "View Source."
Feedback
Read through HTML Help? Did it help you? E-mail me here!


This site is not meant to infringe on any copyright laws, or ANY laws, for that matter. It is merely a fan site created to acknowledge and promote the popularity of the DragonBall, DragonBall Z and DragonBall GT series.

Visit the Dragonballtop50