EO:搜索引擎优化，一般在网页里面只写一个h1标签，搜索引擎可以通过该h1标签里面的内容搜索你所写的网页(a标签和img标签最好写上title属性)
标准写法：
.logo {
text-decoration: none;
width: 144px;
height: 62px;
background: url(logo.jpg) no-repeat;
}
a {
display: block;
text-indent: -999em;
overflow:hidden;
}
<h1><a href="http://www.baidu.com" class="logo">淘宝网</a></h1>
*********************************************************************
行内元素不支持text-indent,line-height
margin会出现的问题：
1.margin-top和margin-bottom对行内元素会失效，left和right是起作用的。
2.对行内元素设置padding-top或者是padding-bottom的时候，文字本身的位置是不会发生变化的，但是由于设置了padding，盒子的高度是变化的。
3.一般不对行内元素设置padding-top,padding-bottom。
*********************************************************************
margin拖拽问题：给子元素设置margin-top，父元素跟着子元素移动
解决margin拖拽问题的问题：
给父元素设置overflow属性，属性值为hidden(overflow: hidden;)
*********************************************************************
盒子左右居中： margin：0 auto；
*********************************************************************
<style>
body,h1,h2,h3,h4,h5,h6 {font-size:20px; font-family:"微软雅黑",arial,sans-serif;}
body,p,h1,h2,h3,h4,h5,h6,dl,dd,form,select {margin:0;}
em{font-style:normal;}
ol,ul {list-style:none; padding:0; margin:0;}
a {text-decoration:none;}
a:hover {text-decoration:underline;}
img {border:none; vertical-align:top;}
input {margin:0; padding:0;}
textarea {margin:0; padding:0; resize:none; overflow:auto; outline:none;}
th,td{padding:0;}
table{border-collapse:collapse;}
.clearfix:after { content:""; display:block; clear:both; }
.clearfix { zoom:1; }
.fl { float:left; }
.fr { float:right; }
html { overflow-x:hidden; }
</style>