扫码关注公众号

CSS校招考点之选择器优先级
08-15
341观看
01

对css的基础选择器中的类选择器和id选择器,以下说法不正确的是()

正确答案是Bid选择器和类选择器的区别:1类选择器(class)好比人的名字,一个人可以有多个名字,同时一个名字也可以被多个人使用。2id选择器好比人的身份证号码,全中国是唯一的,不得重复。3类选择器在修改样式中用的最多,id选择器一般用于页面唯一性的元素上,经常和JavaScript搭配使用。4选择器优先级!important>内联样式>ID选择器>类选择器=属性选择器=伪类选择器>标签选择器=伪元素选择器>通配符>继承>浏览器默认属性而答案B中应该放到类选择器而不是id选择器

来自:CSS、CSS3-选择器和优先级
02

对CSS选择器不同级别的执行优先级的描述,不正确的是()

正确答案是B不同级别在属性后面使用!important会覆盖页面内任何位置定义的元素样式。作为style属性写在元素内的样式id选择器类选择器元素选择器通配符选择器浏览器自定义或继承总结排序:!important>行内样式>ID选择器>类选择器>元素选择器>通配符选择器>继承>浏览器默认属性A选项因为!impotant级别太高,特别是存在多个!important样式时,对问题的跟踪和维护都有影响可以把id选择器作为一个分割点,前面两个级别高的比较特殊,比较好理解记忆。B选择把行内样式的优先级描述错误

来自:CSS、CSS3-选择器和优先级
03

对同一级别选择器,执行优先级的描述,不正确的是()

正确答案是D同一级别的优先级比较不好理解,可以使用离DOM元素越近越高的思路记忆。建议实现一下样式更方便理解。同一级别(1)同一级别中后写的会覆盖先写的样式(2)同一级别css引入方式不同,优先级不同总结排序:内联(行内)样式>内部样式表>外部样式表>导入样式(@import)。答案D应该是内部比外部高

来自:CSS、CSS3-选择器和优先级
04

对CSS的复杂选择器优先级,描述不正确的是()

正确答案是C后代选择器的优先级比较复杂,也是大厂前端的常考点,可以拿#Content.name.titleaspan举例总结优先级如下:1、id个数多的优先级高#box.headspan{color:blue;}.box.headspan{color:red;}<br>//下面span标签的颜色是蓝色的  <divclass="box"id="box">    <divclass="head">      <span>我的颜色</span>    </div>  </div>2id个数相等的看class个数,class越多优先级越高3id和class个数相等,看元素个数,个数越多优先级越高4优先级相同,后面的样式会覆盖前面的样式,不分先后顺序,只看选择器类型和个数A选项是常识,可以理解是多样式权值加分更高C选项少了元素个数的比较,只有元素个数也相同,即优先级相同的情况下,才跟基础选择器规则一致,后大于前

来自:CSS、CSS3-选择器和优先级
05

以下解决CSS样式冲突的方法,不正确的是()

正确答案是B这是一道考察实战能力和优先级基础的试题。一般遇到样式表现错误的情况,都需要从右到左,从近到远的按属性排查。四个选项都是常用的定位冲突的方法。选项B的错误在于同级别样式后面大于前端

来自:CSS、CSS3-选择器和优先级
课程
专栏
js语言和框架-CSS、CSS3-选择器和优先级
4专栏
1课程
5 试题