css兼容性问题

2024年2月9日发(作者：)

图片自伸缩

width: expression( > 625 && > ? 625 : auto);

height: expression( > 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="oundColor='#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:mage(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值*/

最新总结：

这样的块要是不能定死宽度 又要a在一行显示，a与a之间的间隙也要3个浏览器相等的解决方案：

.trya{ font-size:0;}

.trya a{font-size:正常值; display:inline;/*如果a要作为块级元素显示，css要改为display:inline-block; *display:inline;*/

zoom: 1;/*针对ie*/}

Css控制文本换行

white-space: nowrap; 文本不换行

white-space: normal; 文本换行，为默认属性

YUI CSS Reset

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p,

blockquote, th, td { margin:0; padding:0; }

table { border-collapse:collapse; border-spacing:0; }

fieldset, img { border:0; }

address, caption, cite, code, dfn, em, strong, th, var { font-style:normal;

font-weight:normal; }

ol, ul { list-style:none; }

caption, th { text-align:left; }

h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal; }

q:before, q:after { content:''; }

abbr, acronym { border:0; }

Flash背景透明的几个问题

1、 保存透明背景的flash。发布设置 —> 格式（html）—> html（窗口模式：透明无窗口）

2、 修改HTML。