1.如何让单行文本垂直居中？height和line-height的值相同，文本就会居中，
首行缩进：text-indent: 2em; 代表首行缩进2个字的空格 1em=1* 16px。
文字的行高是1.2倍宽高：line-height:1.2em。
2.图片是行内块元素，只要是inline属性都具有文本特性，不愿染是与非 怎料事与愿违。只要在HTML中写里两句，它们之间都会有空格。因此图片它们也会产生空格，像下图那样。
怎么解决以上问题，
<img src="img/1.jpg" ><img src="img/2.jpg" > 可以在页面中把它们的空格删掉。但开发时没有这么写习惯。也可以设置margin-left: -6px; ，使它们往左靠拢。当使用负的像素时，在压缩代码时会出现点问题，这时可以根据情况改margin-left的值。
3.框架开发性固定语法：先定义功能后选配功能。当要写几个差不多样式的div。可以使用下面的开发方法
.size1{ width: 100px; height: 100px;}.size2{ width: 200px; height: 200px;}.green{ background: green;}.red{ background: red;}<div class="green size1"></div>
<div class="red size2"></div>
4.初始化标签
写网页时需要用到多个ul和li，但不需要它们自定义的样式。这时可以在最上面写属性。如下
ul li{
list-style: none;
}
可以把页面中所有的ul li的样式去掉。当需要它们的样式时，再使用层级选择器写。
5.当里面嵌套一层div时。里面的内容想要设置居中。
<div class="box">
<div class="pox"></div>
</div>
.box{
width: 100px;
height: 100px;
background: gold;
}
.pox{
width: 100px;
height: 100px;
background: fuchsia;
}
原文地址：https://www.cnblogs.com/combating/p/10804194.html