|
|
CSS存在三种Selector. 它们分别是HTML selector、class selector、ID selector，它们之间有怎样的区别与联系呢，这里分别介绍一下：
&<60;
HTML selector
HTML selector 就是 HTML 的 tags, 比如 P, DIV, TD 等. 如你用 CSS 定义了它们, 在整页中, 这个 Tag 的性质就按照你的定义来显示了.
HTML selector 的语法如下:tag {property:value}
比如我们想让H1 的颜色是红的则定义: H1 {color: red}
这里还要告诉你 CSS 的一个特点, 它可定义好几个selector在一个rule里. 比如 H1,H2,TD{color: red}这个定义就能让所有的 H1,H2和TD的颜色都为红色。
Class selector
Class selector 有两种:
一种叫html tag相关 class selector, 它跟一个 HTML 的 tag 有关系.
它的语法是tag.Classname {property:value}
比如我们想让一些而不是全部H1的颜色是红的,则定义:H1.redone {color: red} 这样在下面的语句中,第一个 H1 是红色的, 而第二个就不是了
<H1 class="redone">红色的题目</H1>
<H1>普通的题目</H1>
第二种是独立 class selector . 它可被任何 HTML tag 所应用. 它的语法如下 .Classname {property:value}
假如我们有下面这个定义.blueone {color: blue} 那么我们可以把他应用到不同的 Tag 当中去. 比如:
<H1 class="blueone">蓝色的题目</H1>
<P class="blueone">蓝色的段落</P>
显然 class selector 给了我们更多的自由。
&<60;
ID selector
ID selector 其实跟独立 class selector 的功能一样. 而区别在于它们的语法和用法不同, 以及对于 Javascript 操纵HTML元素有帮助.
它的语法如下:
#IDname {property:value}
假如我们有下面的定义#yelowone {color: yellow} 我们可以运用这个定义到有同样 ID 名字的 tag, 比如:
<SPAN ID="yellowone">text here</SPAN>
你可能觉得既然 ID selector和独立class selector功能一样, 为什么两者都存在呢. 如果你知道用 CSS-P 来定位的话, 你就明白它们的区别了. 有 ID 的 HTML 元素可以被 CSS-P和 JavaScript 来操纵。 |
|
IP卡
狗仔卡
发表于 2008-5-16 16:15:41
QQ好友和群
QQ空间
腾讯微博
腾讯朋友
收藏
转播
分享
淘帖
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
显身卡
