html页面中常用的一些小方法整理

时间:2015-3-28 3:12:01   作者:互联网   来源:互联网转载   阅读:312   评论:0
内容摘要:  在<Head>标签中加 <meta httpequiv="pragma " content="nocache"> <meta httpequiv="CacheControl " content="nocachemus...

  在<Head>标签中加

<meta httpequiv="pragma " content="nocache">
<meta httpequiv="CacheControl " content="nocachemustrevalidate">
<meta httpequiv="expires " content="Wed Feb :: GMT ">

如何用JQuery的ajax跳转可以这样清理

//ajax请求不缓存

$ajaxSetup({ cache: false
});

MaintainScrollPositionOnPostback="true"
如内容超出单元格则隐藏
style="TABLELAYOUT: fixed"

让弹出窗口总是在最上面: <body onblur="thisfocus();">
不要滚动条? 让竖条没有: <body style=overflow:scroll;overflowy:hidden> </body>
让横条没有: <body style=overflow:scroll;overflowx:hidden> </body>
两个都去掉?更简单了 <body scroll="no"> </body>
怎样去掉图片链接点击后图片周围的虚线? <a href="#" onFocus="thisblur()"><img src="logojpg" border=></a>
电子邮件处理提交表单 <form name="form" method="post" action="mailto:****@***com" enctype="text/plain">

<input type=submit> </form>
在打开的子窗口刷新父窗口的代码里如何写? windowopenerlocationreload()
如何设定打开页面的大小 <body onload="topresizeTo();">
在 页面中如何加入不是满铺的背景图片拉动页面时背景图不动 <html><head> <STYLE> body {backgroundimage:url(logogif); backgroundrepeat:norepeat; backgroundposition:center } </STYLE> </head> <body bgproperties="fixed" > </body> </html>

各种样式的光标 auto 标准光标
default 标准箭头
hand 手形光标
wait 等待光标
text I形光标
verticaltext 水平I形光标
nodrop 不可拖动光标
notallowed 无效光标
help ?帮助光标
allscroll 三角方向标
move 移动标
crosshair 十字标 eresize nresize nwresize wresize sresize seresize swresize

本机ip<%=requestservervariables("remote_addr")%>
服务器名<%=RequestServerVariables("SERVER_NAME")%>
服务器IP<%=RequestServerVariables("LOCAL_ADDR")%>
服务器端口<%=RequestServerVariables("SERVER_PORT")%>
服务器时间<%=now%> IIS
版本<%=RequestServerVariables"SERVER_SOFTWARE")%>
脚本超时时间<%=ServerScriptTimeout%>
本文件路径<%=servermappath(RequestServerVariables("SCRIPT_NAME"))%>
服务器CPU数量<%=RequestServerVariables("NUMBER_OF_PROCESSORS")%>
服务器解译引擎<%=ScriptEngine & "/"& ScriptEngineMajorVersion &""&ScriptEngineMinorVersion

&""& ScriptEngineBuildVersion %>
服务器操作系统<%=RequestServerVariables("OS")%>

文本竖排方式
<style type="text/css">
<!
shupai {Writingmode:tbrl}
>
</style>
超链接去虚线边框
在链接中加上onfocus="thisblur()"

网页搜索关键字 头里插入
<META NAME="keywords" CONTENT="xxxxxxxxxxxxxxxxxxxx">

收藏夹图标
<link rel = "Shortcut Icon" href="faviconico">

我的电脑
file:///::%BDFEAEAADBD}
网上邻居
file:///::%BDCAEAADBD%D
我的文档
file:///::%BDFBAADDAB%D
控制面板
file:///::%BDFEAEAADBD%D/::%BECAEAADDBD}
回收站
file:///::%BFFBFAAFE%D

鼠标控制图片隐现效果
把如下代码加入<body>区域中
<SCRIPT language="javascript">
<!
function makevisible(curwhich){
if (which==)
curfiltersalphaopacity=
else
curfiltersalphaopacity=
}
//>
</SCRIPT>
把如下代码加入<body>区域中
<img src="gif" style="filter:alpha(opacity=)"
onMouseOver="makevisible(this)"
onMouseOut="makevisible(this)">

