CSS（Cascading Style Sheme）， 层叠样式表或级联样式表，简称样式表。它的作用是给HTML网页设置外观或者样式。其中外观或者样式指的是：HTML网页中的文字大小、颜色、字体，网页的背景颜色、背景图片等。
CSS代码是由选择器和一对花括号组成， 即：选择器：{语句1;语句2;…}花括号里面是一条一条的声明语句组成每一条语句都要使用英文状态下的分号隔开每一条声明语句，是由“属性：值”组成。CSS中的属性值一般不加 引号“ ”CSS中如果属性值为数值型数据，一般情况下需要加单位，一般是px在CSS中不能出现HTML标签
嵌入式：
什么是嵌入式？
将CSS代码嵌入到HTML文件中，嵌入式是通过HTML中的标签将css代码嵌入到HTML网页中。语法规则：
如果我们使用的是HTML5的文档，type属性可以省略不写。
注意：style标签可以放在HTML文件的任何位置，但是一般放在head标签里面。
—— 外链式：
什么是外链式？
外链式是指单独写一个。css为扩展名的文件，然后在head标签中使用标签，将这个css文件链接到HTML文件中。这个css文件在命名时要使用英文，不能使用中文命名。注意：css文件不能单独的运行，必须依赖于HTML文件 基本语法格式：
如下为一个css文件的书写方式
呈现的效果就是，运行HTML文件，背景会变为浅蓝色
使用这种方法，一定要确保css文件已经被正确的成功引入！检测方法为：在当前HTML呈现的网页页面，右键单击检查，点击Network选项卡，然后刷新当前网页，查看network选项卡中的status状态，如果是成功的就表示文件被加载，如果是失败状态就表示文件没有被加载，失败的原因可能是地址写错也可能是文件名写错，注意检查。link标签可以有多个，即一个HTML页面可以同时引入多个单独的css文件 行内式：
什么是行内式？
将css代码书写在HTML标签的style属性中。style属性是一个通用属性，每一个标签里面都拥有这个属性！语法格式为：
例如：
小结：
使用嵌入式的方式来书写css代码，只能作用于当前的HTML文件使用外链式的方式来书写css代码，可以作用于多个HTML文件
注释的格式：sublime中注释的快捷键：Ctrl + shift + /注意：千万不要在css中使用HTML注释，两种注释方式要区分开
基本选择器
选择器格式含义举例通用选择器*{属性：值;}通用选择器将匹配HTML所有标签。不建议使用，IE6不支持，给大型网站增加负担*{margin:0px;}标签选择器标签名{属性：值;}标签选择器，匹配对应的HTML标签p{font-size:14px;}类选择器。class属性值{属性：值;}类选择器，给拥有指定的class属性值的元素设置样式。box{width:800px;}Id选择器#Id属性值{属性：值;}Id选择器可以为标有特定Id的HTML元素指定特定的饿样式，只能使用一次，Id选择器以“#”来定义#title{font-size:14px;}
通用选择器（通配符选择器）举例：
标签选择器举例：
类选择器举例：
Id选择器举例：
复合元素选择器 （这三种选择器在后面详细展开）伪类选择器属性选择器
属性值含义Height＜/td>auto：自动，浏览器会自动计算高度；length：使用px定义高度；%：基于包含它的块级对象的百分比高度设置元素高度Width＜/td>同上设置元素的宽度
注意：span标签不可以设置宽度和高度，因为span标签是行内元素，它是不可以设置高度与宽度的，只有块级元素才可以设置高度和宽度！以上虽然设置了span的宽度与高度，但是并没有影响，span的高度与宽度是由它的内容来决定的。
1. 文本属性
属性名值含义color#ff000或red或rgb（3,5,8）给文本设置颜色text-alignleft（居左）、right（居右）、center（居中）设置文本的水平对齐方式text-decorationnone（去掉文本修饰线） 、underline（下划线）、overline（上划线）、line-through（删除线）设置文本修饰线text-transformcapitalize、uppercase、lowercase大小写转换或者首字母大写line-Height＜/td>固定值或百分比设置行高text-indentpx或em设置首行缩进，允许负值letter-spacingpx设置字符间距word-spacingpx设置单词间距
2.字体属性
属性名值功能font-stylenormal（正常） 、italic（斜体）设置文本为斜体font-weightnormal（正常）、 bold设置文字粗细font-size12px 14px（记得加单位）给文本设置大小font-family微软雅黑、楷体、宋体…给文本设置字体font举例：font:italic bold 14px “微软雅黑”简写属性，能够同时给文本设置斜体、加粗、大小、字体，每一个值之间需要使用空格，并且一定要有顺序。
关于字体：一般很特殊的字体，网站上面都是使用图片来表示的，是否能够显示此字体是根据用户电脑里面是否有对应得字体，如果没有该文件就会显示为宋体。
选择器含义举例选择器1，选择器2{属性：值;}多元素选择器多元素选择器，同时匹配选择器1和选择器2，多个选择器之间用逗号分隔p,h1,h2{margin:0px;}E F{属性：值;}后代元素选择器后代元素选择器，匹配所有属于E元素后代的F元素，E和F之间用空格隔开#slidebar p{font-color:#990000;}E>F{属性：值;}子元素选择器子元素选择器，匹配所有E元素的子元素Fdiv>p{color:#990000;}E+F{属性：值;}相邻元素选择器相邻元素选择器，匹配所有紧随E元素之后的同级元素Fdiv+div{color:#990000;}
多元素选择器：
后代元素选择器：
子元素选择器：
相邻元素选择器;
这里的列表指的是：无序列表和有序列表。整个网页布局中无序列表是使用的最多的。
属性值含义list-style-typenone（将列表前面的项目符号去掉），disc（实心圆），square（实心小方块），circle（空心圆）设置列表前项目符号的类型list-style-positioninside（在里面），outside（在外面）设置列表项标记的放置位置list-style-imageurl（图像路径）将图像设置为列表项标记list-stylesquare inside url（arrow.webp）在一个声明中设置所有列表属性
list-style:这个属性是一个简写属性，他集成了上面三个属性的功能，可以同时设置上面的三个属性。每一个属性值之间使用空格分隔！它的属性值个数可以有一、二或者三个。其属性值个数不定，位置也不定。
列表样式属性案例分析：
什么是伪类选择器？ 伪类选择器是给超级链接（a标签）的不同状态来设置样式。超级链接的不同状态：
正常状态：超级链接没有被访问 :link访问过后状态： 超级链接已经被访问 :visited鼠标放上状态：鼠标放在超级链接上面，但是并没有将鼠标的左键按下去 :hover激活状态： 鼠标左键已经按下去了，但是并没有将鼠标的左键弹出 :active 注意：伪类选择器都是带有冒号的":"，超级链接的不同状态是有顺序的，也就是说伪类选择器设置是有顺序的。如果不按照伪类选择器的顺序，那么样式将会失效。顺序：要遵守“爱恨准则” ，要先有爱才有恨， Love H ate
选择器含义：link向未被访问的链接添加样式：visited向已被访问的链接添加样式：hover当鼠标悬浮在元素上方时，向元素添加样式：active鼠标放在元素上面时，点击的一瞬间
超级链接的美化
通常会去掉超级链接的下划线，同时会给超级链接设置一个颜色。
一般情况下，正常状态与访问过后的状态的样式设置为一样。当鼠标放上的时候给其设置另外一个颜色，激活状态一般不会设置，因为激活状态时间太短。
格式：
a:link,a:visited{去掉超级链接的下划线，设置一个颜色}
a:hover{设置另外一个颜色，增加一个下划线}
|
