Heres the page I'm currently working on. The code

a img { border:none; }

is affecting the image

<img src="athenslogo1.png" />

and I Don't want to make a class for every image I'm going to be using because, it's alot and also including the images I have on other pages where I will also have to modify the same code. my question is: Is there a way to make an exception in css to not affect an html tag or attribute? If there isn't, is there an alternative? Another thing, are any of the css I'm doing not good to be using for a good standard?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
</head>
<body>

<style type="text/css">

ul {
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}

li {
float:left;
border:2px solid #ff00cc;
text-align:center;
}
.barurls {
display:block;
width:100px;
background-color:#00ccee;
color:#0000FF;
}

a.barurls2:hover {
background-color:#00aaff;
color:#ff00cc;
}

a img { border:none; }

img:hover {border:3px solid #ff00cc;}


al {
background-color:#00aaff;
}
</style>

<ul>
<li><a class="barurls barurls2" href=""><img src="athenslogo1.png" /></a></li>
<li><a class="barurls barurls2" href="default.asp">Home</a></li>
<li><a class="barurls barurls2" href="news.asp">Links</a></li>
<li><a class="barurls barurls2" href="contact.asp">Contact Us</a></li>
<li><a class="barurls barurls2" href="">Site Uploader</a></li>
<li><a class="barurls barurls2" href="about.asp">Site Map</a></li>
</ul>
<div>
Athens Website: The place for all the cool kids ;) mainly athenian spys and such
<br /><br />
Main Page: Find the alliance your looking for and stalk them
<br /><br />
Links: The links page of cool links that people like to go to and that people think are cool its the happening place
<br /><br />
Contact Page: You want to contact us, tell us somthign important, or get our SSN's go here.
<br /><br />
Site Uploader: Upload an immage to be placed of an alliance thats curently on the list  
<br /><br />
How to use Page: This is a pop up window that will explain to you how to use this site if it is confusing :p
</div>
</body>
</html>

How about making a class for the exceptions that change the default behavior?

That would be great except I don't know how to write css that changes defalt behavior. That would be cool to know how to do. do you have any suggestions?

my friend helped me out this nifty bit of code worked wonders

img.test:hover {border:0px solid #000000;}
<img class='test' src="athenslogo1.png" />

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.