Forum Moderators: not2easy
I want to use CSS to set my hyperlink colors for navigation on the left side of a page while still maintaining the standard hyperlink colors elsewhere on the page.
1) Can all browsers view this?
2) Can SEs/spiders follow/see the hyperlink then?
TIA,
Brian
If you stick to NN4-compatible CSS, you should be OK.
Strictly speaking, "all" browser can do ~very~ little. However, most modern browsers recognize at least some CSS.
Here is one good starting place:
[dmoz.org...]
Also helpful are the WebReview.com compatibility charts:
CSS - [webreview.com...]
Browser - [webreview.com...]
Thanks all for the fast responses. I'll check out the links. I just plan on using it for changing the navigation set links (I'm going to be using text links) while stil keeping the standard on content text links using a:link, a:visited, a:active.
Brian
Setting link colors with CSS in no way affects a spider's ability to "read" the links.
I assume, however, that in both parts of your page you are using colors that contrast strongly with the page background. Although the SEs don't catch "invisible text" created through CSS as fast as they catch the older methods, nevertheless they can catch it, and then they punish.
My advice to anyone who is tempted to hide text with CSS is don't do it. One competitor phone call of complaint could nail you, even if the SEs don't catch you in their routine checks.
Nope, I worked to long to chance that. I want to use it to change my nav. text hyperlinks to blend in better with my side bar VS. in line content hyperlinks in the main part of the page which is white.
Thanks for the tip though,
Brian
I am bummed however when playing last night I found I can not make NN 4.x recognize the a.link, a.visited, a.active. Oh well life goes on eh ;).
Brian
<html>
<head>
<title>CSS Test</title>
<!---This shows examples of different style hyper link attributes--->
<style type="text/css">
a:link.col {color: red; text-decoration: none; font-weight: bold}
a:active.col {color: green; text-decoration: none; font-weight: bold}
a:visited.col {color: yellow; text-decoration: none; font-weight: bold}
a:hover.col {color: lime; background-color: black; font-weight: bolder}
a:link.col2 {color: green; text-decoration: none; font-weight: bold}
a:active.col2 {color: blue; text-decoration: none; font-weight: bold}
a:visited.col2 {color: purple; text-decoration: none; font-weight: bold}
a:hover.col2 {color: red; background-color: silver; font-weight: bolder}
a:link.col3 {color: fuchsia; text-decoration: none; font-weight: bold}
a:active.col3 {color: red; text-decoration: none; font-weight: bold}
a:visited.col3 {color: blue; text-decoration: none; font-weight: bold}
a:hover.col3 {color: orange; background-color: brown; font-weight: bolder}
</style>
</head>
<body>
<a href="index.htm" class="col">Home</a>
<br>
<a href="index.htm" class="col2">Home</a>
<br>
<a href="index.htm" class="col3">Home</a>
<br>
</body>
</html>
Thanks again,
Brian
P.S.- CSS seems to be some pretty slick stuff :). The sleeper has awakened.
p.happypara:hover { }
Actually, p:hover is a bad example, since NN4 doesn't support hover and IE only supports it on "a" elements :)
The W3C has a CSS validator at [jigsaw.w3.org...] which is helpful in some cases, and [richinstyle.com...] has bug lists for the browsers.
Thanks. It is Monday morning here and Mt. dew is not coursing through my veins yet. So your saying, this is my original line (being CSS2 compliant)
a:link.col {color: red; text-decoration: none; font-weight: bold}
I need to do this (to make it CSS 1 compliant):
a.col:link {color: red; text-decoration: none; font-weight: bold}
I will check out the links when I get home later today, thank you for them.
Brian
Brian
