扫一扫
分享文章到微信
扫一扫
关注官方公众号
至顶头条
作者:builder.com.cn 2007年4月6日
关键字:
ID
类选择器可以让你风格化一组或一类元素,但是你还可以更具体的风格化页面中的元素。页面中的每个元素都有一个ID属性,这个ID在整个页面中是唯一的。ID可用于诸如JavaScript等脚本语言对于元素的操作,它还可以用于样式风格化。
当为一个特定的元素ID定义样式时,需要在样式定义中在ID前面添加数字符和(#)。这样来告诉系统只有拥有该ID的元素才可以应用这个样式。需要注意的是,因为ID号都是唯一的,所以样式可能仅使用一次,如列表F中的例子所示。(在本文的后面,我们将介绍样式也可以通过元素的属性使用)。
在这种情况下,ID作为一个属性可以看到并被风格化,但是ID选择器总是比其它的属性选择器优先。在使用ID选择器风格化页面上的某个特定元素的同时,你还以通过页面内元素的上下文来定位任何风格化的元素。
祖先
CSS使得通过页面内元素间的关系风格化元素变得很简单。利用祖先选择器,你可以定位文档树之内的元素,它还可以让你选择直接或间接来自另一个元素的子孙元素。
例如,你可能想以某种方式风格化div元素内包含的有序列表。使用祖先选择器,你可以为页面内通过空格分开的元素指定一个路径。列表G中的例子只在粗体元素出现在段落元素之内时,才对它进行风格化。
孩子
孩子选择器与祖先选择器关系十分紧密,但是当你寻找的是具有直接祖先或子孙关系的元素时,它们会很明确。孩子选择器通过列出双亲元素来定义,孩子元素通过大于号隔开(>)。Windows IE浏览器5 ,5.5和6都不支持孩子选择器,但是他们被绝大部分符合标准的其它浏览器支持。列表H中的例子模仿前面的例子使用了孩子选择器与祖先选择器作对比。
列表H
<html>
<head><title>CSS 鈥" Type selectors</title>
<style type="text/css">
p {font-face: arial; font-size: 110%; color: red; background: yellow;}
p > b {margin: 0; font-size: 200%; color: black; font-weight: normal; }
</style><body>
<h1>Test Page</h1>
<p>Hey there.</p>
<p><b>are</b> the items.</p>
</body></html>
责任编辑:德东
如果您非常迫切的想了解IT领域最新产品与技术信息,那么订阅至顶网技术邮件将是您的最佳途径之一。
现场直击|2021世界人工智能大会
直击5G创新地带,就在2021MWC上海
5G已至 转型当时——服务提供商如何把握转型的绝佳时机
寻找自己的Flag
华为开发者大会2020(Cloud)- 科技行者