Kidney自得其乐版CSS教程 Chapter3 Text

Posted 2020-07-18

Chapter 3 Text

Version	Update	Note
1.0	2016-6-1	首次添加。欢迎在评论中指出错误，一经核实，立即修订，且注明贡献者。

 

 

 

 

 

文本
字体	颜色	排版	修饰	书写模式	其它

 

1、字体

1.1 font-style

       值：normal(默认)，italic，oblique

       italic是从字体中选择斜体样式，如果某种字体无斜体样式，则用oblique设置斜体。

1.2 font-variant

       值：normal，small-caps

       variant表示“变体”，用于将大写字母的尺寸变小。

1.3 font-weight

       值：关键字、数值（100，200 …… 900）

1.4 font-size

       值：关键字、长度值和百分比

1.5 font-family

       值：关键字

       可设置多个以逗号隔开的字体，字体名称中包含空格的需要用引号。

1.6 font

       上面五个属性+line-height属性的简写。

       必须按照上述顺序设置。

       font-size和font-family是必须的，其余是可选的。

       行距需与字体大小写在一起，用斜线隔开，font-size/line-height

2、color

       值：颜色值。

3、排版

3.1 line-height

       值：长度值、百分比和数字

3.2 vertical-align

       值：长度值、百分比和关键字

       用于设置行内元素在行框和表格内的垂直对齐方式。

       行框：又译行盒，指包含来自同一行的盒的矩形区域。

3.3 letter-spacing

       值：长度值、百分比。可为负。

3.4 white-space

       控制文本的空格和换行。

       空格是指编辑器里文本内部的空格。

       换行指的是在编辑器中敲的换行符与文本抵达容器边界的换行行为。

       pre表示预格式化，简单理解，就是编辑器中敲的换行符会在浏览器的显示中体现出来。

       normal(默认值)：忽略换行符。文本抵达边界会换行。空格会被合并。

       pre：保留换行符。文本抵达边界不换行。空格不会合并。

       nowrap：忽略换行符。文本抵达边界不换行。空格会被合并。

       pre-wrap：保留换行符。文本抵达边界会换行。空格不会合并。

       pre-line：保留换行符。文本抵达边界会换行。空格会合并。

3.5 word-spacing

       值：长度值、百分比。可为负。

3.6 text-align

       值：left、center、right

       设置文本水平对齐方式。

3.7 text-indent

       值：长度值、百分比

       设置首行缩进。允许负值。

3.8 text-overflow

       值：clip(默认)，ellipsis，string

       用于设置文本截尾的后缀。

       clip就是直接切掉，没有后缀；ellipsis会缀一个省略号；还可以用一个字符串作为后缀。

       注意：要想实现后缀，必须和white-space:nowrap、overflow:hidden合用。

3.9 text-wrap

       用于设置文本换行（折行）规则。

3.10 overflow-wrap

       原名word-wrap。用于设置文本换行（折行）规则。

4、修饰

4.1 text-decoration

       值：none，underline，overline，line-through，blink

       CSS3又增加了线条样式和颜色，于是该属性变成了简写属性，不过目前此语法还未得到广泛支持。

4.2 text-shadow

       值：offsetX，offsetY，blur，color

       可以设置多组用逗号隔开的阴影。

4.3 text-emphasis

       用于重点标记。目前浏览器支持还很差。

5、书写模式

5.1 derection

       值：ltr，rtl

       指定行内元素的排布方向、表格列布局的方向、水平溢出的方向等

5.2 unicode-bidi

       值：normal，embed，bidi-override

       与direction合用，控制文本书写的方向

5.3 writing-mode

       值：normal(默认)，horizontal-tb，vertical-rl，vertical-lr

6、其它

6.1 user-select

       规定文本是否可选。默认值text表示可选，如设为none则表示不可选。