IT兄弟连 HTML5教程 CSS3揭秘 CSS常见的样式属性和值1

IT兄弟连 HTML5教程 CSS3揭秘 CSS常见的样式属性和值1

CSS中的样式属性比较多,经常使用的属性可以分为这么几类:字体、文本、背景、位置、边框、列表,以及其他一些样式属性。每个类中的属性都可以单独使用;如果同一个类中多个属性一起使用,还可以将它们整合为一行解决。

1  字体属性

通过字体属性可以设置字体的族科,改变字体的大小和风格,也可以调整字体加粗,以及让字体变形等。修饰字体的所有属性、值及描述如表6-1所示。

表1  CSS中修饰字体的属性

IT兄弟连 HTML5教程 CSS3揭秘 CSS常见的样式属性和值1

 分别使用表1中字体类的每个样式属性,指定HTML的段落元素p中的字体为bold(粗体)、italic(斜体)、Times或serif字体、12点大小。代码如下所示:

IT兄弟连 HTML5教程 CSS3揭秘 CSS常见的样式属性和值1

本例中使用字体类中的多个属性设定段落中字体的样式,我们可以将其简化为使用一行代码解决。通过字体类中的font属性就可以做到,语法格式如下所示:

font: [ <字体风格> || <字体变形> || <字体加粗> ]? <字体大小> [ / <行高> ]? <字体族科>

字体属性font用作不同字体属性的略写,特别是行高。允许值都是可选的,如果有多个属性值,它们之间使用空格分开。例如,可以将上例代码改写为:

p { font: italic bold 12px/14px Times,serif }         /*  所有字体属性一行解决 */

指定该段为bold(粗体)和italic(斜体)Times或serif字体,12像素大小,行高为14像素,和前面分别设定字体属性及值效果相同。

2  颜色属性

颜色属性允许网页制作者指定一个元素的颜色,在CSS中可以使用color属性设定文本的颜色。为了避免与用户样式表之间的冲突,背景和颜色属性应该始终一起指定。一些颜色规则的例子如下:

IT兄弟连 HTML5教程 CSS3揭秘 CSS常见的样式属性和值1