1、滑动门结构代码？
<ul>
<li><a href="http://www.mamicode.com/#"><span>百度</span></a></li>
<li><a href="http://www.mamicode.com/#"><span>百度</span></a></li>
<li><a href="http://www.mamicode.com/#"><span>百度</span></a></li>
</ul>

2、滑动门样式？
li a{
height: 35px;
background: url("bg_r1_c1.png");
background-repeat: no-repeat;
display:inline-block;
padding-left: 7px;
}

li span{
height: 35px;
background: url("bg_r1_c2.png");
background-repeat: no-repeat;
display:inline-block;
background-position: right;
padding-right: 26px;
line-height: 35px;
}

3、滑动门样式改变？
li a:hover{
background: url("blue_r1_c1.png");}
li a:hover span{
background: url("blue_r1_c2.png") right;}

4、margin和padding的区别
margin-bottom:10px;

5、居中与间距前后有影响
margin: 0 auto;
margin-top: 10px;

6、网页布局思路

2017.3.8