Yahoo Answers is shutting down on May 4th, 2021 (Eastern Time) and beginning April 20th, 2021 (Eastern Time) the Yahoo Answers website will be in read-only mode. There will be no changes to other Yahoo properties or services, or your Yahoo account. You can find more information about the Yahoo Answers shutdown and how to download your data on this help page.

CSS hyperlink attributes?

What exactly are they? I'm taking a Web Design course and I'm being told to "Add the CSS hyperlinks attributes to your Portfolio, Invitation and Web Master Roles Web pages."

3 Answers

Relevance
  • Astano
    Lv 7
    1 decade ago
    Favorite Answer

    I would assume they are talking about the CSS Hyperlink colours and styles. You can use CSS to remove the underline from a link and stuff. http://www.quackit.com/css/css_hyperlinks.cfm

    Source(s): Website Developer
  • Anonymous
    1 decade ago

    You may not know it, but a link has four different states that it can be in. CSS allows you to customize each state. Please refer to the following keywords that each correspond to one specific state:

    * link - this is a link that has not been used, nor is a mouse pointer hovering over it

    * visited - this is a link that has been used before, but has no mouse on it

    * hover - this is a link currently has a mouse pointer hovering over it/on it

    * active - this is a link that is in the process of being clicked

    Using CSS you can make a different look for each one of these states:

    a:link {

    color:#006;

    text-decoration:none;

    cursor:pointer;

    }

    a:visited {

    color:#369;

    }

    a:hover {

    color:#f60;

    text-decoration:underline;

    }

    a:focus {

    outline: none; /* remove the dotted outline added by Firefox */

    }

    a:active {

    color:#fc9;

    cursor:wait;

    }

    a:link {color: #090;}

    a:visited {color: #999;}

    a:hover {color: #333;}

    a:focus {color: #333;}

    a:active {color: #090;}

    Order matters. If "a:active" precedes "a:hover", the effects in "a:hover" will take precedence. So, in this example, you would not see the color change when the user clicks down on a link.

    Pseudo Classes

    You can set links contained in different parts of your web page to be different colors by using the pseudo class. For example, lets say you want your links in the content area to have a different color then the links in the left or right column of your webpage.

    You can do this in the following fashion:

    #pseudo_content a:link {color: #090;}

    #pseudo_content a:visited {color: #999;}

    #pseudo_content a:hover {color: #333;}

    #pseudo_content a:focus {color: #333;}

    #pseudo_content a:active {color: #090;}

    Now assuming that you have your main content in a division named "content" all links within that division will now be styled by this new style selector. Should your selector have a different name, just change the #pseudo_content selector to match your division name.

    Then for the links in a column you could use the following:

    #pseudo_column a:link {color: #090;}

    #pseudo_column a:visited {color: #999;}

    #pseudo_column a:hover {color: #333;}

    #pseudo_column a:focus {color: #333;}

    #pseudo_column a:active {color: #090;}

    Once again, this assumes the name of the column division, just change the name to match yours.

    This same method can be accomplished by declaring a class instead of an id.

    a.pseudo_column:link {color: #090;}

    a.pseudo_column:visited {color: #999;}

    a.pseudo_column:hover {color: #333;}

    a.pseudo_column:focus {color: #333;}

    a.pseudo_column:active {color: #090;}

    Though in this case you will need to add a class to each link

    <a class="pseudo_column" href="" title="">some link text</a>

    But, there is still yet an easier way

    .pseudo_column a:link {color: #090;}

    .pseudo_column a:visited {color: #999;}

    .pseudo_column a:hover {color: #333;}

    .pseudo_column a:focus {color: #333;}

    .pseudo_column a:active {color: #090;}

    Then in the (X)HTML file

    <div class="pseudo_column">

    <a href="" title="Link Description">Link Text Description</a>

    </div>

    Ron

  • 5 years ago

    I have not got any concept if this might actual paintings having in no way had the ought to attempt it, yet you need to attempt; your_selector{ demonstrate:inline-block; width:1px; top:1px; overflow:seen } the greater advantageous option may well be to apply Jquery.

Still have questions? Get your answers by asking now.