CSS兼容IE6IE7FF的技巧.docx

然后CSS这样设计：

PLAINTEXT

CSS:

#container{min-width:

600px;width:

expression（document.body.clientWidth<600?

“600px”:

“auto”）;}

第一个min-width是正常的；但第2行的width使用了Javascript，这只有IE才认得，这也会让你的HTML文档不太正规。

它实际上通过Javascript的判断来实现最小宽度。

7清除浮动

PLAINTEXT

CSS:

.hackbox{display:

table;//将对象作为块元素级的表格显示}或者.hackbox{clear:

both;}

或者加入:

after（伪对象）,设置在对象后发生的内容，通常和content配合使用，IE不支持此伪对象，非Ie浏览器支持，

所以并不影响到IE/WIN浏览器。

这种的最麻烦的……

PLAINTEXT

CSS:

#box:

after{content:

“.”;display:

block;height:

0;clear:

both;visibility:

hidden;}

8DIV浮动IE文本产生3象素的bug

左边对象浮动，右边采用外补丁的左边距来定位，右边对象内的文本会离左边有3px的间距.

PLAINTEXT

CSS:

#box{float:

left;width:

800px;}#left{float:

left;width:

50%;}#right{width:

50%;}*html#left{margin-right:

-3px;//这句是关键}

HTML代码<divid=“box”><divid=“left”></div><divid=“right”></div></div>

9属性选择器（这个不能算是兼容,是隐藏css的一个bug）

PLAINTEXT

CSS:

p[id]{}div[id]{}

这个对于IE6.0和IE6.0以下的版本都隐藏,FF和OPera作用

属性选择器和子选择器还是有区别的,子选择器的范围从形式来说缩小了,属性选择器的范围比较大,如p[id]中,所有p标签中有id的都是同样式的.

10IE捉迷藏的问题

当div应用复杂的时候每个栏中又有一些链接，DIV等这个时候容易发生捉迷藏的问题。

有些内容显示不出来，当鼠标选择这个区域是发现内容确实在页面。

解决办法：

对#layout使用line-height属性或者给#layout使用固定高和宽。

页面结构尽量简单。

11高度不适应

高度不适应是当内层对象的高度发生变化时外层高度不能自动进行调节，特别是当内层对象使用

margin或paddign时。

例：

PLAINTEXT

CSS:

<divid=“box”>

<p>p对象中的内容</p>

</div>

CSS：

#box{background-color:

#eee;}

#boxp{margin-top:

20px;margin-bottom:

20px;text-align:

center;}

解决方法：

在P对象上下各加2个空的div对象CSS代码：

.1{height:

0px;overflow:

hidden;}或者为DIV加上border属性。

网页常用代码-未整理

27Jun,2008NoComment

如内容超出单元格，则隐藏

style=”TABLE-LAYOUT:

fixed”

让弹出窗口总是在最上面:

不要滚动条?

让竖条没有:

scroll;overflow-y:

hidden’>

让横条没有:

scroll;overflow-x:

hidden’>

两个都去掉？

更简单了

怎样去掉图片链接点击后，图片周围的虚线？

电子邮件处理提交表单

****@***.com”enctype=”text/plain”>

在打开的子窗口刷新父窗口的代码里如何写？

window.opener.location.reload（）

如何设定打开页面的大小

在页面中如何加入不是满铺的背景图片,拉动页面时背景图不动

各种样式的光标auto：

标准光标

default：

标准箭头

hand：

手形光标

wait：

等待光标

text：

I形光标

vertical-text：

水平I形光标

no-drop：

不可拖动光标

not-allowed：

无效光标

help：

?

帮助光标

all-scroll：

三角方向标

move：

移动标

crosshair：

十字标e-resizen-resizenw-resizew-resizes-resizese-resizesw-resize

本机ip<%=request.servervariables（”remote_addr”）%>

服务器名<%=Request.ServerVariables（”SERVER_NAME”）%>

服务器IP<%=Request.ServerVariables（”LOCAL_ADDR”）%>

服务器端口<%=Request.ServerVariables（”SERVER_PORT”）%>

服务器时间<%=now%>IIS

版本<%=Request.ServerVariables”SERVER_SOFTWARE”）%>

脚本超时时间<%=Server.ScriptTimeout%>

本文件路径<%=server.mappath（Request.ServerVariables（”SCRIPT_NAME”））%>

服务器CPU数量<%=Request.ServerVariables（”NUMBER_OF_PROCESSORS”）%>

