「CSS」文本编排相关的CSS属性设置

本文深入讲解了CSS中用于控制文本样式的各项属性,包括字体族、大小、加粗、斜体、行高、颜色、对齐方式、首行缩进、文本修饰、字符间距和字间距等。通过具体实例展示了如何设置这些属性来美化网页文本。

1、font-family:设置字体族。

格式为font-family:字体1,字体2,……,通用字体族|inherit。 

通用字体族,是指一类相似的字体。W3C的CSS规则规定,要指定一个通用字体族,避免客户端没有安装指定字体时能使用本机上的通用字体族中的字体。该属性及其值的涵义如下图

与文本编排有关的CSS属性设置

 

2、font-size:设置文本的大小。该属性及其值的涵义如下图

与文本编排有关的CSS属性设置

 

3、font-weight:设置文本加粗。该属性及其值的涵义如下图

与文本编排有关的CSS属性设置

 

4、font-style:可设置字体是正常还是斜体。该属性及其值的涵义如下图

与文本编排有关的CSS属性设置

 

5、line-height:设置文本的行高,它是指上下文本行的基线之间的垂直距离。其属性及其值的涵义如下图

与文本编排有关的CSS属性设置

 

6、字体属性font:是字体设置的简写形式,其格式及解释如下:

与文本编排有关的CSS属性设置

 

其中,用[]括住的属性是可选的,而font-size和font-family是必须要写的两个属性,其他属性若不写,则网页将使用它们对应的默认值。另外,font-size/line-height必须用/组成一个,不能分开写。例如:

与文本编排有关的CSS属性设置

这段CSS设置了字号为12像素,2倍行距,字体族为arial 和arial black。

7、字体颜色color属性:

与文本编排有关的CSS属性设置

 

8、text-align属性:设置文本的水平对齐方式。其值有三,分别是左对齐left(默认)、居中对齐center、右对齐right。

9、首行缩进属性text-indent:其属性值及涵义见下图。

与文本编排有关的CSS属性设置

 

10、文本修饰属性text-decoration:用来设置文本是否带有下划线或删划线等,其值及涵义如下图:

与文本编排有关的CSS属性设置

 

11、字符间距属性letter-spacing:设置字符与字符之间的间隔,正值是拉宽字符间距,负值是缩小字符间距。其值及涵义如下图:

与文本编排有关的CSS属性设置

 

12、字间距属性word-spacing:设置单词与单词之间的间隔。该属性对包含两个词以上的英文有作用,对汉字是没有作用的。

与文本编排有关的CSS属性设置

 

例如,定义一种文本样式,其字体族为“黑体,宋体,新宋体”,字体粗细为500,斜体,大小16像素,行距26像素,红色,带下划线,则代码应写成下图所示:

与文本编排有关的CSS属性设置

转载于:https://www.cnblogs.com/wrxblog/p/9768697.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值