This is Interesting: Free Magazines for Graphics designers and webmasters  


Home > Archive > Stylesheets > March 2007 > Inline css tags: need to add link color and hover over behavior





You are viewing an archived Text-only version of the thread. To view this thread in it's original format and/or if you want to reply to this thread please [click here]

Author Inline css tags: need to add link color and hover over behavior
Bubba

2007-03-20, 11:18 pm

I need to use an inline css tag for a few links that will not behave like
the a:link and a:hover attributes in my stylesheet. I want to add a special
link color with underline and a mouseover a:hover attribute to eliminate an
underline when underlined to a series of links . Wondering how possible
putting an inline style such as this to <a href> tag
thanks


Els

2007-03-20, 11:18 pm

Bubba wrote:

> I need to use an inline css tag for a few links that will not behave like
> the a:link and a:hover attributes in my stylesheet. I want to add a special
> link color with underline and a mouseover a:hover attribute to eliminate an
> underline when underlined to a series of links . Wondering how possible
> putting an inline style such as this to <a href> tag


No, that's not possible in inline styles. But IIUC, you need one link
out of a list to have different styles on them. Just add a class, and
then use the class in the stylesheet to make the difference.

<a class="foo" href="....">some link</a>

a:hover{color:blue;}
a.foo:hover{color:pink;text-decoration:none;}

--
Els http://locusmeus.com/
accessible web design: http://locusoptimus.com/
Jukka K. Korpela

2007-03-21, 4:19 am

Scripsit Bubba:

> I need to use


No, you don't, you just want, and you should stop wanting.

> an inline css tag


There are no css tags, inline or otherwise.

> for a few links that will not behave
> like the a:link and a:hover attributes in my stylesheet.


They are pseudo-classes, not attributes. Using consistently wrong terms
indicates that you haven't read good books or tutorials on CSS. There is
little hope of success with style sheets before you take some time to learn
the basics. Surely you can do a casual move in styling here and there
without understanding much (getting started with CSS is _very_ easy in a
sense), but you are past that when you want to style links.

> I want to
> add a special link color with underline and a mouseover a:hover
> attribute to eliminate an underline when underlined to a series of
> links .


Special link colors are just confusing. For usability, you need minimally
three colors for links in their different states, and naturally all these
must be clearly distinct from each other and from text color, and not too
far from typical default link colors. That's difficult enough. No reason to
make it more difficult by using "color coding" for special links. Use some
other properties for special links (bolding, different font, borders,
whatever).

Once you've decided on that, and once you've studied the basics of CSS (and
I don't mean foolish tutorials that start telling you how to remove
underlining of links and how to set font size in points), this will be
smooth sailing, like

<ul class="special"><li><a href="...">...</a></li>...</ul>

with

..special a { font-variant: small-caps; }
..special a:hover { text-decoration: none; }

> Wondering how possible putting an inline style such as this
> to <a href> tag


It's not possible.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

Andy Dingley

2007-03-21, 7:17 am

On 21 Mar, 00:27, "Bubba" <1...@2.com> wrote:
> I need to use an inline css tag for a few links that will not behave like
> the a:link and a:hover attributes in my stylesheet.


Yes, just do it.

* It's not valid.

* It usually works anyway,

* I assume you meant a <style> tag to embed a CSS stylesheet, not
"inline CSS" (which is different)


Really you ought to place such things in the <head> of the HTML
document, either as an internal or external stylesheet. I can only
assume here that you're stuck with some sort of blog where you don't
have access to <head>.

Jukka K. Korpela

2007-03-21, 7:21 pm

Scripsit Andy Dingley:

> I can only
> assume here that you're stuck with some sort of blog where you don't
> have access to <head>.


That's a wild guess, but who knows, these days? People get blogged for no
reason, good or bad.

There's still always the option of doing something useful, possibly in the
form of authoring one's own content for the World Wide Web and maybe styling
it a little.

If you're stuck with some mode of authoring where you are expected to style
pages without being able to affect the <head> (or CSS files referred to in
the the <head> ), make sure you get paid _well_ for that misery.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

Andy Dingley

2007-03-21, 7:21 pm

On 21 Mar, 11:18, "Jukka K. Korpela" <jkorp...@cs.tut.fi> wrote:

> If you're stuck with some mode of authoring where you are expected to style
> pages without being able to affect the <head> (or CSS files referred to in
> the the <head> ), make sure you get paid _well_ for that misery.


Oh, I did 8-)

I've just realised that the page is still up, 3 years later (I
thought it died a year ago)
<http://www.msngamecentre.co.uk/Page...x-promo-UK.aspx>

My embedded chunk is here: <div class="MSN-fragment-container"> and
inside it
It's more or less as I left it, although a few bits of cruft have
crept in since.

Sponsored Links


Copyright 2003 - 2008 forum4designers.com  Software forum  Computer Hardware reviews