Most things on the internet use hypertext markup language or html for short - you'll see it as a .htm or .html page in the address bar. Of course, everyone knows the obvious things like <p> and <b> tags. But there are more useful things you can do.
Lists
I know, this is hardly exciting but there's a surprising amount you can do. Your basic list using <li> tags is dull. But you can add bullet points.
Now, if you want them all the same, there's an easier way.
- Start with <ul type="circle"> (replacing circle with the sort of your choice)
- Then just use the <li> tags for each one
- And when you're done listing, </ul>
- It's that easy.
However, sometimes you want some kind of order to your lists. Then you can use an ordered list.
- First off, you need a <ol> tag
- Now, if you don't want boring numbers, you can change it.
- <ol type="I"> gives you roman numerals
- <ol type="A"> gives you capital letters
- Using a lower case i or A will give you them in lower case.
- To end, a simple <ol> will do it.
Of course, there is more...
- Sometimes, you don't want to start at 1.
- <ol start="7"> does that.
- Just change the number to what you want to start with.
- With the letters, you need to start at the corresponding number to that letter
- To start at C, you need <ol start="3">
And that's all there is. You can use the attributes together obviously - now go and have fun with lists!
Scrolling text
Ever seen text do something like this:
You usually see them for news or something like that. Of course, the marquee above is really dull. Let's speed it up a bit
To speed up, add the scrollamount="number" attribute (something like this: <marquee scrollamount="5"> 5 is as fast as the one on the page at the top.
Try hovering your mouse over the marquee above. See it slow down? It speeds up again when you take the mouse away too. Also, notice how it doesn't go across the entire page like the other? That's thanks to the width attribute. Inside the basic </marquee> tags, add the scrollamount, width, onMouseover and onMouseout attributes to get something like </marquee scrollamount="5" width="75%" onMouseover="this.scrollAmount=3" onMouseout="this.scrollAmount=5"> The scrollamount is what it starts on, onMouseover is when you hover and onMouseout is afterwards.
There's no limit to how much text you can put in a marquee however, you might might want to warn people before they sit there for half an hour, reading your endless ramblings
- Definitions
- The posh word for having one line of text, followed by another that's indented.
That's all it is. It can be quite a useful text formatting tool and it works like a list. Start with the definition list tag - <dl>. This says "I want to start a list of definitions" and then, for the word to be defined , i.e. the not indented bit, <dt>. After that, a simple <dd> will indent the next line. When you're done, just </dl> and close the tags. Have a look here for the definition. Found it? It's very near the beginning. Also on that page, and on this one, you can find the next two html tricks.
Page Anchors
Ever seen a link to another place on the page? That's a page anchor doing it. It works exactly like the anchor tags for making a link to another page, you just have to make the place you're linking to.
<a href="#linkname">place to skip to</a> and <a name="linkname">place to skip to</a> are the only tags you're going to need. The first one is the link, and the second is where you're linking to. In your contents or wherever you want the link to be, put <a href="#linkname">place to skip to</a> with the words you want visible between the <a href="#linkname"> and the </a>. Then, at the place you're heading to, you'll use the second set of tags. Place <a name="linkname"> and </a> around the heading or words you want to be at the start of the section. Next comes the very important bit...
The two "linknames" must be the SAME!!! EXACTLY THE SAME!!!
If they aren't, your computer will explode when you click... well, not exactly, but the links won't work. And no-one likes it when that happens ^^
Don't forget though, there's nothing to stop you having more than on <a href="#linkname">place to skip to</a> for one particular link. You could make it like a link maze...
Horizontal Rules
Now, if you don't think you've come across these you are very much mistaken. There are plenty all over the site - like right above this section........ Still haven't seen one? Well, here's a very basic example.
Like it? Yeah, <hr> by itself is very dull... Let's add some color.
It's really easy, just add in the color attribute like for fonts. It should look a bit like this: <hr color="#FF0000"> You don't have to have a red one, any colour is fine as long as you know the hexadecimal code! Ours of course, don't quite cover the whole page though...
If you look at marquees, you'll find the same width attribute. A percentage inside quotation marks to look a bit like this: <hr color="#FF0000" width="50%"> Aswell as different widths on the page though, you can get them in different thicknesses too...
Cool huh? You want to be able to do it as well? Haven't I helped you enough? OK fine. add size="6" or another number to change the thickness. You might see something like <hr color="#FF0000" width="50%" size="6">
Acknowledgements
My sources for making this page was Eonlight Valley for page anchors and marquees as well as Web-source.net's html codes table.
Thanks for reading.
By the way, if you were wondering how I made the < and > visible on an html document, it's simple. & lt ; for < (without spaces) and & gt ; for > (again, without spaces).