开发者

How to restore CSS style to its super class

If I've overridden a CSS root style to:

body .dijitTitlePane .dijitTitlePaneTextNode {
    color: #FFFFFF;
    font-family: Verdan开发者_运维技巧a, arial;
    font-size: small;
    font-weight: bold;
}

now I want to use the original .dijitTitlePane .dijitTitlePaneTextNode CSS style, is there a "super" class definition I can use here? Thanks,

David


Try:

html body .dijitTitlePane .dijitTitlePaneTextNode {
    color: #FFFFFF;
    font-family: Verdana, arial;
    font-size: small;
    font-weight: bold;
}

Another alternative, if you don't care about IE6 support: you can put !important on whatever style you want to override everything else.

.dijitTitlePane .dijitTitlePaneTextNode {
     font-size: small !important;
}


You can use `inherit for the style you need:

body .dijitTitlePane .dijitTitlePaneTextNode {
     color: #FFFFFF;
     font-family: Verdana, arial;
     font-size: small;
     font-weight: inherit;
}

Here, font-weight will use the "super" style.

EDIT: After the style is defined there is no way to get at the "super" value. However, you can override the overriden value again in the page element:

<body class="dijitTitlePane" style="font-weight: normal">

CSS doesn't provide a reverting mechanism. The only way for a root style to cascade to a child style is for the child to leave it undefined or defined as inherit.


You may need to clarify why you are re-assigning styles to the same classes.

You don't typically want to rewrite style declarations for the same class names. Instead add/remove additional classes to the objects you want to over-ride.

So, your default:

<div class="standardStyle"></div>

To over-ride, you can do something like this:

<div class="standardStyle additionalOverrideStyle"></div>

Then, when done, remove it.


No!

The use of the terms "super class" and "inerhitance" and "overriding" in this question demonstrates' most developers misconception of CSS, as they try to think of it as a programming language or even an Object Oriented Programming Language, with the so-called "CSS Class" doubling as an OOP Class.

This is a fundamental misunderstanding of what CSS is for, which causes developers to try and make their CSS too general for its own good.

It's important to remember that graphic designers would be the primary stakeholder in mind for the creators of CSS, not developers. Graphic designers have no notion of the the founding principles of object oriented programming - polymorphism, inheritance and encapsulation - which are intuitive for developers. Even the use of variables is a programmer-specific thing - hence why CSS doesn't have variables!

So, instead of thinking about it all in terms of inheritance, learn about specificity.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