html

IDs and Classes in CSS

The ID attribute is used to uniquely identify a particular tag (& it's contents) on a HTML page. Once a tag has an ID we can apply CSS styling specifically to that tag (& it's contents). This is useful to prevent the use of deprecated tags (<center>, <font>, <b>, <u>, <i>, <strong>, <hn>, etc). Let's take an example to demonstrate what I mean: a simple page with a heading of "Hello World!!" that we want as centred bold piece of text in large font, followed by a paragraph saying "Welcome to my first webpage." which we want right aligned.

HTML Tutorial 5

HTML Tutorial 5

OK was supposed to be finished by now. 4 lessons I said. That won't be so bad. Ah well I do witter on. You should at this stage have a good idea of basic html, how to set up a page [introduction], create a color scheme / layout format [cascading style sheets], insert images and create hyperlinks [pix and lynx] and tables [lists, divs and tables]. Incidentally, we learned about line breaks [<br /> tag] and lines [<hr /> tag].

HTML Tutorial 4

Don't know about you guys but I'm wrecked. It's much harder explaining this stuff than I thought. Hope I'm doing ok. Ok now onto the last html tags we'll look at before we move on to Scripting. Lists, Divisions and Tables. Lists are easy-peasy. We'll look at them in a moment so I'll deal with a tickler of a problem now. You see technically Tables are only to be used for displaying tabulated data (that is data in a table such as you would see in a spreadsheet).

HTML Tutorial 2

HTML Tutorial 2

Style sheets aren't hard. What they are are a template for how your page looks. They can work on the whole page, a specific tag type or an individual tag. They can be manipulated using scripts but that's for .. ya you guessed it, later on. For now we'll look at how to apply a style sheet specification to the whole site through the <body> tag.

To add a style sheet we need the <style> tag. This goes in the <head> tag. Your page should look like this:

HTML Tutorial 3

HTML Tutorial 3

Whew! We've just flown through stuff so far. If you're still with me after all we've done I think you'll make the grade. Honestly it gets easier as we go along. The important thing is not to take what I've taught you as the only way to do things. Experiment with what you've learnt. Look at different way of doing it because once you know the basics it's just a matter of rearranging. Now we have colors and fonts on the site but it's going to be pretty boring without pictures. And it won't go anywhere without links.

HTML Tutorial 1

HTML Tutorial 1

Welcome to my test page for a HTML tutorial. I've started so many of these but I always get bogged down in detail or something else comes up and my notes get mislaid and I end up throwing in the towel. And always a few months later I think to myself why don't I try writing that tutorial again. Well my New Years resolution this year was to get this done so let's give it another shot.

Subscribe to html