Two CSS'es for one page

nebagakidnebagakid
Posted:
in Mac Software edited January 2014
So, can i declare a CSS for a web page. then on the next line declare another, and the commands that are duplicated in both go for the second one?



like, Corp Inc has this CSS for a generic page on their site which is included in every header. But on some pages, they want to change some of the parts, but not everything, so they create a second more specific CSS document that has the same items as in the first one, but it just different (like different link colors and such)... Can the first one be used, and the second one comes in and is like, "No, it should be like this: " ?



Like, I know in CSS commands that the thing declared last has the most priority ... so what is the deal with that?

Comments

  • Reply 1 of 5
    nebagakidnebagakid Posts: 2,692member
    sweet, could I declare the elements I want changed in another external style sheet, and declare that second, so I can more dynamically change the site around?
  • Reply 2 of 5
    smirclesmircle Posts: 1,035member
    Quote:

    Originally posted by Nebagakid

    sweet, could I declare the elements I want changed in another external style sheet, and declare that second, so I can more dynamically change the site around?



    That's the idea of "cascading" in cascading style sheets .-)



    You can link as many style sheets as you see fit. The rules that decide which CSS-attribute is taken from which style-sheet are:

    1) the most specific wins. If you have a declaration like

    a.toplink { in the first CSS and

    a { in the second and

    <a class="toplink" , the first CSS command will be applied since it is more specific



    2) if two CSS commands with the same specificity collide, the second one wins



    3) if an attribute in the CSS link in the HTML document specifies a media type, all the CSS commands in the linked CSS document are applied only if the page is rendered on a fitting media. Example: media="screen" will not be used for printing.



    4) if an attribute in the CSS links in the HTML document specifies one CSS as default and a second one as alternative, the commands in the default CSS file will be used. On some browsers (notably firebird and mozilla), the user can switch to the alternative style sheet.
  • Reply 3 of 5
    nebagakidnebagakid Posts: 2,692member
    Cascading: The continuing flow of the quality message down to, not through, the next level of supervision until it reaches all workers. Same concept as "deploying."



    { GOOGLE: define: cascading } (I like google definition service)





    thanks!



    if anyone is interested.... http://dcohen.dyndns.org/~neb

    or

    http://cocaineinmotion.com/dcblog/
  • Reply 4 of 5
    ghost_user_nameghost_user_name Posts: 22,667member
    Nebagakid, I think you might find the W3Schools Online Web Tutorials useful. It has tutorials for practically every language used on the web, including CSS. In fact, your very question is answered here in it's introduction:



    Quote:

    Generally speaking we can say that all the styles will "cascade" into a new "virtual" Style Sheet by the following rules, where number four has the highest priority:



    1. Browser default

    2. External Style Sheet

    3. Internal Style Sheet (inside the <head> tag)

    4. Inline Style (inside HTML element)



    So, an inline style (inside an HTML element) has the highest priority, which means that it will override every style declared inside the <head> tag, in an external style sheet, and in a browser (a default value).



    HTH
Sign In or Register to comment.