1.如果ul下有很多li，需要在一行显示，并且设置margin。但是通常要取消第一个li的margin-left。使用：first-child有的浏览器不兼容。
解决：.li+.li{
margin-left: 5px;
}
适用场景：单行左对齐，有间距
2.多行文字垂直居中
li{
display:table;
}
li>span{
display:table-cell;
vertical-align:middle;
}
3.设置图片宽度100%，高度等于宽度img{
100%;
height:0;
padding-bottom:100%;
}
4.:after伪类+content 让大小不固定图片垂直居中
让图片垂直居中一直没有找到一个很好的办法，今天学习重温after伪类的时候突然看到一个解决方案，觉得很好。
HTML代码：
<body> <div class="pic_box"> <img src="images/img-mobile-1.jpg"/> </div> </body>
CSS代码：
<style> .pic_box{ 300px; height:300px; background-color:#beceeb; font-size:0; *font-size:200px; text-align:center; } .pic_box img{vertical-align:middle;height:100px;} .pic_box:after{ display:inline-block; 0; height:100%; content:"center"; vertical-align:middle; overflow:hidden; } </style>
效果图：
5.禁止textarea拉伸的方法是设置这个 style="resize:none" 属性
设置placeholder颜色
#txt::-webkit-input-placeholder{
color:red;
}