css兼容性问题.doc

图片自伸缩

width: expression(this.width > 625 && this.width > this.height ? 625 : auto); height: expression(this.height > 625 ? 625 : auto); max-width:625px;

最小高度600px（适用于所有最大最小宽度高度问题）

min-height:600px; height:auto !important; height:600px;

取消最小高度约束

min-height:inherit;

marquee下的内容还没完全滚完就跳到开头重新开始

将要滚动的部分的高度去掉

将要滚动的部分的浮动去掉

css透明属性

filter:alpha(opacity=40);/* ie 设置透明度40% */

opacity: .4;/* 火狐设置透明度40% */

table中td的width属性为px时

table{table-layout:fixed;}

鼠标悬浮时变色

onmouseout="style.backgroundColor='#FFFFFF'"

bgcolor="#FFFFFF">

元素没有背景是css

background:transparent;

iframe为透明时

Clearfix Hack

.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

.clearfix { display:inline-block; }/*针对ie，删除它，高度无法撑开*/

.clearfix {display:block;} /*针对ie，删除它，chorme以撑开宽度显示*/

【注：这段css属性用在包裹在外面的div上面，效果为一屏显示】

看了别人的博文，大概意思如下：这个clearfix的CSS使用了after这个伪对象，它将在应

用clearfix的元素的结尾添加content中的内容。在这里添加了一个句号"."，并且把它的display设置成block；高度设为0；clear设为both；visibility设为隐藏，从而达到撑开容器的目的。

淘宝的页面中采用了.clearfix的方法

.clearfix{*zoom:1;}; /*对ie的zoom设置更有针对性*/

.clearfix:after{content:'\0020';display:block;height:0;clear:both;} /*“\20”不知道是何用意，

其他属性大致一样，少了visibility */

css滤镜实现页面灰色黑白色效果代码

html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }

display:inline-block;

例：

• test1
• test1

ul{}

li{display:inline-block; display:-moz-inline-stack; *display:inline; zoom:1; width:80px; height:20px; line-height:20px; border:solid 1px #CCCCCC;}

去火狐中li (或a 和span)的间隙：外层标签：font-size:0;本层：font-size:正常值;这种方

法IE中可能有1px的间隙，这时需要在外层标签中加入：*letter-spacing:-1px;

display:inline-block; /*一方面Firefox3 beta、IE8 beta 、Opera、Safari 支持，另一方面下触发IE下inline 元素的 hasLayout*/

display:-moz-inline-stack;/* Firefox 的私有属性，需要时还必须用到position:relative解决上面提到的bug,没有这句text-align属性失效 */ zoom:1; /*同样是IE 下触发 hasLayout*/

*display:inline; /*一旦IE 下触发了 hasLayout，设置 block 元素为 inline 会使 display:inline 效果与 display:inline-block 相似*/ 扩展一下一些其他可能用到的属性

text-indent:-9999px;

*text-indent:0;

font-size:0;

line-height:0;/* 如需隐藏文字，可用这四个属性 */

另外上面隐藏文字，还可以用更简化的方法：line-height:超级大

值;font-size:0;

overflow:hidden; /* 隐藏溢出的内容 */

vertical-align:middle;/* 行内垂直居中，针对 Opera 比较大的偏离 */ width:？px; /*？为任意非auto值*/

height:？px;/*？为任意非auto值*/

最新总结：

fffffdddd