第三次学习 CSS基础
体验CSS
CSS定义：层叠样式表，用来HTML文档的呈现（美化内容）不可以嵌套
书写位置：title标签下方添加style双标签，style标签里面书写CSS代码
**<title>CSS初体验</title>**
<style>
**P{**
/*选择器{}\*/ **color: red** /\*CSS属性\*/
**}**
</style>
<p>体验</p>
CSS引入方式
1.内部样式表：学习使用
CSS代码写在style标签里面
2.外部样式表：开发使用
CSS代码写在单独的CSS文件中（.css）
在HTML文件中使用link标签引入（title标签下方）
代码：
3. 行内样式：配合JavaScript使用
CSS写在标签的style属性值里
<div style="CSS属性">这是div标签</div>
选择器-标签、类、id和通配符
作用：查找标签设置样式
1. 标签选择器
作用：使用标签名作为选择器
特点：选中同名标签设置相同样式但无法差异化同名标签的样式
代码：见CSS初体验
2. 类选择器
作用：查找标签，差异设置标签的显示效果
特点：一个类选择器可以给多个标签使用，一个标签可以使用多个类名之间用空格隔开，类名尽量用英文见名知义。
代码：①定义类选择器→.类名 ②使用类选择器→标签添加class=“类名”
<style> .red{ color: red}</style>
<div class=“red”>这是一个div标签</div>
3.id选择器
作用：差异化设置标签的显示效果，但一般配合JSS很少用来设置CSS样式
特点：同一个id名只能在页面使用一次
代码：①定义id选择器→#id名 ②使用id选择器→标签添加id=“id名”
4.通配符选择器
作用：查找页面所有标签，设置相同样式，但通常用于清楚标签的默认样式
代码：不需要调用，浏览器自动找全部标签设置样式
*{ color：red}
选择器-画盒子
属性：width 宽度 height 高度 background-color 背景色
字体修饰属性
1.font-size 字体大小
属性值：30px；（单位必须要有 谷歌浏览器文字默认大小PX）px是相对单位
2.font-weight 字体粗细
属性值：数字（400/700）/英文关键字（normal bold）；
3.font-style 字体倾斜：
属性值：normal/italic（清楚默认的倾斜效果，如em标签）
4.line-height 行高
属性值：数字px/数字（当前属性的倍数）
注意：行高=文字高度＋上下间距
场景：使用行高实现垂直居中：行高属性值等于盒子高度属性值
5.font-family 字体样式（字体族）
属性值：字体名（多个字体名用逗号隔开从左往右依次查找）
6.font 复合属性
使用场景：设置网页文字公共样式
注意：字号和字体值必须书写否则font属性不生效
7.text-indent 文本缩进
属性值：数字+px/数字+em（1em等于当前字体的大小）推荐
8.text-align 对齐方式
属性值：left左对齐（默认）/center居中对齐/right右对齐
注意：对齐的是文字而不是标签
将图片居中可以把img放进父级标签里如div标签
9.text-decoration 修饰线
属性值：none/underline下划线/line-through删除线/overline上划线
10.color 文字颜色
属性值：颜色英文单词/rgb表示/rgba表示（0<a<1表示透明度）/十六进制表示
