13
Nov
没听说过的CSS优先级
<div id="oo">
<div id="xx" class="room"></div>
</div>
CSS优先级早已烂记于心,那么就来见识下几道题目
div#xx {float:left}
#xx {float:right}
#xx左边还是右边?
#oo div {float:left}
#xx {float:right}
#xx左边还是右边?
#oo #xx {float:right}
div#oo div{float:left}
#xx左边还是右边?
#oo div {float:left}
.room{float:right}
#xx左边还是右边?
#oo .room{float:left}
#xx {float:right}
#xx左边还是右边?
#xx.room{float:left}
#oo div {float:right}
#xx左边还是右边?
div#oo .room{float:left}
#xx.room{float:right}
#xx左边还是右边?
答案统一起见,好像都是右边
哦,不对,和大部分男人一样,偏左边
仅以此文献给所有奋斗在前端的炮灰们
<!-- 明城同学拿出小抄本(CSS2.1 的优先权图示)分享之 -->
假装异步加载ing
订阅大猫的RSS feed,不错过一部AV~




右手
Reply
BigCat:
@fisio,
身边问了一圈,都是左边...
Reply
Reply
Reply
BigCat:
@yuki,
同疼ing
Reply
PS:今天去了下那个什么戴记好农庄,根本就是革命[痒痒]杀群众的地方。。又贵又难吃。。
Reply
BigCat:
@yuki,
而且吃的人又多是不是
Reply
为广大淫民提供 CSS 优先权小抄一份,以后相关的 CSS 心中做个简单的加减法即可
http://www.gracecode.com/Archive/Display/1523
Reply
BigCat:
@明城,
抠手指头ing
原来对那篇文章的理解不够充分....还以为id优先级就比class高...
Reply
第一个 0,1,0,1(won) 0,1,0,0
第二个 0,1,0,1(won) 0,1,0,0
第三个 0,2,0,0(won) 0,1,0,2
第四个 0,1,0,1(won) 0,0,1,0
第五个 0,1,1,0(won) 0,1,0,0
第六个 0,1,1,0(won) 0,1,0,1
第七个 0,1,1,0 0,1,1,0(won)
第七个我感觉应该这样吧
Reply
胡戈戈:
第七个现在修正为0,1,1,1(won) 0,1,1,0
Reply
BigCat:
@[痒痒]戈戈,
多亏了你呀~来拍拍脑袋
Reply
不懂不懂
Reply
BigCat:
@blankyao,
每天被折磨
Reply
关键在于如何理解css的顺序,div#xx这样的是相关选择符,#xx是独立的,so最后定义的优先级高。
Reply
BigCat:
@阿企, 在优先级相等的情况下才会后来居上
div#xx优先级要比#xx高....
Reply
长见识了,我一直认为定义越详细优先级越高
Reply
BigCat:
@geuro,
网站大了后这种问题越来越突出...
Reply
跟男人一样偏向于左边~~
Reply
BigCat:
@Elton Disney, 兄台难道也左边?
Reply
Elton Disney:
@BigCat, 呀,这都被你发现了~~
一定要灭口
Reply
银魂上说,向右偏的是能成大事的人。。。
Reply
BigCat:
@zing, 果如其然
那人抢了沙发
Reply
呵呵。深刻学习了。
Reply
zylew:
@打工皇帝, 还没被解脱出来?
Reply
不是很懂
Reply
不懂不懂
Reply
不错的文章啊!很多时候自己也很晕,基本的优先权知道,但是叠加到一起有时还是有点晕!
Reply
BigCat:
@舞命小丢,
点头... 经常受到高权重的CSS影响....灰常崩溃
Reply
这回你火星了。。。gracecode的博客我也经常看
Reply
bigCat:
@vampire,
是啊,最早遇到的时候偶还郁闷来着
明白了后更郁闷了...因为老样式都是高优先级写法...
Reply
Reply
飞鱼:
@葉子, 这个问题 太复杂··
Reply
BigCat:
@飞鱼,
站大了什么CSS都有...
Reply
葉子:
@葉子, 我怎么觉得我原来有留言在这里的,应该是左边左边
Reply
Reply
bigCat:
@葉子, - - 这事儿能猜的挖
Reply
葉子:
@bigCat, 先猜迷后答题
Reply
#oo #xx {float:right}
div#oo div{float:left}
这个应该是#oo #xx优先级高于div#oo div
所以不都是偏左...
把两个的float调换一下就能保持偏左了...
Reply