This is a discussion on How to make a H1 tag in CSS into a link within the Coding Help forums, part of the Webmaster Help category; On the homepage of Diffily.com : "The Website Manager's Handbook" I have a headline "The Website Manager's Handbook". I want ...
| |||||||
| Register | Forum Rules | FAQ | Donate | Members List | Calendar | Search | Today's Posts | Mark Forums Read |
| ||||
| On the homepage of Diffily.com : "The Website Manager's Handbook" I have a headline "The Website Manager's Handbook". I want to use as much semantic markup as possible, so I have marked as a H1 using the following tag h1.homepage_bannerarea { font-size: 300%; color: #ffff00; font-family: Georgia, Verdana, Arial, Helvetica, serif; font-weight: normal; line-height: 80%; BORDER: #cccc00 0px solid; margin-bottom: -0.25em; } However, I now want to make this a hyperlink, with states for LINK, HOVER, ACTIVE and VISITED. How do I do that? Is is something like h1.homepage_bannerarea a.link { etc } h1.homepage_bannerarea a.hover { etc } h1.homepage_bannerarea a.active { etc } h1.homepage_bannerarea a.visited { etc } If so, will it still remain 'semantically' as a HEADING 1? Thanks |
| |||||
| you need to give it an id: Code: <h1 id="h1_link"><a href="#>your text</a></h1>
then in your stylesheet you set it up:
#h1_link h1 a{your style here;}
#h1_link h1 a:hover{your style here;}
__________________ :. Web Design & Development Web Design Ireland :. Search Engines Optimization Search Engines Optimization :. Directory Submission Directory Submission :. News & Press Release Ireland GiveItSocks.com :. Used Cars Ireland, Car Parts & Car Audio Cars For Sale, Car Parts & Accessories :. I Have 2 Find It Directory SEF Directory |
| |||||
| Quote:
#homepage_bannerarea h1 { border: #cccc00 0px solid; color: #ffff00; font-family: Georgia, Verdana, Arial, Helvetica, serif; font-size: 300%; font-weight: normal; line-height: 80%; margin-bottom: -0.25em; } #homepage_bannerarea h1 a:link, #homepage_bannerarea h1 a:visited { ... } #homepage_bannerarea h1 a:hover { ... } Sorry forgot to mention you can then remove the id you are using in the <h1> element (and in the <p> if you use the same logic above) - not requied with above. Links in header elements can give you a slight boost also
__________________ Search Engine Optimisation - Red Cardinal Internet Marketing Internet Consultant Ireland | Search Engine Optimisation Services Catering Company Dublin - My sister's handmade canape company! Last edited by RedCardinal; 06-10-2006 at 02:05 PM. |
| ||||
| WHy id? Wouldn't it be better to use classes instead of id's just incase you want to reuse the link styles? |
| |||||
| You use id when you want just one h1 tag per page to look different. Use classes when you have more then 1 per page. id is also very important if you ever want to make changes to the css and if you ever need to add some sort of Javascript to the h1 tag. |
| Tags |
| css, link, make, tag |
| Thread Tools | |
| Display Modes | |
|
|
| ||||
| Thread | Thread Starter | Forum | Replies | Last Post |
| best way to link content to different websites | louie | Webmaster Discussion | 3 | 23-06-2006 07:56 PM |
| Javascript Menu Help (again...)? | ButtermilkJack | Coding Help | 18 | 25-04-2006 12:32 PM |
| link building | 9barJoe | Search Engine Optimisation | 6 | 21-02-2006 11:51 PM |
| ||||||||
| | ![]() | |||||||