HTML和CSS布局中一些容易忘记的细节整理..持续更新

1.border:none;
去除按钮边框

2.outline:none;
去除表单的默认蓝色轮廓线

3.resize:none;
防止拖拽文本域

4.logo一般在h1标签放logo文字里(SEO)，再用
overflow: hidden;
或者
font-size:0;

5.去除列表前面的小圆点 ·
list-style:none;

6. < a>标签为行内元素无宽度无大小
   display:block or display:inline-block

7.绝对定位margin值无效

8.表格外框线合并问题
border-collapse: collapse;

9.a 链接中防止链接跳转：
javascript:;

10.如何处理溢出的内容 ：
overflow-y: visible; /内容可见/
overflow-y: hidden; /内容隐藏/
overflow-y: scroll; /总是显示滚动条/
overflow-y: auto; /浏览器决定/

11 .固定定位的盒子要有宽度
position: flexed;
width: <number>;

12.在定位当中，margin:0 auto;
无效！解决方案如下：

13：溢出文本显示…(省略号)
这里示例3行文本之后用省略号
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;

14.滚动条展示样式修改
::-webkit-scrollbar {
width: 20px;
height: 20px;
border-color: #f2f2f2;
}

15.菱形 ◇ 的制作：
{ width: 100px; height: 100px; background-color: red; transform:rotate(45deg); -ms-transform:rotate(45deg); /* Internet Explorer / -moz-transform:rotate(45deg); / Firefox / -webkit-transform:rotate(45deg); / Safari 和 Chrome / -o-transform:rotate(45deg); / Opera */ margin:50px auto;/让菱形浏览器上居中/ }