css书写原则_html/css_WEB-ITnose

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

1.css选择符

css选择符的编写方式决定了浏览器必须执行的匹配次数,而某些类型的css选择符将会导致浏览器尝试更多匹配,因此开销比简单选择符更高。

ID选择符

这种类型的选择符简单且高效,用于匹配页面唯一的元素。#id {}

类选择符.className {}

类型选择符tagName {}

相邻兄弟选择符H1 + #toc {}

子选择符#toc > li {}

后代选择符#toc A {}

通配选择符 * {}

属性选择符 [href="#index"] {}

伪类和伪元素  A:hover {}

高效css选择符的关键

1)最右边优先

     事实上,css选择符是从右到左进行匹配的。

2)编写高效的css选择符

     避免使用通配规则:仅使用ID、类选择符

     不要限定ID选择符:ID选择符左边不用加任何其他选择符

     不要限定类选择符:不要用具体的标签来限定类选择符,而是根据实际情况对类名进行拓展。

     让规则越具体越好

     避免使用后代选择符

     避免使用标签做子选择符

     依靠继承

     仔细检查子选择符的用途

     

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
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!