Web前端开发笔记-----7.css文字样式，css段落样式，css复合样式

一、css文字样式

1.字体类型

font-family：字体类型
英文字体：Arial 中文字体：微软雅黑

衬线体与非衬线体

注意事项：
1.设置多字体方式
网页中一般设置多字体，以防止用户计算机中无该字体。
查看计算机中字体：
控制面板：

2.引号的问题

字体中有空格的需要用引号引起来。

2.字体样式

font-size：字体大小

默认是16px
写法：number（px），单词（small，large。。不推荐）

注：字体大小一般用偶数。

font-weight：字体粗细

写法：
1.number（100，200…900）100-500：正常，600-900：加粗
2.单词：normal，bold（加粗）

font-style：字体样式

写法：单词 normal，italic斜体
注：oblique也是斜体，用的比较少，一般了解即可。
区别：
1.italic 带有倾斜属性字体的才可以设置倾斜操作。
2.oblique 没有倾斜属性的字体也可以设置倾斜操作。
但最好将具有倾斜属性的文字设置为倾斜字体。

color：字体颜色

colol：white / #ffffff / rbg(255,255,255);

二、css段落样式

text-decoration：文本装饰

下划线：underline
删除线：line-through
上划线：overline
不添加任何装饰：none

注：可以添加多个文本修饰（通过逗号隔开）

text-transform：文本大小写（针对英文段落）

小写：lowercase
大写：uppercase
只针对首字母大写：capitalize

text-indent：文本缩进（首行缩进）

方法：numbe（px，em）
em单位：相对单位，1em永远都是跟字体大小相同。
text-indent：2em； 永远缩进两个汉字。

text-align：文本对齐方式
left，center，right，justify（两端点对齐）

line-height:定义行高

什么是行高：

默认行高不是固定值，而是根据当前字体大小变化而变化
取值：1.number（px） 2.scale（比例值，跟文字大小成比例）

letter-spacing：定义字间距，word-spacing：定义词间距（针对英文）

英文和数字不自动折行问题：
1.word-spacing：break-all（非常强烈的折行）
2.word-spacing：break-word（不是那么强烈的折行，会产生一些空白区域）

三、css复合样式

单一样式：一个css属性只控制一种样式
复合样式：一个css属性控制多种样式 如：backgroud，border，font
复合的写法:通过空格的方式实现
1.backgrou：red url() repeat 0 0;
2.border：1px red solid；
注：有的是不需要关心属性顺序（background，border）
有的需要注意顺序（font）
3.font：weight style size family；
注：
1.最少要有两个值size family；
2.weight和style可互换顺序
3.font：weight style size/line-height family；√

最后：尽量不要混写，如果非要混写，那么一定要先写复合样式再写单一样式，这样样式才不会被覆盖掉。

如：

border-color: red;
border: 2px solid;
此时颜色属性不会实现。