CSS属性选择器的四种格式
作者 佚名技术
来源 CSS技术
浏览
发布时间 2012-03-05
|
属性选择器（Attribute Selectors），或许你不应该对属性选择器感到陌生，从本质上说，id跟类选择器其实就是属性选择器，只不过是选择了id或者类的值（value）而已。 属性选择器的格式是元素后跟中括号，中括号内带属性，或者属性表达式（不知道描述是否正确，自创的词），比如h1[title], h1[title="Logo"]等，你可以从我下面的论述中看到4种具体形式。 1、简易属性选择器 只顾其名不顾其值，这是简易属性选择器的特点。 h1[class] {color: silver;}将会作用于任何带class的h1元素，不管class的值是什么。所以<h1 class="hoopla">Hello</h1>、<h1 class="severe">Serenity</h1>、<h1 class="fancy">Fooling</h1>的h1都会受到这条规则的影响。 当然，这个“属性”不仅仅是class或者id，可以是该元素所有合法属性，比如img的alt，这样img[alt]{css declarations here;}将会作用于任何带有alt属性的img元素。那么a[href][title] {font-weight: bold;}呢？聪明的你一定已经知道，这会作用于同时带href和title属性的a元素，比如<a href="http://www.webjx.com/" title="webjx Home">Webjx.Com</a>。 2、精确属性值选择器 id和类本质上就是精确属性值选择器，没错，h1#logo等于h1[id="logo"]。如前所述，我们不要局限于id或者class，我们可以使用任何属性！例如a[href="http://www.webjx.com/"][title="W3C Home"] {font-size: 200%;}将会作用于<a href="http://www.webjx.com/" title="webjx Home">Webjx.Com</a>。 3、部分属性值选择器 如其名，只要属性值部分匹配（这里的部分，实际上要匹配整个单词）就会作用于该元素。让我们来看个例子： <p class="urgent warning">When handling plutonium, care must be taken to avoid the formation of a critical mass.</p>p[class~="warning"] {font-weight: bold;} 和p[class~="urgent"] {font-weight: bold;}中任何一条都可以 |
凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢! |
你可能对下面的文章感兴趣
上一篇: WEB标准,Web前端开发工程师必备技术列表下一篇: 调整CSS类型的顺序改变链接翻滚
关于CSS属性选择器的四种格式的所有评论