服务器解译引擎<%=ScriptEngine&“/”&ScriptEngineMajorVersion&”.”&ScriptEngineMinorVersion&”.”&ScriptEngineBuildVersion%>

服务器操作系统<%=Request.ServerVariables（”OS”）%>

文本竖排方式

–

.shupai{Writing-mode:

tb-rl}

–>

超链接去虚线边框

在链接中加上onfocus=”this.blur（）”

网页搜索关键字头里插入

收藏夹图标

我的电脑

file:

///:

:

{20D04FE0-3AEA-1069-A2D8-08002B30309D}

网上邻居

file:

///:

:

%7B208D2C60-3AEA-1069-A2D7-08002B30309D%7D

我的文档

file:

///:

:

%7B450D8FBA-AD25-11D0-98A8-0800361B1103%7D

控制面板

file:

///:

:

{20D04FE0-3AEA-1069-A2D8-08002B30309D}/:

:

{21EC2020-3AEA-1069-A2DD-08002B30309D}

回收站

file:

///:

:

%7B645FF040-5081-101B-9F08-00AA002F954E%7D

鼠标控制图片隐现效果

把如下代码加入＜body＞区域中：

–

functionmakevisible（cur,which）{

if（which==0）

cur.filters.alpha.opacity=100

else

cur.filters.alpha.opacity=20

}

//–>

2、把如下代码加入＜body＞区域中：

alpha（opacity=20）”

onMouseOver=”makevisible（this,0）”

onMouseOut=”makevisible（this,1）”>

禁止图片下载

void（0）”onMouseover=”alert（’对不起,此图片不能下载!

’）”>

页嵌页

隐藏滚动条

hidden;overflow-y:

hidden”

CSS文字阴影（定义在中）

.abc{

FILTER:

dropshadow（color=#666666,offx=1,offy=1,positive=1）;FONT-FAMILY:

“宋体”;FONT-SIZE:

9pt;COLOR:

#ffffff;

}

列表/菜单

onchange=”location=this.options[this.selectedIndex].value”

reurl=server.htmlencode（request.ServerVariables（”HTTP_REFERER”））

服务器上如何定义连接

MM_www_STRING=”driver={MicrosoftaccessDriver（*.mdb）};dbq=”&server.mappath（”../data/www.mdb”）

链接到

response.redirect”login.asp”

location.href=”xx.asp”

onClick=”window.location=’login.asp’”

onClick=”window.open（”）”

取得IP

userip=Request.ServerVariables（”HTTP_X_FORWARDED_FOR”）

Ifuserip=“”Thenuserip=Request.ServerVariables（”REMOTE_ADDR”）

sql=”updatefeedbaksethit=hit+1whereid=”&request（”id”）

conn.execute（sql）

截取字符是否加…

functionformatStr（str,len）

if（len（str）>len）

str=left（str,len）+“…”

endif

formatStr=str

endfunction

接收表单

IfUcase（Request.ServerVariables（”REQUEST_METHOD”））=“POST”then

endif

图片宽度

–

varflag=false;

functionDrawImage（ckp）{

varimage=newImage（）;

image.src=ckp.src;

if（image.width>0&&image.height>0）

{flag=true;

if（image.width>120）{

ckp.width=120;

}else{

ckp.width=image.width;

}

ckp.alt=image.width+”×”+image.height;

}

}

//–>

I’llbeBack22:

18:

06

/<%=rs（”photoname”）%>”border=”0″onload=”javascript:

DrawImage（this）;”>

跳转

溢出栏的设制

visible：

超出的部分照样显示；

hidden：

超出的部分隐藏；

scrool：

不管有否超出，都显示滚动条；

auto：

有超出时才出现滚动条；

onMouseOver：

鼠标移到目标上；

onMouseUp：

按下鼠标再放开左键时；

onMouseOut：

鼠标移开时；

onMouseDown：

按下鼠标时（不需要放开左键）；

onClink：

点击时；

onDblClick：

双击时；

onLoad：

载入网页时；

onUnload：

离开页面时；

onResize：

当浏览者改变浏览窗口的大小时；

onScroll：

当浏览者拖动滚动条的时。

CSS样式

a:

link：

表示已经链接；

a:

hover：

表示鼠标移上链接时；

a:

active：

表示链接激活时；

a:

visited：

表示己点击过的链接。

跳出对话框链接

javascript:

alert（’lajflsjpjwg’）

后退：

javascript:

history.b