css教程(1):css语法详解

2017年02月25日 12:51 | 226次浏览 | 分类: css教程

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> 中的文字,就不会套用黄色字体这个样式。



感觉本站内容不错,读后有收获?小额赞助,鼓励网站分享出更好的教程


上一篇:
^