图片垂直居中css写法兼容ie6

头胀胀的,看不下东西做不下事,那就写朵随笔吧。
图片垂直居中,原理应该就是,其实我也不知道。
手上两种方法,异曲同工,但是都兼容ie6的。
 

复制代码
代码如下:

<div class="imgBox">
<img src="T1mN1tXs0jXXb1upjX.jpg" />
<i></i>
</div>
.imgBox{ width:100%;height:400px; border:1px solid red;}
.imgBox img,.imgBox i{display:inline-block; vertical-align:middle;}
.imgBox i{height:100%}

时间: 2024-09-19 09:20:22

图片垂直居中css写法兼容ie6的相关文章

用css实现兼容IE6的图片圆角边框方法

<style> #demo h2,#demo h3{font-size:1em; font-weight:normal; color:#a40000; margin:1em auto; position:relative} #demo h3{color:#888; font-weight:bold} #demo .box{width:600px; margin:2em auto} #demo .box li{display:inline; margin:1em; float:left} #de

CSS hack实现 CSS完美兼容IE6/IE7/FF的通用方法_经验交流

关于CSS对各个浏览器兼容已经是老生常谈的问题了, 网络上的教程遍地都是.以下内容没有太多新颖, 纯属个人总结, 希望能对初学者有一定的帮助. 一.CSS HACK 以下两种方法几乎能解决现今所有HACK. 1, !important 随着IE7对!important的支持, !important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.) <style> #wrapper { width: 100px!important; /* IE7+FF */ width: 

[转]CSS完美兼容IE6/IE7/FF的通用方法

关于CSS对各个浏览器兼容已经是老生常谈的问题了, 网络上的教程遍地都是.以下内容没有太多新颖, 纯属个人总结, 希望能对初学者有一定的帮助. 一.CSS HACK 以下两种方法几乎能解决现今所有HACK. 1, !important 随着IE7对!important的支持, !important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.) <style> #wrapper { width: 100px!important; /* IE7+FF */ width:

css padding兼容ie6,ie8,firefox办法

padding 简写属性在一个声明中设置所有内边距属性. 说明 这个简写属性设置元素所有内边距的宽度,或者设置各边上内边距的宽度.行内非替换元素上设置的内边距不会影响行高计算:因此,如果一个元素既有内边距又有背景,从视觉上看可能会延伸到其他行,有可能还会与其他内容重叠.元素的背景会延伸穿过内边距.不允许指定负边距值. 注释:不允许使用负值. 例子 1 padding:10px 5px 15px 20px;上内边距是 10px 右内边距是 5px 下内边距是 15px 左内边距是 20px 例子

兼容IE6的图片圆角边框CSS

纯CSS实现的图片圆角边框效果,兼容IE6. 实现原理很简单,利用绝对定位,使一个背景为PNG图片的边框覆盖在原始图片上面.而兼容IE6,本文用的是一段JS来让万恶的万万人诅咒的IE6识别PNG图片的.当然,你还可以用滤镜的方式让IE6实现PNG效果.本文后面我会附上两种解决方案.个人比较推崇用JS来实现IE6PNG,适应性比较强,但如果你只有一两处用到PNG,完全可以用滤镜的方式来实现.核心CSS代码: .i_roundimg{ background:url(http://mrthink.ne

jquery实现图片渐变切换兼容ie6/Chrome/Firefox

jquery代码实现图片渐变切换同时兼容ie6.Chrome.Firefox,想学习的朋友可以测试下,希望对大家有所帮助   复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w

CSS 浏览器兼容hack整理收藏

兼容范围: IE:6.0+,FireFox:2.0+,Opera 10.0+,Sarari 3.0+,Chrome 参考资料: 1, IE条件注释法,微软官方推荐的hack方式. 只在IE下生效 <!--[if IE]> 这段文字只在IE浏览器上显示 <![endif]--> 只在IE6下生效 <!--[if IE 6]> 这段文字只在IE6浏览器上显示 <![endif]--> 只在IE6以上版本生效 <!--[if gt IE 6]> 这段文

css 图片垂直居中(兼容各主流浏览器,含IE6/IE7)

1.利用table-cell实现居中,font-size做兼容兼容IE6+/FF/Chrome 优点:不添加任何多余标签,兼容主流浏览器  代码如下 复制代码 <!--html结构--> <div class="box-1">  <a class="img-wrap-1" href="#">   <img src="images/1.png" alt="" />

2010全面兼容IE6/IE7/IE8/FF的CSS HACK写法

浏览器市场的混乱,给设计师造成很大的麻烦,设计的页面兼容完这个浏览器还得兼容那个浏览器,本来ie6跟ff之间的兼容是很容易解决的.加上个ie7会麻烦点,ie8的出现就更头疼了,原来hack ie7的方法又不能用了,怎么办呢? 第一种方法: 还好,微软提供了这样一个代码: <meta http-equiv="x-ua-compatible" content="ie=7" /> 把这段代码放到里面,在ie8里面的页面解析起来就跟ie7一模一样的了,所以,基本