Home > Web Front-end > HTML Tutorial > css writing principles_html/css_WEB-ITnose

css writing principles_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:33:43
Original
1056 people have browsed it

1.css selector

The way the css selector is written determines the number of matches the browser must perform, and certain types of css selectors will cause the browser to try more matches , so the overhead is higher than simple selectors.

ID selector

This type of selector is simple and efficient and is used to match unique elements on the page. #id {}

Class selector.className {}

Type selector tagName {}

Adjacent sibling selector H1 #toc {}

Child selector #toc > li {}

Descendant selector #toc A {}

Wildcard selector* {}

Attribute selector [href= "#index"] {}

Pseudo classes and pseudo elements A:hover {}

The key to efficient css selectors

1) Rightmost priority

In fact, CSS selectors are matched from right to left.

2) Write efficient css selectors

Avoid using wildcard rules: only use ID and class selectors

Do not limit ID selectors: do not use the left side of the ID selector Add any other selectors

Do not qualify the class selector: Do not qualify the class selector with a specific label, but expand the class name according to the actual situation.

Make the rules as specific as possible

Avoid using descendant selectors

Avoid using tags as child selectors

Rely on inheritance

Double check the purpose of the sub-selectors

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template