平时有可能用到的一些css技巧

    网站开发人员，在开发过程中，总是会遇到许多莫名其妙的BUG，其中，以IE6不兼容的问题据多。我们有什么办法能够让写的网站样式全兼容呢？这就需要很多css技巧了，下面是淮安互联网站建设公司总结的一些css技巧，相信对大家能够有点帮助。

需要图片在层中是垂直居中

    当需要图片在层中是垂直居中，可以图片定义vertical-align: middle;，再在图片左侧加入，定义样式display: inline-block; height: 100%; vertical-align: middle; 就是兼容的了。

子元素浮动,父元素不能自动适应高度

    FF IE7下可以在父元素定义overflow: auto; IE6加入 zoom: 1; 这个触发IE的.layout。或在浮动元素后加入在浮动层后面加入。

IE下图片产生的间隙

    父元素直接包含，这个图片下方会和父元素边缘产生间隙。 解绝方法：1.在源代码中让和在同一行，因为那个间隙是由换行符产生的。2.给添加样式 display:block;

IE下高度低于10像素时问题

    块元素最小高度为10px，当高度定义小于10px时，仍为10px; 解决方法：为此块元素添加样式 overflow:hidden; 或font-size: 0;

IE，FF下列表的li为浮动，则列表后面的元素不能换行的问题

    解决方法：为这个ul定义合适的高或给包含这个ul 的父div定义合适的高。或加上

IE,FF下子元素的上下外边界问题(不定义宽高)

    子元素的上下外边界和父元素上下外边界叠加，并且显示在父元素外面。解决方法：在父元素增加 overflow:hidden;或给父元素增加边框或内边距。

IE,FF下子元素的上下外边界问题(定义宽度)

    IE6：子元素的上边距和父元素的上内边距叠加。FF：子元素上边距显示在父元素上方。解决方法：在父元素增加 overflow:hidden;或给父元素增加边框或内边距。

IE,FF下子元素的上下外边界问题(定义高度)

    IE6：子元素上边距显示正常。FF：子元素的上边距和父元素的上内边距相加。解决方法：1、给父元素定义内边距。2、父元素设置边框，子元素定义上外边距。3、父元素定义overflow: hidden;，子元素定义上外边距。

IE,FF高度自适应问题（最小高度）

    在IE6下子元素的高度能够撑开父元素，但FF，IE7下不可以。解决办法：父元素定义min-height:高度值; height:auto !important; height:高度值; （要注意先后顺序不能错）

IE,FF高度自适应问题（最大高度，最小宽度，最大宽度）

    最大高度，max-height: 180px; _height: expression( this.scrollHeight > 180 ? "180px" : "auto" ); 后面两条是解决IE6问题。

    最小宽度，min-width: 900px; _width: expression(this.width < 600 ? 600: true);

    最大宽度，max-width: 300px; _width: expression(this.width > 600 ? 600: true);

子元素负边距问题

    IE6：超出父元素的部分会被父元素覆盖。FF：分两种情况当父元素有边框或内边距时，超出父元素的部分会覆盖父元素；没有时父元素拥有负边距。解决方法：子元素定义相对定位。同时IE下子容器如果包含属性position:relative，则父容器失效(IE bug)，所以也需要设置父容器position:relative解决，IE6需要zoom:1来触发haslayout

IE6诡异的奇数BUG

    当父元素相对定位，子元素绝对定位时，倘若父元素的高或宽的数值是奇数，那么IE6下绝对位置会出错。解决方法： 数值改成偶数，IE6是大侠，只要服从它。