一篇文章，带你详细了解CSS基础知识
目录
一、CSS样式表
二、CSS样式规则
1.选择器
二、引入CSS样式表
1.行内式引入CSS
2.内嵌式引入CSS样式
3.链入式引入CSS
三、CSS基础选择器
1.标记选择器
2.类选择器
3.id选择器
4.通配符选择器
四、CSS文本外观属性
1.color
（1）预定义的颜色：
（2）采用十六进制定义
（3）RGB代码
2.letter-spacing
3.word-spacing
4.line-height
5.text-align
6.text-transform
7.text-decoration
实例：
实现效果：
8.text-indent
9.white-space
五、CSS列表标记
1.无序列表
注意：
实例：
实现结果：
2.有序列表
实例：
实现结果：
3.定义列表
实例：
实现效果：
4.列表嵌套的应用
实例：
六、CSS字体设置
1.font-size
2.font-famiy
3.font-weight
编辑
4.font-variant
5.font-style
七、用CSS控制列表样式
1.实例代码
实现效果：
八、超链接
1.语法
2.实例
实现效果
3.锚点连接
4.连接伪类控制超链接
5.超链接伪类
注意：
九、表格与表单
1.创建表格
（1）
（2）
（3）
2.table标签属性
（1）border
（2）cellspacing
（3）cellpadding
实现效果:
3.tr标签属性
（1）height
（2）align
（3）bgcolor
（4）background
（5）valig
（6）bgcolor
4.td标签属性
5.th标签
十、表单
1.作用
2.组成
（1）提示信息
（2）表单域
（3）表单控件
3.创建表单
（1）action
（2）method
（3）GET请求
（4）POST请求
（5）name
4.input控件
（1）单行文本输入框，单选按钮，复选框，按钮等。
单行文本输入框
密码框
（2）单选
（3）多选框
（4）按钮
（5）图片按钮
（6）文件上传按钮
（7）value
5.textarea控件
6.select控件
select和option标签的属性
7.分组
基本语法格式
十一、CSS控制表单样式
1.CSS中控制背景色和图片
（1）设置外边距
（2）设置内边距
（3）设置鼠标
一、CSS样式表
在html页面中，可以让页面美观，大方，且升级轻松、维护方便，还可以实现结构与显示分离
二、CSS样式规则
1.选择器
用于指定CSS样式作用的HTML对象，花括号内是对该对象的显示样式。
选择器{属性1：属性值1；属性2：属性值2；属性3：属性值3......属性n：属性值n}
属性值和属性值之间使用“键值对”的方式出现，用英文“.“连接，多个键值之间使用英文“；”区分。
优点：使用灵活，可以对同一个标签做不同的设置CSS样式
缺点：在同一个标签中，不能统一格式。
color设置显示颜色
font-size：设置显示字体大小
text-align：设置文本对齐方式
intitle：搜索内容，可以精确匹配搜索内容
在CSS中，/* */用来注释内容
二、引入CSS样式表
1.行内式引入CSS
行内式通常也被称为内联式，是通过标签的style属性来设置元素的样式，语法格式：
<标签名 style="属性1：属性1：属性值1；属性2：属性值2；......属性n：属性值n">
内容
优点：使用灵活，可以对通哟个标签做不同的设置CSS样式
缺点：在同一个标签中，不能统一格式
2.内嵌式引入CSS样式
将CSS代码集中写在HTML文档中，这个CSS样式代码在
头部标签中，并且使用3.链入式引入CSS
链入式就是将所有的样式放在一个或者多个以上以.css为扩展名的外部样式表文件中，通过文件引入HTML文档中，基本语法格式：
如果CSS文件和HTML文档不在同一个盘符下，使用fil:///绝对路径
三、CSS基础选择器
1.标记选择器
是指用HTML的标签作为选择器使用，按照标签名称分类，为页面的某一类标签指定统一的CSS样式。
标签名{属性1：属性值1；属性2：属性值2；....；属性n：属性值n}2.类选择器
使用英文符号“.“进行表示，后面紧跟类名，基本语法格式：
.类名{属性1：属性值1；属性2：属性值2；....；属性n：属性值n}为某个一个标签添加范围属性的CSS
标签名.类名{属性1：属性值1；属性2：属性值2；....；属性n：属性值n}为某个类添加范围属性的CSS
.类名1.类名2{属性1：属性值1；属性2：属性值2；....；属性n：属性值n}只在先引入类1的范围内引入类2有效
3.id选择器
id选择器通常用#进行表示，后面紧跟id名，其基本语法格式：
id名{属性1：属性值1；属性2：属性值2；....；属性n：属性值n}用一下方式可以实现CSS作用范围控制
#id名 #id名02{属性1：属性值1；属性2：属性值2；....；属性n：属性值n}
#id名 .类名{属性1：属性值1；属性2：属性值2；....；属性n：属性值n}4.通配符选择器
通常使用*来进行表示，它的作用范围是整个HTML页面中的所有元素，基本语法格式
*{属性1：属性值1；属性2：属性值2；....；属性n：属性值n}四、CSS文本外观属性
1.color
此属性用于定义文本颜色，其取值方式有三种：
（1）预定义的颜色：
red,yellow,blue等
（2）采用十六进制定义
#FFF6600，在实际工作中，常用的就是十六进制
（3）RGB代码
红色：rgb(255,0,0)
2.letter-spacing
用于定义字间距，就是字符与字符之间的空白，其属性值可以为不同的单位数值，允许为负数，默认为normal，正数是增加艰巨，负数是减少间距。
3.word-spacing
用于定义英文单词之间的间距，对中文字符无效，取值方式与上面的letter-spacing一样
.p1{
color:red;
letter-spacing: 70px;
}
.p2{
color: blue;
word-spacing: 70px;
}4.line-height
用于设置行间距，其属性值有3种单位，分别是px,em,%
5.text-align
设置文本内容水平对齐方式，相当于html中的align对齐属性
left
right
center
6.text-transform
可以控制英文字符大小写，其属性值如下：
none：不转换
capitalize：首字母大写
uppercase：全部字符转换为大写
lowercase：全部字符转换为小写
7.text-decoration
控制文本的下划线，属性值如下：
none：没有装饰，默认值
underline：下划线
overline：上划线
line-through：删除线
实例：
.p3{
line-height: 25px;
text-align: center;
color:blue;
font-size: 15px;
letter-spacing: 25px;
}
.p4{
text-align: center; /*居中显示*/
text-transform:capitalize ; /*首字母大写*/
text-decoration: underline; /*下划线*/
}
.p5{
text-align: right; /*居右显示*/
text-transform:uppercase ; /*字母大写*/
text-decoration: overline; /*上划线*/
}
.p6{
text-align: right; /*居右显示*/
text-transform:uppercase ; /*字母大写*/
text-decoration: line-through; /*删除线*/
}
}
hello world
hello world
hello world