A我学习到了什么？
1温习day01的知识点
盒子模型：
margin外边距，border边框，padding内框的直接画面调节
样式重置：开发环境中的默认值
如：*｛margin：0；padding：0；｝
水平居中：
margin-left:auto;
margin-right:auto;
仅限是块标签的水平居中
常用HTML语义化：
div：//块元素，
p：//段落,
h1~h6：标题,
img//图片项,
input//对话框,
a//链接,
button//按键
套标签：
ul：无序列表，
li：列表描述;
dl:定义段，
dt：定义描述，
dd定义称述
<ul>
<li></li>
</ul>
<dl>
<dt></dt>
<dd></dd>
</dl>
常用CSS的样式：
background-color：背景颜色；
background-image:背景图片；
color：颜色；
width：宽度；
herght：高度；
line-herght:行高；
text-aline：文本对齐方向；
border-width：边框宽度；
border-style:边框样式；
border-color:边框颜色；
p:hover{color:red;}光标移动到元素变色；
CSS常用选择器：
p{},元素选择器；
class选择器：.text{};
id:选择器；
伪选择器：p:hover；
重要选择器：！importinent；
//他们比较级的大小
//元素<class<id<!importinent
2拓展HTML标签的分类
块标签：特点是独占一行，设置宽高
div,h1~h6,p,ul,li,dl,dt,dd
默认样式【display:block;】
内联标签：特点是并排显示，不能设置宽高
不能设置margin-top,margin-bottom
如：a,span,em,strong
默认样式【display:inline;】
内联块:特点是并排显示，可以设置宽高
button,img,input
默认样式【display:inline-block;】
让内联元素和内联块元素水平居中
display:block;//以改变默认样式进行
margin-left:auto;
margin-right:auto;//仅限块标签
给父级加text-align:center//仅限内联块标签
3CSS选择器
分组选择器：
p,h4，~{background:gray}//可以设置标签属性的样式
后代选择器：
div>span{} //选取div所有子元素为span的标签
div span{} //选取div之后的所有span元素
//可以设置标签属性的样式
兄弟选择器:
div+p{}选取紧邻div之后的第一个兄弟元素//仅限下个元素指定的元素
//div+h3+p可以跳过指定
div~p{}选取紧邻div之后的所有兄弟元素
//可以设置标签属性的样式
伪类选择器：
div:hover{}//光标移动到改变
input:focus{}//光标聚焦到改变
//可以设置标签属性的样式
伪元素：
":before" 伪元素可以在元素的内容前面插入新内容
p:before{
content:''//可以不写，但是必写语句
}
":after" 伪元素可以在元素的内容之后插入新内容。
p:after{
content:''//可以不写，但是必写语句
}
//可以设置标签属性的样式
属性选择：
div[class='test']{}
//区分特定的标签以及文件
B我掌握到了什么
1温习day01的知识点
盒子模型：
margin外边距，border边框，padding内框的直接画面调节
样式重置：开发环境中的默认值
如：*｛margin：0；padding：0；｝
水平居中：
margin-left:auto;
margin-right:auto;
仅限是块标签的水平居中
常用HTML语义化：
div：//块元素，
p：//段落,
h1~h6：标题,
img//图片项,
input//对话框,
a//链接,
button//按键
套标签：
ul：无序列表，
li：列表描述;
dl:定义段，
dt：定义描述，
dd定义称述
<ul>
<li></li>
</ul>
<dl>
<dt></dt>
<dd></dd>
</dl>
常用CSS的样式：
background-color：背景颜色；
background-image:背景图片；
color：颜色；
width：宽度；
herght：高度；
line-herght:行高；
text-aline：文本对齐方向；
border-width：边框宽度；
border-style:边框样式；
border-color:边框颜色；
p:hover{color:red;}光标移动到元素变色；
CSS常用选择器：
p{},元素选择器；
class选择器：.text{};
id:选择器；
伪选择器：p:hover；
重要选择器：！importinent；
2拓展HTML标签的分类
块标签：特点是独占一行，设置宽高
div,h1~h6,p,ul,li,dl,dt,dd
默认样式【display:block;】
内联标签：特点是并排显示，不能设置宽高
不能设置margin-top,margin-bottom
如：a,span,em,strong
默认样式【display:inline;】
内联块:特点是并排显示，可以设置宽高
button,img,input
默认样式【display:inline-block;】
让内联元素和内联块元素水平居中
display:block;//以改变默认样式进行
margin-left:auto;
margin-right:auto;//仅限块标签
给父级加text-align:center//仅限内联块标签
3CSS选择器
分组选择器：
p,h4，~{background:gray}//可以设置标签属性的样式
后代选择器：
div>span{} //选取div所有子元素为span的标签
div span{} //选取div之后的所有span元素
伪类选择器：
div:hover{}//光标移动到改变
input:focus{}//光标聚焦到改变
//可以设置标签属性的样式
伪元素：
":before" 伪元素可以在元素的内容前面插入新内容
p:before{
content:''//可以不写，但是必写语句
}
":after" 伪元素可以在元素的内容之后插入新内容。
p:after{
content:''//可以不写，但是必写语句
}
//可以设置标签属性的样式
属性选择：
div[class='test']{}
//区分特定的标签以及文件
C我没有掌握的
兄弟选择器:
div+p{}选取紧邻div之后的第一个兄弟元素//仅限下个元素指定的元素
//div+h3+p可以跳过指定
div~p{}选取紧邻div之后的所有兄弟元素
//可以设置标签属性的样式
兄弟选择器，后代选择器还是不怎么熟练，可能要多接触
QQ图片20170913194942.jpg
QQ图片20170913193305.png
