css常见布局(三)

总结下目前学到的小技巧

1 . 解决margin合并问题

    border-top = 0.1可以解决margin合并

    display:table 可以解决margin合并

2 . display:inline 可以取消 li 的小圆点

3 . 实现中文的对齐(一定要有伪元素after)

4 .文字溢出的问题

   word-break:break-all 可以让元素中一个一个英语单词展示成一个一个字母

  white-space:nowrap 不换行  

  text-overflow:ellipsis 一行文本省略号

  多行文本省略号

5 .outline:边框 不占据空间

6.如果要达到40px的宽度且文字居中,line-height:24px; padding:8px 0;

7 .尽量不要写高度,让其自适应

8.解决margin合并问题:用padding或者margin 尽量不要用voerflow:hidden

9 .div的高度是由它内部文档流的中元素高度总和决定的

10 .内联元素的padding和margin只会影响宽度,不会影响高度

11 .实现一个1比1的idiv

实际代码