Overriding CSS Declaration for Different Use

30/03/2008, 21h50

How do I override the usage of a CSS declaration that's used in a
different way? That is, I want to use the <a..../a> in 2 ways:
initially as horizontal (menu) links, but later as a link to a document
(Word, PDF, etc.). Following is code that illustrates what I'm trying
to do:

<style type="text/css">
a {width:9em; text-decoration:none; color:black;
background-color

range; padding:0.2em 0.6em;}
a:hover {background-color:#ff3300}
li {display:inline}
</style>
[...]

<body style="color: rgb(255, 255, 255); background-color: blue"
alink="#ff6600" link="#99ff99" vlink="#990099">
<div style="text-align: center;">
<ul>
<li><a href="#bulletins">Bulletins & Alerts</a></li>
<li><a href="#rules">Rules & Regulations</a></li>
<li><a href="#board">HOA Board</a></li>
<li><a href="#staff">Building Staff</a></li>
<li><a href="#news">Area News</a></li>
<li><a href="#services">Service Directory</a></li>
</ul>
</div>

<div style="text-align: left; color: white;">
<p class="margin">The Regency House Rules and Regulations defines "how
things work"
for residents of the building. This document is here:
<A HREF="RH_Rules01.doc"/A>Rules & Regulations</A><br></p></div>
^^^^^^^^^^^^^^^^^^^^^^^^^^^
Thge usage above doesn't render as I'd like (because it inherits the
characteristics of the CSS declaration), but I'd like it to look like
the text where it appears. Searching Google and looking at several
books doesn't show how to do what I want. Please advise. TIA

30/03/2008, 22h26

Sun, 30 Mar 2008 13:50:25 -0700 from Michael R. Copeland <mrc2323
@cox.net>:
> How do I override the usage of a CSS declaration that's used in a
> different way? That is, I want to use the <a..../a> in 2 ways:
> initially as horizontal (menu) links, but later as a link to a document
> (Word, PDF, etc.).

I don't understand -- a link is a link is a link. But if you want to
style two sets of links differently, give one set a class. If the
"exception" set is in a menu, you could put a class once on the top
level of the menu and then use
.classname a
in your CSS for the declarations you want to apply only to the menu
links.

> Following is code that illustrates what I'm trying
> to do:

Sigh.

--
Stan Brown, Oak Road Systems, Tompkins County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2.1 spec: http://www.w3.org/TR/CSS21/
validator: http://jigsaw.w3.org/css-validator/
Why We Won't You:
http://diveintomark.org/archives/200..._wont__you

30/03/2008, 22h32

On 2008-03-30, Michael R. Copeland <mrc2323@cox.net> wrote:
> How do I override the usage of a CSS declaration that's used in a
> different way? That is, I want to use the <a..../a> in 2 ways:
> initially as horizontal (menu) links, but later as a link to a document
> (Word, PDF, etc.). Following is code that illustrates what I'm trying
> to do:

Use classes.

a.foo { color: black }
a.bar { color: red }

<a class="foo">...

<a class="bar">...

>
><style type="text/css">
> a {width:9em; text-decoration:none; color:black;
> background-color

range; padding:0.2em 0.6em;}

No point setting width on an inline element-- it;s ignored.

01/04/2008, 16h03

On Sun, 30 Mar 2008 13:50:25 -0700, (Michael R. Copeland) wrote:

> <body style="color: rgb(255, 255, 255); background-color: blue"
> alink="#ff6600" link="#99ff99" vlink="#990099">

Move the style attributes to your external style sheet, then the HTML
of your 6 or 7 pages will each simply have <body>
--

Charles.

30/03/2008, 21h50	#1
Michael R. Copeland Messages: n/a Hébergeur:	Overriding CSS Declaration for Different Use How do I override the usage of a CSS declaration that's used in a different way? That is, I want to use the <a..../a> in 2 ways: initially as horizontal (menu) links, but later as a link to a document (Word, PDF, etc.). Following is code that illustrates what I'm trying to do: <style type="text/css"> a {width:9em; text-decoration:none; color:black; background-colorrange; padding:0.2em 0.6em;} a:hover {background-color:#ff3300} li {display:inline} </style> [...] <body style="color: rgb(255, 255, 255); background-color: blue" alink="#ff6600" link="#99ff99" vlink="#990099"> <div style="text-align: center;"> <ul> <li><a href="#bulletins">Bulletins & Alerts</a></li> <li><a href="#rules">Rules & Regulations</a></li> <li><a href="#board">HOA Board</a></li> <li><a href="#staff">Building Staff</a></li> <li><a href="#news">Area News</a></li> <li><a href="#services">Service Directory</a></li> </ul> </div> <div style="text-align: left; color: white;"> <p class="margin">The Regency House Rules and Regulations defines "how things work" for residents of the building. This document is here: <A HREF="RH_Rules01.doc"/A>Rules & Regulations</A><br></p></div> ^^^^^^^^^^^^^^^^^^^^^^^^^^^ Thge usage above doesn't render as I'd like (because it inherits the characteristics of the CSS declaration), but I'd like it to look like the text where it appears. Searching Google and looking at several books doesn't show how to do what I want. Please advise. TIA

30/03/2008, 22h26	#2
Stan Brown Messages: n/a Hébergeur:	Re: Overriding CSS Declaration for Different Use Sun, 30 Mar 2008 13:50:25 -0700 from Michael R. Copeland <mrc2323 @cox.net>: > How do I override the usage of a CSS declaration that's used in a > different way? That is, I want to use the <a..../a> in 2 ways: > initially as horizontal (menu) links, but later as a link to a document > (Word, PDF, etc.). I don't understand -- a link is a link is a link. But if you want to style two sets of links differently, give one set a class. If the "exception" set is in a menu, you could put a class once on the top level of the menu and then use .classname a in your CSS for the declarations you want to apply only to the menu links. > Following is code that illustrates what I'm trying > to do: Sigh. -- Stan Brown, Oak Road Systems, Tompkins County, New York, USA http://OakRoadSystems.com/ HTML 4.01 spec: http://www.w3.org/TR/html401/ validator: http://validator.w3.org/ CSS 2.1 spec: http://www.w3.org/TR/CSS21/ validator: http://jigsaw.w3.org/css-validator/ Why We Won't You: http://diveintomark.org/archives/200..._wont__you

30/03/2008, 22h32	#3
Ben C Messages: n/a Hébergeur:	Re: Overriding CSS Declaration for Different Use On 2008-03-30, Michael R. Copeland <mrc2323@cox.net> wrote: > How do I override the usage of a CSS declaration that's used in a > different way? That is, I want to use the <a..../a> in 2 ways: > initially as horizontal (menu) links, but later as a link to a document > (Word, PDF, etc.). Following is code that illustrates what I'm trying > to do: Use classes. a.foo { color: black } a.bar { color: red } <a class="foo">... <a class="bar">... > ><style type="text/css"> > a {width:9em; text-decoration:none; color:black; > background-colorrange; padding:0.2em 0.6em;} No point setting width on an inline element-- it;s ignored.

01/04/2008, 16h03	#4
BobaBird Messages: n/a Hébergeur:	Re: Overriding CSS Declaration for Different Use On Sun, 30 Mar 2008 13:50:25 -0700, (Michael R. Copeland) wrote: > <body style="color: rgb(255, 255, 255); background-color: blue" > alink="#ff6600" link="#99ff99" vlink="#990099"> Move the style attributes to your external style sheet, then the HTML of your 6 or 7 pages will each simply have <body> -- Charles.

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email