一、css初步认识
- 通过标签来修改样式的缺点？
1)需要记忆哪些标签有哪些属性，如果该标签没有这个属性，那么设置了也没有效果
2）当需求变更时我们需要需改大量的代码才能满足闲又的需求
3）html只有一个作用就是用来添加语义的
所以在企业中开发修改样式都是交给css的 - 通过css来修改样式有什么好处？
1）不用记忆那些属性属于那些标签
2） 当需求变更时我们不需要修改大量的代码就可以满足需求
3）在前端开发中css只有一个作用，就是修改样式 - 格式：
<head>
<style type="text/css">
样式修改
标签名称{
属性名称：属性值；
……
}
</style>
</head>- 注意点：
1）style标签必须写在head标签的开始标签和结束标签之间（也就是必须和title时兄弟关系）
2）style标签中的type属性其实可以不用写，默认结束text/css
3）设置样式按照固定格式来设置。key：value;
注意：分号和解释号不能省略
二、css相关属性
2.1文字相关属性
- 规定文字样式的属性
格式:
font-style:normal;italic(斜体)/normal(正常);
快捷键:fsn+tab
- 规定文字粗细的属性
格式：font-weight:bold;
单词取值:bold加粗 bolder最粗 lighter细线--默认就是细线
快捷键：fw+tab
数值取值：数字100-900整百的数字； - 规定文字大小的属性
格式：font-size:30px;
单位：像素（px）
注意：必须带单位px
快捷键：fz+tab; - 规定文字字体的属性
格式;
font-family:"微软雅黑";- 取值：
楷体/微软雅黑/宋体
注意点：
1、如果是中文必须用双引号或者单引号
2、设置的字体必须是用户电脑类名已经安装的字体
2.2、字体补充
- 如果设置的字体不存在，那么系统会使用默认的字体来显示宋体
- 如果设置的字体不存在，而我们又不想默认的字体来显示怎么办？
-----可以给字体设置备选方案
格式font-family:"字体1，备选方案1…………" - 如果想给中文和英文单独设置字体，怎么办？
---但凡是中文字体，里面都包含了英文
---但凡是英文字体，里面都没有包含中文
也就是说中文字体可以处理英文字体，而英文字体不可以处理中文
注意点:日如果想给界面中的英文单独设置字体，那么英文的字体必须写在中文前面font-family:"Times New Roman","微软雅黑"；
补充企业开发最常见的字体：
1) 中文：黑体/微软雅黑/宋体
2）英文：“Times New Roman”/Arial
还需要知道一点，就是并不是名称是英文就一定是英文字体，因为中文字体其实都有自己的英文名称，所以看是不是英文字体就是看是否对中文有影响
三、简写
font:styleI(可省) weight size family;
注意：
1.在这中缩写格式s有的属性可以省略
- size和family不可以省略
3.size和family不可以交换 style和weight可以交换
4.size必须写在family前面，而且size和family必须写在所有属性的最后。
四、文本属性样式
1. 文本text装饰的属性direction
格式： text-direction:underline;
- 取值：
underline:下划线
line-through删除线
overline上划线
none：什么都没有 --超链接消除下划线
快捷键：td+tab tdu+tab tdl+tab tdo+tab
2.文本水平对齐属性
格式：text-align:right;
取值:right/left/center;
快捷键;tar+tab tac+tab tar+tab
3.文本缩进
格式：text-indent:2em
取值：2em，其中一个em代表缩进一个文字宽度 他是单位还可以像素但不好控制
快捷键：ti+tab
五、文字颜色设置
---在css中如何通过color属性来修改文字属性来修改文字颜色
格式：
color:值；-----取值：
1）英语单词：red/pink/blank/blue---一般情况下常见的颜色都有对应的英文单词，但是英文单词能够表达的颜色是有限的，也就是说不是所有颜色都能通过英文单词来表达的
2）rgb其实就是三原色 red green blue
电脑屏是用小格子组成每个小格子就是一个像素，光学显示器都是由发光原色（红绿蓝）组成
格式：
color:rbg(0,0,0);那么这个格式中
1）第一个就是用来设置三原色的光源原件红色显示的亮度
2）第二个就是用来设置三原色的光源原件绿色显示的亮度
3）第三个就是用来设置三原色的光源原件蓝色显示的亮度
eg
rgb(255,0,0)；红
rgb(0,255,0)；绿色
rgb（0，0，255）；蓝
rgb(0,0,0);黑色
rgb(255,255,255);白色
这其中的每一个数字它的取值是0-255，0代表不发光 255代表发光，值越大就越亮 开发过程中一般不用黑色
只要让红绿蓝以颜色一样就是灰色 值越大越浅rgb（9,9,9）
3)rgba
rgba中和rgb一样只是多了一个透明度a，那么这个a代表透明度，取值是0-1，取值越小越透明
rgb(255,0,0,0.5);
4)十六进制
color:#000000;
十六进制中是通过两位表示r一个颜色
eg:#FFEE00 FF---255表示R EE表示G 00--0表示B
转换程·rgb
十六进制--十进制
用十六进制的第一位*16+十六进制的第二位=十进制
5）十六进制缩写
color:#F00;
在css中十六进制每两位的值一样可以只写一个简写
注意：
1）如果当前颜色对应的两位数字不一样，那么不能简写
2）如果两位相同的数字不是属于同一个颜色，有=也不能简写
<wiz_tmp_tag id="wiz-table-range-border" contenteditable="false" style="display: none;">