CSS 样式的语法如下:
选择器 { 属性:设定值; ... }
在一个选择器 (Selector) 中,可以设定的属性数目没有限制。
选择器主要有三种:型类 (Type) 选择器、Class 选择器、和 ID 选择器。
型类选择器是 (X)HTML 标识,如 <body> 和 <h1>。Class 和 ID 选择器是使用者自订的选择器。我们会在之后讨论这两类的选择器。
样式是以『属性:设定值』的方式来制定。举例来说,若我们要设定一个元素内的文字是黄色的,那就用以下的『属性:设定值』:
color:yellow;
在以上的css语法内,color 是属性,而 yellow 是设定值。
在某些时候,一个属性可能会有好几个设定值。这些通常都是因为属性是一个捷径。举例来说,margin 属性可能会有 4 个设定值,而每一个值代表每一边的边界长度。
Grouping
如果有数个选择器享有同样的样式,它们可以同时被渲染。这叫做 "grouping"。举例来说,如果 <h1>, <h2>, and <h3> 都会有相同的样式,那它们就可以用以下的方式被渲染:
h1 h2 h3 { 属性:设定值; ... }
子选择器 (Descendant Selectors)
我们可以设定说,只有当甲元素在乙元素之内时,甲元素才会用某个样式。若甲元素不在乙元素内的话,那甲元素就可以有其他的样式。要达到这个目标,我们就要利用子选择器的方式。
子选择器宣告的语法是:
【父选择器】【子选择器】{ 属性:设定值; ... }
在以上的语法中,只有当子选择器是在父选择器之内时,样式才会被用到。这一类的语法可以包括好几个子选择器,而不是只有两个子选择器而已。
举例来说,以下的语法,
li b { color:yellow; }
代表在 <li> <b> 之内的文字是黄色的。不是在 <li> 之内的 <b> 中的文字,就不会套用黄色字体这个样式。
感觉本站内容不错,读后有收获?小额赞助,鼓励网站分享出更好的教程