一、CSS常见基础
①-选择器：
1、子选择器：这行代码会使class名为food下的子元素li 加入红色实线边框。用于选择指定标签元素的第一代子元素
.food>li{border:1px solid red;}
2、包含(后代)选择器：即加入空格,用于选择指定标签元素下的后辈元素.
与子选择器的区别在于：>作用于元素的第一代后代，空格作用于元素的所有后代。
例如下面代码，包含选择器会在food下的所有li标签加上1px的红色实线，不管是food下li标签中的li标签，只要是在food中的li。而子选择器只是作用于在food下的第一代li，如果是food下li标签中的li标签则不会被添加样式、、、
.food li{border:1px solid red;}
3、伪类选择符：
a:link {color: #FF0000} / 未访问时的状态 /
a:visited {color: #00FF00} / 已访问过的状态 /
a:hover {color: #FF00FF} / 鼠标移动到链接上时的状态 /
a:active {color: #0000FF} / 鼠标按下去时的状态 （很少定义）/
4、分组选择符：当为html中多个标签元素设置同一个样式时，可以使用分组选择符（，），如下代码为右侧代码编辑器中的h1、span标签同时设置字体颜色为红色：
h1,span{color:red;}
②-CSS文字排版：
1、使用css样式来改变文字的样式：粗体、斜体、下划线、删除线：
为P标签下的span设置粗体：p span{font-weight:bold}
为P标签下的span设置斜体：p span{font-style:italic;}
为P标签下的span设下划线：p span{text-decoration:underline;}
为class名为oldPrice的部分设置删除线：.oldPrice{text-decoration:line-through;}
2、其他：
文本缩进：p{text-indent:2em;}
设置字母与字母之间的间距：h1{letter-spacing:20px;}
设置英文单词之间的间距：h1{word-spacing:50px;}
行间距（行高）：p{line-height:1.5em;}
块状元素中的文本、图片设置居中样式:h1{text-align:center}//中-左-右-：center-left-right
③-盒子模型：
1、元素分类：
常用的块状元素有：
、、...、
、
、
、
、、
、