3 Replies Latest reply on Mar 17, 2010 11:47 AM by Nancy OShea

    multiple link styles

    mtllc2011

      How do I set up multiple link styles in Dreamweaver? I set up the overall links in the page properties. When I try to edit a link color, it does not show up. I found some tutorials and wrote separate class links, but can't seem to get them to work. Is the a:link over riding them? I'm using CSS within the document. help. m.

        • 1. Re: multiple link styles
          prosad Level 1

          you can help the site www.w3schools.com for the help of CSS.

          • 2. Re: multiple link styles
            ExtendStudio

            The easiest way would be to put the text in a <Span></Span> and style it with clases or IDs.

             

            I should look like this:

            <a href=""><span class="text">text goes here</span></a>

             

            If in doubt please show us some code

             

            Cristian Dorobantescu

            www.extendstudio.com

            • 3. Re: multiple link styles
              Nancy OShea Adobe Community Professional & MVP

              Let's say you want one set of links in your #mainContent and a different set in your #footer.  Simply define a set of Pseudo-classes for your div IDs like so.

               

              /**MAIN LINKS**/

              #mainContent a {text-decoration:none}

              #mainContent a:link {color:red}

              #mainContent a:visited {color:gray}

              #mainContent a:hover,

              #mainContent a:active,

              #mainContent a:focus {color:green}

               

              /**FOOTER LINKS**/

              #footer a {text-decoration:none}

              #footer a:link {color:white}

              #footer a:visited {color:yellow}

              #footer a:hover,

              #footer a:active,

              #footer a:focus {color:orange}

               

               

              HTML:

              <div id="mainContent>

              <a href="some-link.html">this is a main content link</a>

              </div>


              <div id="footer">

              <a href="some-link.html">this is a footer link</a>

              </div>


              HTML & CSS Tutorials - http://w3schools.com/

               

              Nancy O.
              Alt-Web Design & Publishing
              Web | Graphics | Print | Media  Specialists
              http://alt-web.com/
              http://twitter.com/altweb
              http://alt-web.blogspot.com