Section 4- Advanced HTML
Are you ready for some serious fun with HTML?
Tables can get quite hairy to create, but they are a very important part of HTML, and must be learnt eventually. In this section, I'll cover the general syntax for creating tables- complex tables are beyond the scope of this tutorial, though.
All tables involve using the below three tags:
The best way to illustrate how to create tables is to begin by showing the syntax involved in creating a basic table:
Take special note of the structure of the tags- All tables begin with the <table> tag, followed by at least one <tr> tag, and then by at least one <td>.
Lets take the above a little further and create a table with two cells (as opposed to just one):
Want to try for a table with two rows, and two cells in each of the row?
Since we wanted two rows, we defined two <tr> tags. Since we wanted two cells in each of the row, we defined two <td> tags inside each of the <tr>. Not that bad, right?
Before we get too carried away with creating tables, its appropriate to first introduce the attributes available in manipulating a table's appearance, such as border size, background color, row/cell width etc. Below lists these important attributes:
I encourage you to individually try out all of these attributes; here's an example that uses several of the attributes at once:
border="2" width="136" background="backgr15.jpg"
Many people have asked me how to add background music to their page. Its actually quite simple. Just add the below code to the document:
where "mymidi.mid" is the file path of the midi file you wish to use. The <bgsound> tag is for IE, and the <embed> tag is for NS. Here's a sample page that plays the background music Baywatch. Note that you must have the proper plugin installed in order to hear any music.
If you ever want your web page to be seen at all by anyone, you're gonna have to submit it to search engines. Most search engines have a "Add URL" feature where you can submit your site to to be listed. Before you do that, however, there's something very important you need to do- categorize your page using the <meta> tag. The <meta> tag allows you associate specific keywords with your page, so when surfers type in those keywords in a search engine, they will be lead to your site. Furthermore, this tag also allows you to specify a short description of your page that will be shown on the search engine page when your page is found. The syntax for this tag is as follows:
name="keywords" content="keywords here">
Where "keywords here" is a list of keywords that you wish to be associated with your page, and "description here" the short description describing it. Here's a complete example that categorizes a page on pets:
The meta tag is inserted inside the <head> section. Keywords entered into the <meta> tag should each be separated by a comma. Once your site is categorized, submitting it to search engines will yield much better results in terms of people finding your site!
In this final part, I'll show you some miscellaneous cool stuff you can add to your page.
-Adding roll-over text links in IE 4.x:
If you go back to the frontpage of this site, you'll notice that whenever you pass your mouse over the links using IE 4, they turn red. You can add this same feature to your page by adding the below code to the <head> section of your page:
-Adding a live clock to your page:
You can impress your surfers with a live clock. Just add the below code to your page:
Well, that's it for now folks. Live well and prosper!
Copyright © 1998 All Rights Reserved.