SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Member
    Join Date
    May 2002
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    creating more than one link style in CSS

    I'm creating a site which has a set of navigation links serving as a menu bar and a set of hyperlinks within the text, but they must be styled differently - fonts, colours, size....

    Whenever I try to create a new style for a second set of links in my document, it keeps defaulting to the settings for the first set of links I've done.

    How do I make multiple link styles in my stylesheets??


  2. #2
    Degrading Gracefully PalmerB's Avatar
    Join Date
    Sep 2001
    Location
    Ohio - U.S.A. Outlook: Cautiously Optimistic
    Posts
    3,283
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You'll need to use the class tag for the separate links...

    Code:
    <style type="text/css">
    .firstlinkstyle {
    		font-family : Arial,Helvetica;
    	font-style : normal;
    	font-weight : normal;
    	font-size : 8px;
    	color : #000066;
    	text-decoration : none;
    }
    
    .firstlinkstyle:hover {
    		font-family : Arial,Helvetica;
    	font-style : normal;
    	font-weight : normal;
    	font-size : 8px;
    	color : red;
    	text-decoration : none;
    }
    
    .secondlinkstyle {
    	font-family : Arial,Helvetica;
    	font-style : normal;
    	font-weight : normal;
    	font-size : 9px;
    	color : black;
    	text-decoration : none;
    }
    
    .secondlinkstyle:hover {
    	font-family : Arial,Helvetica;
    	font-style : normal;
    	font-weight : normal;
    	font-size : 9px;
    	color : #000066;
    	text-decoration : none;
    }
    </style>
    Then where you have the link in your html add the class attribute to that link...
    Code:
    <a class="firstlinkstyle" href="whatever.htm">Link One</a>
    
    <a class="secondlinkstyle" href="whatever.htm">Link Two</a>
    Good Luck,
    Palmer

  3. #3
    SitePoint Member
    Join Date
    May 2002
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks, i'll give it a try.....


    does this apply for both linked AND embedded stylesheets??

  4. #4
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by kellilicious
    thanks, i'll give it a try.....


    does this apply for both linked AND embedded stylesheets??
    Yep
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •