How do I customize the style of a link on my html page?

M

Mrs. Gaspard

New member
Basically, I want it so that when I click on the link, it takes me to a part I want on the same page (I understand this is used like < a href = #wordonapartIwant > ???) and also that when I put my mouse over it, the text becomes all uppercase. How do I do this? A sample code would be nice :) thanks!
thanks CB! The anchor thingos worked! But I was wondering if the mouseover thing can be done by regular html?
 
In your html:
< a href = #wordonapartIwant ><span class="inPageLink">stuff, stuff</span></a>

In your CSS (if you don't know how to use CSS, just put it in your header section in between style tags as shown, otherwise put into your CSS file:

<style type="text/css">
a{text-transform: none;}
a.inPageLink:hover{text-transform: uppercase }
</style>

When you are doing it, just remember that the word will now be taking up more space - and push any other text on that page around. You can use "capitalize" instead, and just the first letter becomes uppercase.
 
When you click a link like: <a href='../something.html#goHere'>Go Here!</a> you must need a anchor name on the place you want to jump to.
Simply, just have another place on the page like this:
<a name='goHere'>The Result</a>
Now when you click on the 'Go Here!' it will jump down the 'The Result!'.
Do make the link change to uppercase, you use the "a" and "a:hover" CSS properties. Example:
<style ...>
// Default Link style
a { font-size: 8px; font-color: blue; }
// When your mouse hovers over link, change uppercase, and font color
a { font-size: 8px; font-color: red; text-transform: uppercase; }
</style>
Good Luck!
If you need any further assistance/advice, feel free to contact me.
 
This is a pretty good tutorial...

http://www.openzu.com/Tutorials/HTML/Links/p-46/

then..

http://www.openzu.com/Tutorials/CSS/p-33/

hope that helps!
 
Back
Top