The role and precautions of object-oriented CSS_html/css_WEB-ITnose

1) The role of object-oriented CSS:

1.1) Enhance code reuse for maintenance;

1.2) Reduce the size of CSS;

1.3) Improve rendering efficiency;

1.4) Component library ideas and grid layout can be shared, reducing selectors and facilitating expansion.

2) Notes on object-oriented CSS:

2.1) Do not define child nodes directly, put the common declaration in the parent class;

2.2) Structure and skin Phase separation;

2.3) Separation of container and content;

2.4) Abstract reusable objects, build a component library, and find available elements in the component library to assemble the page;

2.5) Add a class to the object you want to extend rather than its parent node;

2.6) Objects should remain independent;

2.7) Avoid using ID selectors , the weight is too high and cannot be reused;

2.8) Avoid position-related styles;

2.9) Ensure the same weight of selectors;

2.10) Class names should be short, Clear, semantic, object-oriented CSS names do not affect HTML semantics.

Copyright Statement: This article is an original article by the blogger and may not be reproduced without the blogger's permission.