Web 技术研究所

我一直坚信着,Web 将会成为未来应用程序的主流

STYLE元素的scoped属性 局部CSS选择器

  一直以来,文档上的STYLE元素通常都是作用域全局的,选择器按照全局的CSS优先规则来设置的。要实现局部的选择需要先选到容器元素,再用后代选择器来实现。scoped属性可以让STYLE元素不再作用于全局,而从当前STYLE元素所在的容器开始选择后代。
  比如下面这个测试(请使用Firefox) <div>
  <style scoped>
    span {color:red;}
  </style>
  <span>我是第1个DIV内的SPAN</span>
</div>
<div>
  <style scoped>
    span {color:green;}
  </style>
  <span>我是第2个DIV内的SPAN</span>
</div>
<div>
  <span>我是第3个DIV内的SPAN</span>
</div>

  目前仅在Firefox上测试通过,其效果等同于 <div id="div1">
  <style>
    #div1 span {color:red;}
  </style>
  <span>我是第1个DIV内的SPAN</span>
</div>
<div id="div2">
  <style>
    #div2 span {color:green;}
  </style>
  <span>我是第2个DIV内的SPAN</span>
</div>
<di>
  <span>我是第3个DIV内的SPAN</span>
</div>
网名:
54.144.24.*
电子邮箱:
仅用于接收通知
提交 悄悄的告诉你,Ctrl+Enter 可以提交哦
神奇海螺
[查看全部主题]
各类Web技术问题讨论区
发起新主题
本模块采用即时聊天邮件通知的模式
让钛合金F5成为历史吧!
次碳酸钴的技术博客,文章原创,转载请保留原文链接 ^_^