Styles with anchors

[Michael Satterwhite]

How can I independently control the color of the text and the underline in a
stylesheet. Example, How could I make the text black and the underline
blue?

tia
---Michael

 

[Steve Pugh]

How can I independently control the color of the text and the underline in a
stylesheet. Example, How could I make the text black and the underline
blue?

Two ways, neither ideal:

1.
a:link {color: black; background-color: white; text-decoration: none;
border-bottom: 1px solid blue;}

2.
a:link {color: blue; background-color: white;}
a:link span {color: black; background-color: white;}
<a href=""><span>link text</span></a>

Steve

 

[mark | r]

Two ways, neither ideal:

1.
a:link {color: black; background-color: white; text-decoration: none;
border-bottom: 1px solid blue;}

2.
a:link {color: blue; background-color: white;}
a:link span {color: black; background-color: white;}
<a href=""><span>link text</span></a>

<a href="">moo</a>

a{color:#000;border-bottom:1px solid #00f;text-decoration:none}

?

mark

 

[Steve Pugh]

a{color:#000;border-bottom:1px solid #00f;text-decoration:none}

And the differences are?
1. You'll method will also match any <a name=""> anchors that the
author may include for backwards compatability.
2. You've specified a colour without a background colour leading to
potential clashes with user style sheets.
3. You're using hex colours instead of keywords.

Any reason why you decided that you're solution was worth posting as
an addition to mine?

Steve

 

[Richard]

And the differences are?
1. You'll method will also match any <a name=""> anchors that the
author may include for backwards compatability.
2. You've specified a colour without a background colour leading to
potential clashes with user style sheets.
3. You're using hex colours instead of keywords.

Any reason why you decided that you're solution was worth posting as
an addition to mine?

"YOU'RE Method".
There is nothing wrong with using hex codes for "Color".
Would it not be easier to define the color say as "#FFE" rather than it's
worded counterpart?
Not to mention the fact that using hex code is by far more space saving than
say using "lightsteelblue" or perhaps "lemonchiffon" or "lavenderblush".
Using hex codes also makes it easier on the machine in deciphering.

 

[Steve Pugh]

"YOU'RE Method".

I said solution not method, but thanks for pointing out the
you're/your typo. Silly me.

There is nothing wrong with using hex codes for "Color".

Indeed. I normally use hex values exclusively.

I didn't intend for point 3 to be a criticism, I was merely listing
the differences between the two suggested solutions.

I suppose that the conjunction of points 1 and 2 (which are
disadvantages) and point 3 (which is merely a triviality) makes it
seem like 3 is also a disadvantage but that wasn't my intended
meaning.

Would it not be easier to define the color say as "#FFE" rather than it's
worded counterpart?

Um, no. The keywords exist because they are easier to remember.

Not to mention the fact that using hex code is by far more space saving than
say using "lightsteelblue" or perhaps "lemonchiffon" or "lavenderblush".

On the other hand "khaki" is shorter than #ada96e
Really, the few bytes saved or lost this way or that are neither here
nor there.

Using hex codes also makes it easier on the machine in deciphering.

Not really an issue. If (and it's a big if) there is any difference
it's too small to be noticeable.

The real issue is that in HTML 4.01 and hence in CSS2 there are only
16 colour names defined. CSS 2.1 takes that up to 17! But to use the
full X11 set of colour names you need to look at CSS3. Though browsers
have tended to support them for many years now - but we want to stick
to current standards, don't we?

Steve