前端css容易出现的样式问题和解决方法,比如外边距合并,外边距塌陷,图片底部缝隙,精灵图,弹性盒子居中等

css

1.外边距合并

2.外边距塌陷

3.padding撑大盒子:如果父子嵌套,子盒子没有宽度,盒子不会"撑大

 

4.margin的上下auto无效,左右居中

   margin:0 auto ;//块级元素居中,必须要有"宽度"

 

5.图片底部缝隙问题

比较常用的几个css

white-space:强制一行显示

overflow:hidden:超出隐藏

text-overflow:ellipis;超出显示省略号

[若是要显示省略号;这这三个样式连着一起用]

 

 

6.精灵图技术 使用background-position:x,y;

  1)测量需要小图片的宽高和x,y的坐标

   2)在页面创建一个和图片大小一致的盒子

   3)给该盒子添加负值,并且设置坐标为负值

 

7.弹性盒子如何居中?