css写页面时，遇到了以下的一些问题 每每写页面都要去搜索解决方案 ，现在整理如下，分享给朋友们：
1.背景图片高度自适度
padding-bottom: 100%;
height: 0;
2.让底部内容一直固定在底部
3.导航添加分格线
.top ul li + li { border-left: 1px solid #ddd;}
4.最优清除浮动
.clearfix:before,.clearfix:after{content: " ";display: table;}
.clearfix:after{clear:both;}
5.去除img之间的空隙
font-size: 0;
vertical-align: bottom;
6.使用css设置双线条边框
border:2px solid #f9e42b; //边框
outline:2px solid #f9e42b; //外轮廓
outline-offset:6px; //主要属性 设置边框与外轮廓的间距
7: 使用flex布局时，遇到如下图情况，我的做法是在最后面加一个空li ,如有其它好的解决方案，欢迎推荐
8.移动端导航左右滑动效果 （以前一直以为只有js插件能够实现，其实css一个属性就搞定）
overflow-x: scroll; //裁剪内容 - 提供滚动机制。
9.一些CSS属性
vertical-align middle 垂直居中
display: table-cell;
text-decoration: line-through; 删除线
pointer-events:none; 取消元素鼠标点击事件 就是让元素变成透明不能点击状态
overflow: hidden; 元素超出隐藏
text-overflow: ellipsis; 文字超出隐藏
white-space: nowrap; 文本强制单行显示
border-collapse: collapse; 表格边框单行线
table,tr,th : border:1px solid #000; 表格边框
