I have an issue that I need help resolving. (Full Version)

All Forums >> [Web Development] >> Cascading Style Sheets



Message


johnanthonygroup -> I have an issue that I need help resolving. (5/29/2003 13:42:01)

I have an issue that I need help resolving.

I’m using shared borders that are navy blue and the links are light blue. I’ve created a page that I’ve linked these pages to (i.e.: get background information from another page) that reflect those choices.

In the body of the page (which is white), I’d prefer to have the links the standard blue link color. All of the content of the page is in a table.

Can I create a cascading style sheet that only impact the links in the table, which is on my page and not the shared borders?




bobby -> RE: I have an issue that I need help resolving. (5/29/2003 14:00:55)

In a CSS you can define multiple classes for tags... then you just declare the class in the tag itself... you can set your <a> tag to use one color, then <a class=" ork" > to use another...

example:

a:link {    text-align: center;
            font-size: 14px;
            color: #cc3300;
            font-weight: normal;
            text-decoration: underline}
a:visited { text-align: center;
            font-size: 14px;
            color: #cc3300;
            font-weight: normal;
            text-decoration: underline}
a:hover { text-align: center;
          font-size: 14px;
          color: #ffffff;
          background-color: #6b9689;
          font-weight: normal;
          text-decoration: none}
a:active {  text-align: center;
            font-size: 14px;
            color: #cc3300;
            font-weight: normal;
            text-decoration: underline}

a.white:link {text-align: center;
            font-size: 14px;
            color: #ffffff;
            font-weight: normal;
            text-decoration: underline}
a.white:visited {text-align: center;
            font-size: 14px;
            color: #ffffff;
            font-weight: normal;
            text-decoration: underline}
a.white:hover {text-align: center;
          font-size: 14px;
          color: #6b9689;
          background-color: #ffffff;
          font-weight: normal;
          text-decoration: none}
a.white:active {text-align: center;
            font-size: 14px;
            color: #ffffff;
            font-weight: normal;
            text-decoration: underline}


The first is a style declaration for <a> the second for <a class=" white" >




pageoneresults -> RE: I have an issue that I need help resolving. (5/29/2003 18:02:17)

Hey bobby, you posted a perfect example for me to show you how to use the Cascade to optimize your CSS. You' ll come to rely on the Cascade as it will be of great benefit in keeping your CSS files lean and mean. Here is the above code optimized and utilizing the Cascade. This code does validate with the W3C and shows no errors or warnings!

a {
text-align: center;
font-size: 14px;
font-weight: normal;
text-decoration: underline;
}

a:link, a:visited, a:active {
color: #c30;
background: transparent;
}

a:hover {
color: #fff;
background: #6b9689;
text-decoration: none;
}

a.white:link, a.white:visited, a.white:active {
color: #fff;
background: transparent;
}

a.white:hover {
color: #6b9689;
background: #fff;
text-decoration: none
}

Here is a working example of [url=" http://www.csstips.com/cascade/" ]Bobby' s Optimized CSS[/url] using the Cascade.




Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
4.589844E-02