一、今日学习内容
CSS：（cascading style sheet）是层叠样式表,也是一种标记语言，可以给html书写出来的网页，设置不同样式
1、CSS语法规范：
h1{color:red;font-size:14px}
h1：选择器 color：属性 red：属性值
语法样式属性：1、是雍裕之定CSS样式的html标签，{}里面是对该选择器设置的具体样式
2、属性和属性值是以“键值对”的形式出现
3、属性是一种特定的样式属性，例如：字体颜色，字体大小
4、属性和属性值之间用英文“:”：隔开
5、多个“键值对”之间要用英文“;”隔开
样式一写在head表签中的style属性里面
2、CSS基础选择器：
2.1、标签选择器（元素选择器）：是指用html属性作为属性器，来对页面符合条件一类的标签来指定统一CSS样式
语法：div{color:red;}
优点：快速进行一类标签样式设置
缺点：不能差异化设置
2.2、类选择器：
差异化选择不同的标签可以选择类选择器
语法注意点：1）类选择器使用英文的“.”来定义，后面要跟类名
2）长类型用“-”连起来
3）不要使用出数字、中文来进行命名，要用英文来命名
4）类的命名要用意义，让他人容易理解，类名的目的
多类名：1、在class属性中可以多命名调用
2、多类名之间用空格隔开
3、调用完后就会显示所有被调用类名所声明的样式
2.3、ID选择器：唯一的标识，所以ID选择器是为了唯一的id的html元素来指定特定的样式
ID选择器用“#”来定义，用ID来进行调用
2.4、ID和类选择器：
1）类选择器好比姓名，可以多个使用
2）ID选择器，好比身份证，唯一性
3）ID一个ID明在一个页面只会用一次，类选择器可以使用多次
4）类选择器修改样式中使用，频率最高，ID选择器具有唯一性，搭配JS使用
2.5、通配符选择器：
1）CSS中使用“*”来表示，标示选取页面所有元素
2）不需要进行调用，可以直接给所有的样式设置样式，相当设置一个默认样式
3、CSS字体属性：
3.1、font-family：设置字体样式；
各个字体之间必须用英文“,”，隔开
一般情况下会使用默认的字体，保证可以再浏览器中正确显示
字体名字有空格没需要用“”将字体名字引起来
字体也可以使用Unicode编码选择
例：{font-family："microsoft yahei",Arial, Helvetica, sans-serif;}
arial：宋体 Helvetica：西文体
3.2、font-size:字体大小
一般设置字体的单位“px”，谷歌浏览器默认的大小“16px”
可以给body中指定文字样式大小，来改变整体页面字体的大小
不同的浏览器可能默认显示字体大小不一致，所以尽量设置一个明确的字体大小
3.3、font-style：字体样式风格
italic：字体倾斜
normal：浏览器默认值，浏览器显示标准字体样式
注意：平时很少个文字添加倾斜字体，反而更多的是将斜体标签（em/i）改为不倾斜的
3.4、font-weight：设置字体的粗细
常用数值：正常字体：400 加粗字体：700
注意：数值后面不加像素单位
3.4、字体的复合属性：将多个样式来进行综合书写，可以使代码更精简（常用）
语法格式：{font: font-style font-weight font-size/line-height font-family}
用font属性是必须按照语法格式中属性值的顺序来进行书写，不可以调换顺序，各个属性之间用空格开
可以忽略的值：font-style和font-weight
不可省略：line-height设置行高和字体样式
1、直接设置像素值
2、设置倍数（为字体倍数，整数、小数都可以）
4、CSS文本属性：
4.1、color：文本颜色 1、英文代表 2、16进制代表（#000000） 3、RGB表示（rgb(123,16,54)）
4.2、text-align：文本对齐方式 left，center，right
4.3、text-decoration：装饰文本：1、none：主要用在给a标签取消下划线 2、下划线：underline 3、删除线：line-through（删除价格样式） 4、上划线：overline
4.4、text-indent：缩进值，固定缩进：对文本第一行进行缩进，
1、固定像素值，不够灵活
2、2em：缩进当前2个文本值 em是一个相对单位，就是当前元素的文字的大小，所以需要缩进两个font-size时，则将font-size的值写位2em
4.5、line-height：属性用于设值行间的距离（行高） 像素、倍数
5、CSS的三中引用方式：
5.1、行内样式表（行内式）：在元素标签内部的style属性中来设置CSS样式，适合简单的样式修改
1、要符合CSS样式规范 2、样式写在style属性中，用双引号引起来 3、书写繁琐，没有实现结构样式分离
5.2、内部样式表（嵌入式）：写在html页面内部，将所有CSS样式写到style标签中
1、也没有实现结构样式分离 2、练习时可以使用
5.4、外部样式表（链接式）：表示实际开发中常用的方式，创建css文件放入所需要的样式，然后再html文件中引入文件即可
引入外部样式表的步骤：
1、创建后缀名为.CSS的文件样式
2、在HTML文件中使用link标签来进行引入
link标签：
rel：定义当前文档与被链接文档的关系，这里直接写成stylesheet即可，表示被链接的文档是一个样式表文件
href：链接路径
整合多个外部样式表集中导入：
1、样式1 2、样式2 3、集中样式 4.导入
emmet语法：1、输入标签名按tab键来进行直接补全
2、一次生成多个标签，(标签*n)可以直接生成n个当前标签
3、父子级；例：div>p
4、兄弟级；例：div+p
5、生成带id属性标签；例：p#two
6,、生成带类名的标签；例：p.blue
7、可以用$来实现自增，例：p.demo$*n来实现
8、使用{}来实现标签内写内容；例：div{文本}*n
9、快速生成CSS代码；例：tac生成：text-align:center
二、今日问题
三、解决方案
|
