1、了解html标签
html标签的结构：
开始标签<body>
</body>结束表
2、常用的html标签
div：盒子标签；
h1-h6:标题标签；
p:段落标签；
img：图片标签；
input：输入框标签；
button：按钮标签；
ul:无序列表
li：列表描述
<ul>
<li><li>
<li><li>
</ul>
dl:定义标签
dt、dd：定义描述
<dl>
<dt><dt>
<dd><dd>
<dl>
3、常用的css样式
background-color：背景颜色；
color：字体颜色；
width：宽度；
height：高度；
line-height：行高；
text-aline：文本对齐方向；
background-image:背景图片
border-width：边框的宽度；
border-style：边框的样式；
border-color：边框的颜色；
border—radius：边框圆角
p:hover{color:blue}
//当鼠标移动到元素上时可以改变元素的css样式
4、css常用选择器
5.1 css元素选择器
p{}
5.2 class选择器
.test{}
5.3 id选择器
#two{}
//HTML
<p class=”one” id=”two”>hello world</p>
//css
//元素选择器
p{}
//class选择器
.test{}
//id选择器
#two{}
5.4伪类选择器
//p:hover
5、盒子模型
image.png
6.1元素居中：
margin-left：auto；
margin-right：auto；
//仅仅针对块元素有效
6.2盒子总宽度：width+padding+border
6.3margin和padding盒子距离
margin：10px；
//margin:上 右 下 左
margin：10px 20px
margin：上下左右
margin：10px 20px 30px
margin:上 左 右 下
margin：10px 20px 30px 40px
margin:上 右 下 左
padding：同理
