View Single Post
  #4  
Old June 28th, 2011, 11:23 AM
Buzz Buzz is offline
Cyber Tech Help Moderator
 
Join Date: Sep 2000
O/S: MacOS
Location: Oregon, USA
Posts: 4,005
EVERYTHING, can be styled. But some things need to be called out with a selector (class or id).

If you have code like this....

Code:
<p>This is a paragraph with an <a href="#">internal link</a> in it. I added additional text simply to fill out the paragraph. This text is unimportant and merely used for placement. If you've read this far, you must not believe me. This text doesn't matter. It's simply "filler" text to add an <a href="#">internal link</a> and show the code. So stop reading now.</p>

<div class="thumbnail">
<a href="#"><img src="path/to/image.jpg" width="100" height="100" alt="thumbnail image" border="0" /></a>
</div>

<div class="thumbnail">
<a href="#"><img src="path/to/image.jpg" width="100" height="100" alt="thumbnail image" border="0" /></a>
</div>

<div class="thumbnail">
<a href="#"><img src="path/to/image.jpg" width="100" height="100" alt="thumbnail image" border="0" /></a>
</div>
That has all straight anchor tags. So if your CSS looks like this...

Code:
a:link, a:visited {
    color: #a00;
    font-weight: bold;
    text-decoration: strikethrough; }

a:hover,a:active,a:focus {
    color: #f00;
    font-weight: normal;
    text-decoration: overline; }
Then all links, including those for the images will be red with a strikethough line and then turn yellow with an overline when you hover over them.

In order to NOT style the anchor tags within the thumbnail divs, you have to specifically target those anchors like so...

Code:
a:link, a:visited {
    color: #a00;
    font-weight: bold;
    text-decoration: strikethrough; }

a:hover,a:active,a:focus {
    color: #f00;
    font-weight: normal;
    text-decoration: overline; }

.thumbmail a:link, .thumbnail a:visited {
    color: #f00;
    font-weight: normal;
    text-decoration: none; 
    background: #009;}

.thumbmail a:hover, .thumbnail a:active, .thumbnail a:focus {
    color: #f00;
    font-weight: normal;
    text-decoration: none; 
    background: #333;}
This way you've got specific CSS to style only the anchors which appear inside a div with the class of ".thumbnail".

Without seeing how your page is coded, this is the best I can do.
Reply With Quote