禁止图片下载
<A HREF="javascript:void()" onMouseover="alert(对不起此图片不能下载!)">
<IMG SRC="gif" Align="center" Border="" width="" height=""></A>

页嵌页
<iframe width= height= src="mainfiles/newshtm" frameBorder=></iframe>

隐藏滚动条
<body style="overflowx:hidden;overflowy:hidden"

CSS文字阴影(定义在<TD>中)
abc{
FILTER: dropshadow(color=# offx= offy= positive=); FONTFAMILY: "宋体"; FONTSIZE: pt;COLOR: #ffffff;
}

列表/菜单
onchange="location=thisoptions[thisselectedIndex]value"

<iframe id="frm" src="kxinwenhtml" scrolling="no" width="" height=""></iframe>
<img src="xiangshangjpg" onMouseOver="sf=setInterval(frmscrollBy())" onMouseOut="clearInterval(sf)" width="" height="">
<img src="xiangxiajpg" onMouseOver="sf=setInterval(frmscrollBy())" onMouseOut="clearInterval(sf)" width="" height="" >

reurl=serverhtmlencode(requestServerVariables("HTTP_REFERER"))

服务器上如何定义连接
MM_www_STRING ="driver={Microsoft access Driver (*mdb)};dbq=" & servermappath("/data/wwwmdb")

链接到
responseredirect"loginasp"
locationhref="xxasp"

onClick="windowlocation=loginasp"
onClick="windowopen()"

取得IP
userip = RequestServerVariables("HTTP_X_FORWARDED_FOR")
If userip = "" Then userip = RequestServerVariables("REMOTE_ADDR")

sql="update feedbak set hit=hit+ where id="&request("id")
connexecute(sql)

截取字符是否加
function formatStr(strlen)
if(len(str)>len)
str = left(strlen) + ""
end if
formatStr = str
end function

接收表单
If Ucase(RequestServerVariables("REQUEST_METHOD")) = "POST" then
end if


图片宽度
<script language="javascript">
<!
var flag=false;
function DrawImage(ckp){
var image=new Image();
imagesrc=ckpsrc;
if(imagewidth> && imageheight>)
{flag=true;
if(imagewidth>){
ckpwidth=;
}else{
ckpwidth=imagewidth;
}
ckpalt=imagewidth+"×"+imageheight;
}
}
//>
</script>
Ill be Back ::
<img src="<%=formPath%>/<%=rs("photoname")%>" border="" onload="javascript:DrawImage(this);">

跳转
<meta httpequiv=refresh content=; url=/distributor/distributoraspx>

溢出栏的设制
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:historyback()
关闭窗口javascript:windowclose();
窗口还原
function restore(){
windowmoveTo();
windowresizeTo(screenwidthscreenavailHeight);
}

head区是指首页HTML代码的<head>和</head>之间的内容
必须加入的标签

公司版权注释
<! The site is designed by MaketownInc / >

网页显示字符集
简体中文<META HTTPEQUIV="ContentType" CONTENT="text/html; charset=gb">
繁体中文<META HTTPEQUIV="ContentType" CONTENT="text/html; charset=BIG">
英 语<META HTTPEQUIV="ContentType" CONTENT="text/html; charset=iso">

网页制作者信息
<META name="author" content="webmaster@maketowncom">

网站简介
<META NAME="DESCRIPTION" CONTENT="xxxxxxxxxxxxxxxxxxxxxxxxxx">

搜索关键字
<META NAME="keywords" CONTENT="xxxxxxxxxxxxxxxxxxxx">

网页的css规范
<LINK href="style/stylecss" rel="stylesheet" type="text/css">
(参见目录及命名规范)

网页标题
<title>xxxxxxxxxxxxxxxxxx</title>

可以选择加入的标签

设定网页的到期时间一旦网页过期必须到服务器上重新调阅
<META HTTPEQUIV="expires" CONTENT="Wed Feb :: GMT">

禁止浏览器从本地机的缓存中调阅页面内容
<META HTTPEQUIV="Pragma" CONTENT="nocache">

用来防止别人在框架里调用你的页面
<META HTTPEQUIV="Windowtarget" CONTENT="_top">

自动跳转
<META HTTPEQUIV="Refresh" CONTENT=";URL=http://wwwyahoocom">
指时间停留

网页搜索机器人向导用来告诉搜索机器人哪些页面需要索引哪些页面不需要索引
<META NAME="robots" CONTENT="none">
CONTENT的参数有allnoneindexnoindexfollownofollow默认是all

收藏夹图标
<link rel = "Shortcut Icon" href="faviconico">

所有的javascript的调用尽量采取外部调用
<SCRIPT LANGUAGE="javascript" SRC="script/xxxxxjs"></SCRIPT>

附<body>标签
<body>标签不属于head区这里强调一下为了保证浏览器的兼容性必须设置页面背景<body bgcolor="#FFFFFF">

flash透明
在flash的源代码中加上<param name="wmode" value="transparent">

表格透明
style="FILTER: alpha(opacity=)"

网址前添加icon的方法
上上用他的icon editor online制作一个图标他会将做好的图标通过email即时发送给你
把这个命名为faviconico的图标放置在indexhtml同一个文件夹中就可以了
作一个图标文件大小为*像素文件扩展名为ico然后上传到相应目录中在HTML源文件“<head></head>”之间添加如下代码
<Link Rel="SHORTCUT ICON" href="http://图片的地址(注意与刚才的目录对应)">
其中的“SHORTCUT ICON”即为该图标的名称当然如果用户使用IE或以上版本浏览时就更简单了只需将图片上传到网站根目录下自动识别

可以在收藏夹中显示出你的图标<link rel="Bookmark" href="faviconico">

状态栏连接说明
<A HREF="链接到某处" onmouseOver="windowstatus=连接说明;return true;" onMouseOut="windowstatus= ;">某某链接</a>

链接说明
<a href=“”Title=链接说明>

禁止鼠标右键
在<body>标签中加入 <body oncontextmenu="return false">

DW里输入空格
插入N个&nbsp;

水平线
<hr width="长度" size="高度" color="颜色代码" noshade> noshade为有无阴影

表单电子邮件提交
< form name="content" method="post" action="mailto:电子邮箱" >< /form>
文本域名为Subject 为邮件的标题

邮件链接定制
Mailto:地址 ? Subject=邮件的标题 &bc=抄送 &bcc=密件抄送

背景音乐
<bgsound src=地址 loop="">

禁止页面正文选取
<body oncontextmenu="return false" ondragstart="return false" onselectstart ="return false"

onselect="documentselectionempty()" oncopy="documentselectionempty()" onbeforecopy="return false"onmouseup="documentselectionempty()">

消除ie自动出现的图像工具栏设置 GALLERYIMG属性为false或no
<IMG SRC="mypicturejpg" HEIGHT="px" WIDTH="px" GALLERYIMG="no">

防止点击空链接时页面往往重置到页首端
代码“javascript:void(null)”代替原来的“#”标记

如何避免别人把你的网页放在框架中
<script language=“javascript”><!if (self!=top){toplocation=selflocation;} >< /script>

页面定时刷新
<meta httpequiv="Refresh" content="秒" >

页面定时转向新的地址
<meta httpequiv="refresh" content="秒;URL=url">

显示日期
<script language="javascript"><!
today=new Date();
var week; var date;
if(todaygetDay()==) week="星期日"
if(todaygetDay()==) week="星期一"
if(todaygetDay()==) week="星期二"
if(todaygetDay()==) week="星期三"
if(todaygetDay()==) week="星期四"
if(todaygetDay()==) week="星期五"
if(todaygetDay()==) week="星期六"
date=(todaygetYear())+"年"+(todaygetMonth()+)+"月"+todaygetDate()+"日"+" "
documentwrite("<span style=fontsize: pt;>"+date+week+"</span>");
// >
</script>

设为首页
<A href=# onclick="thisstylebehavior=url(#default#homepage);thissetHomePage(url);">设为首页</A>

添加收藏
<A href="javascript:windowexternalAddFavorite(urltitle)">收藏本站</A>

文字滚动
插入边框为列的表格在表格中输入文字选中文字
按ctrl+t输入marquee direction="up" 回车即可让文字在表格区域内向上滚动
(rightdown可用于让文字或图象向右及向下滚动修改html原代码还可以得到需要的滚动速度


表单验正
<SCRIPT language=javascript>
function checkform(theform){
if(theformnamevalue==""){
alert("姓名不能为空!");
theformnamefocus();
return false;
}
if(theformtelvalue==""){
alert("电话不能为空!");
theformtelfocus();
return false;
}
}
</SCRIPT>

定义鼠标
body{cursor: url(curani或cur);}

以图片方式插视频
<IMG height= loop=infinite dynsrc=http://amediaefucomcn/EFUADDrmvb width=>

层在flash上面
< param name="wmode" value="opaque" >

延迟跳转
<meta httpequiv=refresh content=; url=javascript:windowclose();>

导航条变色
单元格<TR后面插入onmouseover="javascript:thisbgColor=#AE" onmouseout="javascript:thisbgColor=#CCFF"

居中
<CENTER></CENTER>

空链接
javascript:;

标题表格
<fieldset>
<legend>表格的说明</legend>
</fieldset>

细线表格
style="BORDERCOLLAPSE: collapse;"

滚动条颜色代码
BODY{
SCROLLBARFACECOLOR: #FFFFFF;
SCROLLBARHIGHLIGHTCOLOR: #FFFFFF;
SCROLLBARSHADOWCOLOR: #FFFFFF;
SCROLLBARDLIGHTCOLOR: #FFCBC;
SCROLLBARARROWCOLOR: #FFFFFF;
SCROLLBARTRACKCOLOR: #FFFFFF;
SCROLLBARDARKSHADOWCOLOR: #FFCBC;
SCROLLBARBASECOLOR: #FFFFFF
}

连续的英文或者一堆感叹号!!!不会自动换行的问题
只要在CSS中定义了如下句子可保网页不会再被撑开了

table{tablelayout: fixed;}
td{wordbreak: breakall; wordwrap:breakword;}

注释一下

第一条table{tablelayout: fixed;}此样式可以让表格中有!!!(感叹号)之类的字符时自动换行

td{wordbreak: breakall}一般用这句这OK了但在有些特殊情况下还是会撑开因此需要再加上后面一句{wordwrap:breakword;}就可以解决此样式可以让表格中的一些连续的英文单词自动换行


控制横向和纵向滚动条的显隐?
<body style="overflowy:hidden"> 去掉x轴
<body style="overflowx:hidden"> 去掉y轴
<body scroll="no">不显
表格变色
<TD onmouseover="thisstylebackgroundColor=#FFFFFF"
onmouseout="thisstylebackgroundColor="
style="CURSOR: hand">
禁止复制鼠标拖动选取
<body ondragstart=windoweventreturnValue=false oncontextmenu=windoweventreturnValue=false

onselectstart=eventreturnValue=false>
普通iframe页面
<iframe name="name" src="mainhtm" width="" height="" scrolling="Auto" frameborder="">

</iframe>
iframe自适应高度
<iframe name="pindex" src="indexasp" frameborder=false scrolling="auto" width="%"

height="%" frameborder=no onload="documentall[pindex]styleheight=pindexdocumentbodyscrollHeight" ></iframe>
IE地址栏前换成自己的图标&可以在收藏夹中显示出你的图标
<link rel="Shortcut Icon" href="faviconico">
<link rel="Bookmark" href="faviconico">
字号缩放
越来越多的人长时间的泡网眼镜的普及率也越来越高让文字大点让更多的用户看的更清楚
<script type="text/javascript">
function doZoom(size)
{documentgetElementById(zoom)stylefontSize=size+px;}
</script>
<span id="zoom">需要指定大小的文字</span>
<a href="javascript:doZoom()">大</a> <a href="javascript:doZoom()">中</a> <a href="javascript:doZoom()">小</a>
select挡住div的解决方法
在div里加入下面的代码根据需要调整就可以了
<iframe src="javascript:false" scrolling="no" frameborder="" style="zindex:;position:absolute; top:px; left:px;width:;height:px;">
</iframe>
iframe(嵌入式帧)自适应高度
填写的嵌入地址一定要和本页面在同一个站点上否则会提示“拒绝访问!”对跨域引用有权限问题请查阅其他资料
<iframe name="guestbook" src="gbook/indexasp" scrolling=no width="%" height="%"

frameborder=no onload="documentall[guestbook]styleheight=guestbookdocumentbodyscrollHeight"></iframe>
跳转菜单新窗口
<select name="select" onchange="windowopen(thisoptions[thisselectedIndex]value)">
<option value="
<option value="
<option value="
</select>
flash透明选项
<param name="wmode" value="transparent">
添加到收藏夹和设为首页
<a href=# onclick="thisstylebehavior=url(#default#homepage); thissetHomePage();">设为首页</a>

<a href="javascript:windowexternalAddFavorite(懒人图库)">收藏本站</a>
记录并显示网页的最后修改时间
<script language=JavaScript>
documentwrite("最后更新时间: " + documentlastModified + "")
</script>
节日倒计时
<Script Language="JavaScript">
var timedate= new Date("October ");
var times= "国庆节";
var now = new Date();
var date = timedategetTime() nowgetTime();
var time = Mathfloor(date / ( * * * ));
if (time >= )
documentwrite( "现在离"+times+"还有: "+time +"天")
</Script>
加在HEAD里
禁止缓存
<meta httpequiv="Expires" CONTENT="">
<meta httpequiv="CacheControl" CONTENT="nocache">
<meta httpequiv="Pragma" CONTENT="nocache">
让IFRAME框架内的文档的背景透明
<iframe src="about:<body style=background:transparent>" allowtransparency></iframe>
打开窗口即最大化
<script language="JavaScript">
<! Begin
selfmoveTo()
selfresizeTo(screenavailWidthscreenavailHeight)
// End >
</script>
加入背景音乐
<bgsound src="mid/windblue[]mid" loop=""> 只适用于IE
<embed src="musicmid" autostart="true" loop="true" hidden="true"> 对Netscape IE 都适用
滚动
<marquee direction=up height= onmouseout=start() onmouseover=stop() scrollAmount=>滚动信息
</marquee>
防止点击空链接时页面往往重置到页首端
代码“javascript:void(null)”代替原来的“#”标记
文字或图片弹出指定大小的窗口
在body中加入
<script language="JavaScript" type="text/JavaScript">
function MM_openBrWindow(theURLwinNamefeatures) {windowopen(theURLwinNamefeatures);}
</script>
弹出代码
<a href="#" target="_self" onClick="MM_openBrWindow(windowshtmwidth=height=)" width="" height="" border="">图片或文字</a>
flash按钮加链接
on (press) {
getURL("%%_blank/");
}
跳转页面代码
<meta httpequiv="refresh" content=";url=http://wwwmakewingcom">
细线分隔线
<hr noshade size= color=#CCC>
网页中的自动换行
<td style="wordbreak:breakall">就搞定了
完整的是
style="tablelayout: fixed;WORDBREAK: breakall; WORDWRAP: breakword"
消除ie自动出现的图像工具栏设置 GALLERYIMG属性为false或no
<IMG SRC="mypicturejpg" HEIGHT="px" WIDTH="px" GALLERYIMG="no">
禁止页面正文内容被选取
<body oncontextmenu="return false" ondragstart="return false" onselectstart ="return false"

onselect="documentselectionempty()" oncopy="documentselectionempty()" onbeforecopy="return
false"onmouseup="documentselectionempty()">
不能点右键不用CTRL+A不能复制作!
<body oncontextmenu="windoweventreturnValue=false"
onkeypress="windoweventreturnValue=false"
onkeydown="windoweventreturnValue=false"
onkeyup="windoweventreturnValue=false"
ondragstart="windoweventreturnValue=false"
onselectstart="eventreturnValue=false">
</body>
IE浏览器支持一个 Body 属性 bgproperties它可以让背景不滚动:
<Body Background="图片文件" bgproperties="fixed">
随机变换背景图象(一个可以刷新心情的特效)
<Script Language="JavaScript">
image = new Array(); //定义image为图片数量的数组
image [] = tugif //背景图象的路径
image [] = tugif
image [] = tugif
image [] = tugif
image [] = tugif
number = Mathfloor(Mathrandom() * imagelength);
documentwrite("<BODY BACKGROUND="+image[number]+">");
</Script>
flash载入影片
on (release)
{
loadMovie("swf" "_rootloaderclip");
}
图片表单按钮
<form id="form" name="form" method="post" action="">
<img src="logingif" width="" height="" onclick="documentformsubmit()" />
</form>
左右阴影背景的CSS定义方法
body {
textalign:center;
backgroundrepeat: repeaty;
backgroundposition: center;
backgroundimage: url(/images/bgjpg);
}
划过链接 手型鼠标
style="cursor:hand"
如何关闭层
<div id="Layer"></div>
<a href="#" onClick="Layerstyledisplay=none">关闭层</a>
关闭窗口的脚本
<a href=javascript:close()>[关闭窗口]</a>
如果文字过长则将过长的部分变成省略号显示
<DIV STYLE="width: px; height: px; border: px solid blue;overflow: hidden; textoverflow:ellipsis">
<NOBR>就是比如有一行文字很长表格内一行显示不下</NOBR>
</DIV>
进入主页后自动最大化
<script>
selfmoveTo()
selfresizeTo(screenavailWidthscreenavailHeight)
</script>
凹陷文字
<div style="width:px;padding:px;overflow:hidden;wordwrap:breakword;wordbreak:break:all; fontsize:px; lineheight:px; backgroundcolor:#eeeeee;">
<font disabled>
怎么样我凹下去了吧?<br>
你不想试试吗?<br>
<a href="%C/a%E%C/font>
</div>
运行代码框
<script>
function Preview()
{var TestWin=open();
TestWindocumentwrite(codevalue);}
</script>
<textarea id=code cols= rows=></textarea>
<br>
<button onclick=Preview() >运行</button>
给表格做链接
<table width="%" onclick="windowopen( _blank)" style="CURSOR:hand">
<tr>
<td height="" bgcolor="fff">&nbsp;</td>
</tr>
</table>
让弹出窗口总是在最上面
<body onblur="thisfocus();">
CSS文字阴影
shadowfont{FILTER: dropshadow(color=# offx= offy= positive=); FONTFAMILY: "宋体"; FONTSIZE: pt;COLOR: #ffffff;}
后退&关闭窗口
后退javascript:historyback()
关闭javascript:windowclose();
表格透明
style="FILTER: alpha(opacity=)"
如何避免别人把你的网页放在框架中
<script language=“javascript”><!if (self!=top){toplocation=selflocation;} >< /script>
Alt和Title的区别
alt 用来给图片来提示的Title用来给链接文字或普通文字提示的

<a href="#" Title="给链接文字提示">文字</a>
<p Title="给链接文字提示">文字</p>

<img src="图片链接" alt="给图片提示">
所有的javascript的调用尽量采取外部调用
<SCRIPT LANGUAGE="javascript" SRC="js/xxxxxjs"></SCRIPT>
链接到
responseredirect"loginasp"
locationhref="xxasp"
onClick="windowlocation=loginasp"
onClick="windowopen()"
基本链接样式
a:link 表示链接的样式
a:active 表示当前活动连接的样式
a:hover 表示鼠标划过时的样式
a:visited 表示已经访问过的连接的样式

"linkvisitedhoveractive" 简记为 "lvha" 即 "love"+"hate"
在同一页面设置不同文字链接效果的样式
<style type="text/css">
green {COLOR: #}
green A:link {COLOR: #; TEXTDECORATION: none}
green A:visited {COLOR: #; TEXTDECORATION: none}
green A:hover {COLOR: #; TEXTDECORATION: underline}
green A:active {COLOR: #; TEXTDECORATION: none}
</style>
<a href="#" class="green">文字</a>


标签:页面 常用 常用的 用的 方法 

免责申明:

站内素材文件均整理自互联网,仅供个人学习参考使用,请勿用于商业用途,如您喜欢请购买正版

站内资源除部分为本站原创外皆由网上搜集和整理,若无意中侵犯到您的权利,敬请告之(QQ:2390986128)敬请告之,我们将在48小时内删除。知识产权声明】【★下载说明★】

全站地图