Try CSS of OO

Oo css attempt: Object-oriented style sheet practice

Artist andProgramPersonnel cooperation? My answer is that CSS based on such rules
Because of the structure comparison rules, you can use fixed taglib to generate a table
However, the artist and the programmer need a web programmer who is familiar with CSS/scritpt.

I have previously thought of using an object-oriented method for CSS. The main design ideas are as follows:

For a certain type of table, the system will certainly appear multiple times,
For example, for displaying news and announcements.
Therefore, this table is summarized as a CSS, and these different CSS have some commonalities.
Code:
Sampletable.css
. Sampletable {
}

Sampletable2.css
. Sampletable2 {
}

For example, the header and data row have the same elements.
Therefore, a CSS template is implemented through the CSS property inheritance technique.
Code:

. Sampletable1 {
}
. Sampletable1 tbody. Text {
}

. Sampletable2 {
}
. Sampletable2 tbody. Text {
}

Why is it oo CSS?

This CSS draws on some oo ideas, including inheritance, abstraction, and polymorphism.

Inheritance means that the CSS class inherits the attributes of the parent class, such as. Table tbody
Abstract: Abstract A descriptive name based on actual functions, such as. Text.

During application, the above. Table. Label. menu can be considered as an interface.
Different CSS implements the same interface. Such as. Table1. Table2, there should be. Label. ment

A <Table class = "Table1"> can be considered as an object of the. Table1 interface,
Right? This object may also be an object of table 2,
But they all implement the. Table interface.

The implementation of table on different interfaces is the polymorphism in OO.

So what are the benefits of doing so?
First, you get a clean table with no redundant color format information.
Second, this table is rule-based and can be automatically generated using templates such as taglib.
Third, it is very easy to replace a class. You only need to change one of them and do not need to modify elements such as TD.
Fourth, better organize CSS and divide CSS into multiple files by color or function

Code located: http://icecloud.51.net

Now I only implement version 0.12 of a table
Interested friends may wish to come together to do this OO-CSS project:>

Copyright Disclaimer: This article is completed the author reserves the Chinese copyright. it shall not be used for any commercial purposes without permission. you are welcome to reprint this article, but please keep the Article and the copyright statement intact. If you need to contact us, please send an email: icecloud () sina.com blog: The http://icecloud.51.net