加入收藏 | 设为首页 | 会员中心 | 我要投稿 河北网 (https://www.hebeiwang.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 创业 > 正文

必要把握的30个最常用css选择器理会

发布时间:2018-10-07 06:09:39 所属栏目:创业 来源:站长网
导读:你大概已经把握了id、class、靠山选择器这些根基的css选择器。但这远远不是css的所有。下面向各人体系的理会css中30个最常用的选择器,包罗我们最头痛的赏识器兼容性题目。把握了它们,才气真正明确css的庞大机动性。 1. 星状选择符会在页面上的每一个元素

你大概已经把握了id、class、靠山选择器这些根基的css选择器。但这远远不是css的所有。下面向各人体系的理会css中30个最常用的选择器,包罗我们最头痛的赏识器兼容性题目。把握了它们,才气真正明确css的庞大机动性。

1. 星状选择符会在页面上的每一个元素上起浸染。web计划者常常用它将页面中全部元素的margin和padding配置为0。

*选择符也可以在子选择器中行使。

上面的代码中会应用于id为container元素的全部子元素中。

除非须要,我不提议在页面中过的的行使星状选择符,由于他的浸染域太大,相等耗赏识器资源。

兼容赏识器:IE6+、Firefox、Chrome、Safari、Opera

2. #X

井号浸染域有响应id的元素。id是我们最常用的css选择器之一。id选择器的上风是精准,高优先级(优先级基数为100,远高于class的10),作为javascript剧本钩子的不二选择,同样弱点也很明明优先级过高,重用性差,以是在行使id选择器前,我们最好问下本身,真的到了非用id选择器的境地?

兼容赏识器:IE6+、Firefox、Chrome、Safari、Opera

3.  .X

.error {
     color: red;
   }

这是一个class(类)选择器。class选择器与id选择器的差异是class选择器能浸染于祈望样式化的一组元素。

兼容赏识器:IE6+、Firefox、Chrome、Safari、Opera

4. X Y

li a {
     text-decoration: none;
   }

这也是我们最常用的一种选择器——儿女选择器。用于选取X元素下子元素Y,要寄望的点是,这种方法的选择器将选取其下全部匹配的子元素,无视层级,以是有的环境是不宜行使的,好比上述的代码去掉li下的全部a的下划线,但li内里尚有个ul,我不但愿ul下的li的a去掉下划线。行使从此代选择器的时辰要思量是否但愿某样式对全部子孙元素都起浸染。这种儿女选择器尚有个浸染,就是建设相同定名空间的浸染。好比上述代码样式的浸染域明明为li。

兼容赏识器:IE6+、Firefox、Chrome、Safari、Opera

(编辑:河北网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    热点阅读