一、今日学习内容一、CSS字体属性
1.字体的外观
字体外观用font-family定义，如：font-family：“Mcirosoft YaHei”, Arial,sans-serif
font-family有多个属性的意义：有些浏览器对字体的识别能力可能有问题，写了多个字体外观可以在浏览器进行识别时优先显示浏览器可识别的第一种字体
注意：
各种字体要用英文的逗号隔开
多个单词组成的字体要用引号引起来
尽量使用默认字体，保证在任何浏览器都可以显示
Unicode字体
在CSS中设置的字体文件编码不匹配的情况下会出现乱码的情况，可以用unicode编码来避免乱码的出现，unicode编码要用引号引起来
2.字体大小
字体外观用font-size定义
谷歌浏览器的默认字体大小为16px,可显示的最小字号为12px,12px以下的都默认显示12px
不同浏览器的默认大小可能不同，尽量给一个明确的字体大小，不要用默认的大小
一般在<body></body>标签中设置整个页面的字体大小
3.文字样式
字体风格用font-style来设置
属性值
normal:默认值，浏览器会显示标准文字样式
italic:浏览器会显示斜体的文字样式
注意：很少给文字添加斜体样式，一般多为用normal将斜体标签（em/i）改为正常样式
4.字体粗细
使用font-weight设置文本粗细
属性值为数值，此处不加像素值
一般多用400和700两个数值，400代表正常粗细，700为加粗文本
5.字体的复合属性
字体的复合属性用font:font-style font-weight font-size/line-height font-family按顺序书写，各个属性之间用空格隔开
使用font属性时，font-size和font-family属性不可以省略，font-style和font-weight可以省略，省略时系统会选择默认值进行设置
二、CSS的文本属性
1.文本颜色
使用color设置文本颜色
设置方法
选择预定颜色进行设置：red、green等
十六进制表示：#ff0000
RGB代码设置:如rgb（255,0,0）
2.文本对齐
用text-align设置文本水平对齐
属性值
right:靠右对齐
left:靠左对齐（默认值——）
center:居中对齐
3.文本装饰
用text-decoration进行文本装饰
属性值
none:没有装饰线，常用于给a标签去掉下划线
underline:下划线
overline：上划线
line-through：删除线
4.文本缩进
css中使用text-indent设置文本缩进
属性值
固定像素单位，如80px,可以给定指定单位但是不够灵活，数值一般是正值
相对单位：如：1em，即缩进当前元素大小的1倍，如果当前元素没有设置大小，会按照父元素的字体大小进行设置
行间距用line-height设置行间距
行间距=上间距+文字高度+下间距，其中上下间距相等
行间距的值可以是像素值也可以是倍数，一般在body标签中设置
5.文本换行
用white-space设置文本换行
属性值
nowrap：到边界处不换行
normal：到边界处自动换行，为默认值
三、CSS的引入方式
1.行内样式表
直接在元素内部写一个style属性，将设定的属性值写在等号之后，并用引号引起来，不同属性用分号隔开
注意：在双引号中书写时要符合css的写作规范，在开发中并不常用
2.内部样式表
内部样式表是写在html叶念内部的，在<head></head>标签的<style></style>标签中
注意：通过这种方式可以实现页面中的结构样式，但是没有实现结构和样式的分离，练习时常用内部样式表
3.外部样式表
外部样式表是实际开发中常用的，核心是将css代码单独放到css文件中，再将css文件引入到html文件中进行使用
步骤
先创建一个css文件，在css文件中写入css代码
在html页面使用<link>标签一如css文件
可以通过引入一个css文件来引入多个css文件：@import url(需引入的文件地址）
四、Emmet语法
这个语法可以帮助我们使用缩写提高html\css的速度
常用语法
输入标签名+tab
快速生成多个标签名，如：p*5
生成父子级标签名：div>p
生成兄弟级标签名：div+p
快速生成带有id属性和id属性值的标签：#frist
用自增符号$来实现类名的区分，如：div.demo$*5
在生成标签时直接写入内容：div{内容}*5
使用首字母缩写快速布全元素：tac→text-align:center
二、今日问题 无
|
