CSS - Syntax for defining Links with Classes

Discussion in 'HTML' started by Ben Amada, Jan 16, 2004.

  1. Ben Amada

    Ben Amada Guest

    In the CSS, when defining links with classes, I've seen it done 2 ways.
    Which way is better, correct, and/or the standard?

    ====== Method 1 ======
    A.myclass:visited {color: white}
    A.myclass:link {color: white;}
    A.myclass:active {color: white;}
    A.myclass:hover {color: white;}

    ====== Method 2 ======
    ..myclass a:visited {color: white}
    ..myclass a:link {color: white;}
    ..myclass a:active {color: white;}
    ..myclass a:hover {color: white;}

    Thanks in advance,
    Ben
    Ben Amada, Jan 16, 2004
    #1
    1. Advertising

  2. Ben Amada

    Mark Parnell Guest

    On Thu, 15 Jan 2004 20:08:41 -0700, "Ben Amada"
    <> declared in alt.html:
    > Which way is better, correct, and/or the standard?
    >
    > ====== Method 1 ======
    > A.myclass:visited {color: white}
    > A.myclass:link {color: white;}
    > A.myclass:active {color: white;}
    > A.myclass:hover {color: white;}
    >
    > ====== Method 2 ======
    > .myclass a:visited {color: white}
    > .myclass a:link {color: white;}
    > .myclass a:active {color: white;}
    > .myclass a:hover {color: white;}
    >


    Depends on your HTML.

    Method 1 will work when you have <a href="foo" class="myclass">foo</a>.

    Method 2 will work when you have <element class="myclass"><a
    href="foo">foo</a></element>

    BTW: You should specify a background colour when you specify a text
    colour. :)

    HTH

    --
    Mark Parnell
    http://www.clarkecomputers.com.au
    Mark Parnell, Jan 16, 2004
    #2
    1. Advertising

  3. Ben Amada

    Ben Amada Guest

    Mark Parnell wrote:

    > On Thu, 15 Jan 2004 20:08:41 -0700, "Ben Amada"
    > <> declared in alt.html:
    >> Which way is better, correct, and/or the standard?
    >>
    >> ====== Method 1 ======
    >> A.myclass:visited {color: white}
    >> A.myclass:link {color: white;}
    >> A.myclass:active {color: white;}
    >> A.myclass:hover {color: white;}
    >>
    >> ====== Method 2 ======
    >> .myclass a:visited {color: white}
    >> .myclass a:link {color: white;}
    >> .myclass a:active {color: white;}
    >> .myclass a:hover {color: white;}
    >>

    >
    > Depends on your HTML.
    >
    > Method 1 will work when you have <a href="foo" class="myclass">foo</a>.
    >
    > Method 2 will work when you have <element class="myclass"><a
    > href="foo">foo</a></element>


    I see. Method 1 is better for me then -- I'm not using the element tag.

    > BTW: You should specify a background colour when you specify a text
    > colour. :)


    My link will be in a table which has a background image (which has
    horizontal lines in it). In this case, what background color would I
    specify? Is there a transparent color?

    > HTH

    .... yes, very much so far :)

    Ben
    Ben Amada, Jan 16, 2004
    #3
  4. Ben Amada

    Mark Parnell Guest

    On Thu, 15 Jan 2004 21:27:13 -0700, "Ben Amada"
    <> declared in alt.html:
    > Mark Parnell wrote:
    >> On Thu, 15 Jan 2004 20:08:41 -0700, "Ben Amada"
    >> <> declared in alt.html:
    >>> Which way is better, correct, and/or the standard?
    >>>
    >>> ====== Method 1 ======
    >>> A.myclass:visited {color: white}
    >>> A.myclass:link {color: white;}
    >>> A.myclass:active {color: white;}
    >>> A.myclass:hover {color: white;}
    >>>
    >>> ====== Method 2 ======
    >>> .myclass a:visited {color: white}
    >>> .myclass a:link {color: white;}
    >>> .myclass a:active {color: white;}
    >>> .myclass a:hover {color: white;}
    >>>

    >>
    >> Depends on your HTML.
    >>
    >> Method 1 will work when you have <a href="foo" class="myclass">foo</a>.
    >>
    >> Method 2 will work when you have <element class="myclass"><a
    >> href="foo">foo</a></element>

    >
    > I see. Method 1 is better for me then -- I'm not using the element tag.


    There is no element tag. I used it to show that Method 1 works if the
    class is on the element containing the anchors (whether it be a <div>, a
    list, whatever). Method 2 works if the class is on the anchors
    themselves.

    >
    >> BTW: You should specify a background colour when you specify a text
    >> colour. :)

    >
    > My link will be in a table


    It *is* tabular data, I assume?

    > which has a background image (which has
    > horizontal lines in it). In this case, what background color would I
    > specify? Is there a transparent color?


    Strangely enough, { background: transparent; } :)

    --
    Mark Parnell
    http://www.clarkecomputers.com.au
    Mark Parnell, Jan 16, 2004
    #4
  5. Ben Amada

    Chet Guest

    "Ben Amada" <> wrote in message
    news:GMJNb.27562$zs4.7426@fed1read01...
    | Mark Parnell wrote:
    |
    | > On Thu, 15 Jan 2004 20:08:41 -0700, "Ben Amada"
    | > <> declared in alt.html:
    | >> Which way is better, correct, and/or the standard?
    | >>
    | >> ====== Method 1 ======
    | >> A.myclass:visited {color: white}
    | >> A.myclass:link {color: white;}
    | >> A.myclass:active {color: white;}
    | >> A.myclass:hover {color: white;}
    | >>
    | >> ====== Method 2 ======
    | >> .myclass a:visited {color: white}
    | >> .myclass a:link {color: white;}
    | >> .myclass a:active {color: white;}
    | >> .myclass a:hover {color: white;}
    | >>
    | >
    | > Depends on your HTML.
    | >
    | > Method 1 will work when you have <a href="foo"
    class="myclass">foo</a>.
    | >
    | > Method 2 will work when you have <element class="myclass"><a
    | > href="foo">foo</a></element>
    |
    | I see. Method 1 is better for me then -- I'm not using the
    element tag.
    |
    | > BTW: You should specify a background colour when you specify
    a text
    | > colour. :)
    |
    | My link will be in a table which has a background image (which
    has
    | horizontal lines in it). In this case, what background color
    would I
    | specify? Is there a transparent color?
    |
    | > HTH
    | ... yes, very much so far :)
    |
    | Ben

    A.myclass:visited {color: white;background-color:transparent;}

    The background-color: transparent; will allow the table
    background to show through.

    hth
    --
    Chet
    (remove NO.....SPAM)
    Chet, Jan 16, 2004
    #5
  6. Ben Amada

    Ben Amada Guest

    Thanks Chet.

    Ben
    Ben Amada, Jan 16, 2004
    #6
  7. Ben Amada

    Ben Amada Guest

    Mark Parnell wrote:

    > On Thu, 15 Jan 2004 21:27:13 -0700, "Ben Amada"
    > <> declared in alt.html:
    >> Mark Parnell wrote:
    >>> On Thu, 15 Jan 2004 20:08:41 -0700, "Ben Amada"
    >>> <> declared in alt.html:
    >>>> Which way is better, correct, and/or the standard?
    >>>>
    >>>> ====== Method 1 ======
    >>>> A.myclass:visited {color: white}
    >>>> A.myclass:link {color: white;}
    >>>> A.myclass:active {color: white;}
    >>>> A.myclass:hover {color: white;}
    >>>>
    >>>> ====== Method 2 ======
    >>>> .myclass a:visited {color: white}
    >>>> .myclass a:link {color: white;}
    >>>> .myclass a:active {color: white;}
    >>>> .myclass a:hover {color: white;}
    >>>>
    >>>
    >>> Depends on your HTML.
    >>>
    >>> Method 1 will work when you have <a href="foo" class="myclass">foo</a>.
    >>>
    >>> Method 2 will work when you have <element class="myclass"><a
    >>> href="foo">foo</a></element>

    >>
    >> I see. Method 1 is better for me then -- I'm not using the element tag.

    >
    > There is no element tag. I used it to show that Method 1 works if the
    > class is on the element containing the anchors (whether it be a <div>, a
    > list, whatever). Method 2 works if the class is on the anchors
    > themselves.


    OK - I now see what you were explaining. In this case, I'll be defining the
    class directly on the anchor itself -- so I believe Method 1 is better in
    that case (above you say Method 2, but I think you meant Method 1 looking at
    your original example).

    >>> BTW: You should specify a background colour when you specify a text
    >>> colour. :)

    >>
    >> My link will be in a table

    >
    > It *is* tabular data, I assume?


    I'm not sure what you mean by "tabular data". It isn't a chart for
    instance - the table basically displays some background graphics and images
    which make up the navigation menu for the web site.

    >> which has a background image (which has
    >> horizontal lines in it). In this case, what background color would I
    >> specify? Is there a transparent color?

    >
    > Strangely enough, { background: transparent; } :)


    A-ha! That was too obvious :)

    Thanks,
    Ben
    Ben Amada, Jan 16, 2004
    #7
  8. Ben Amada

    Mark Parnell Guest

    On Thu, 15 Jan 2004 23:17:54 -0700, "Ben Amada"
    <> declared in alt.html:
    >
    > OK - I now see what you were explaining. In this case, I'll be defining the
    > class directly on the anchor itself -- so I believe Method 1 is better in
    > that case (above you say Method 2, but I think you meant Method 1 looking at
    > your original example).
    >


    Yes. I'm not doing very well at things like that today. I think I need
    to go home. :-/

    > I'm not sure what you mean by "tabular data". It isn't a chart for
    > instance - the table basically displays some background graphics and images
    > which make up the navigation menu for the web site.
    >


    That doesn't sound like tabular data. Why does it need to be in a table?
    http://www.allmyfaqs.com/faq.pl?Tableless_layouts

    --
    Mark Parnell
    http://www.clarkecomputers.com.au
    Mark Parnell, Jan 16, 2004
    #8
  9. Ben Amada

    Ben Amada Guest

    Mark Parnell wrote:

    >> I'm not sure what you mean by "tabular data". It isn't a chart for
    >> instance - the table basically displays some background graphics and
    >> images which make up the navigation menu for the web site.
    >>

    >
    > That doesn't sound like tabular data. Why does it need to be in a table?
    > http://www.allmyfaqs.com/faq.pl?Tableless_layouts


    I took a quick look at the link you provided. You're probably right that a
    table could be avoided, but it's a somewhat complicated table and I'm not
    sure if I can easily convert it to a tableless layout. Nevertheless, I'll
    look at some of the sample code to familiarize myself with some of the
    concepts and see how I feel about attempting to convert it.

    Thanks,
    Ben
    Ben Amada, Jan 16, 2004
    #9
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Senthilraja
    Replies:
    7
    Views:
    568
    stelios xanthakis
    Oct 15, 2003
  2. johny smith
    Replies:
    8
    Views:
    400
    Peter Koch Larsen
    Jul 2, 2004
  3. Raj Kotaru

    Colon (:) syntax in defining fields in a struct

    Raj Kotaru, Aug 28, 2004, in forum: C Programming
    Replies:
    16
    Views:
    6,403
    Keith Thompson
    Sep 3, 2004
  4. FaYYaZ

    Syntax error when defining class

    FaYYaZ, Dec 3, 2004, in forum: ASP General
    Replies:
    1
    Views:
    104
    Bob Barrows [MVP]
    Dec 3, 2004
  5. vasudevram
    Replies:
    6
    Views:
    909
    vasudevram
    Apr 24, 2013
Loading...

Share This Page