Solved

over-riding css style for anchor tags

Posted on 2002-06-10
4
302 Views
Last Modified: 2012-05-04
in a .css file i have defined anchor properties (hover, visited etc.)

how can i over-ride these settings in certain parts of an html page that uses this .css file?

e.g. use different hover colors etc.

thanks.
0
Comment
Question by:loyaliser
  • 2
4 Comments
 
LVL 32

Expert Comment

by:Batalf
ID: 7068311
You could use a class

.myclass{text-decoration:none;color:#ff0000;}
.myclass:hover{text-decoration:underline;color:#000000;}

0
 
LVL 32

Accepted Solution

by:
Batalf earned 50 total points
ID: 7068313
And of course use that class in some of your <a> tags

<a href="whatever" class="myClass"....
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 7068344
Just specify a different class for each section of the page then you do not have to specify a class for each link:

<html>
<title> multi-links </title>
<head>
<style media="screen" type="text/css">
   .class1 a:link { color: blue }
   .class1 a:visited { color: blue }
   .class1 a:hover { color: blue}
   .class2 a:link { color: white }
   .class2 a:visited { color: white }
   .class2 a:hover { color: white }
</style>
</head>

<body>
<div class="class1">

... content for the first part of the page  ...
 
<div class="class2">

... content for the second part of the page

</div>
</font>
</body>
</html>
The div wrapped around the links for each section of the page will cause the links in that section to inherit the specification contained in that class.

Cd&
0
 
LVL 1

Author Comment

by:loyaliser
ID: 7068370
that's the ticket!

thanks...
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Scroll 5 news at a time. 4 33
Sort Order Icons on HTML Table 3 35
return false must be hit after calling certain command 10 32
Button on Table, name table1 not working 4 22
This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

860 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question