网页设计常用的一些技巧

原创 2007年10月04日 09:34:00

大家可以去我的资源-最新最全的免费资源下载

1.加入收藏,设为首页:

<a href="javascript:window.external.AddFavorite('http://www.asp99.com','Asp99源码中心')">加入收藏</a>

<a
href="#"
onClick="this.style.behavior='url(#default#homepage)';this.setHomePage('http:
//www.asp99.com');">设为首页</a>

2.2秒后关闭当前页:
<script language="JavaScript">
<!--
  setTimeout('window.close();',2000);
-->
</script>

3.IE地址栏前换成自己的图标:
在首页<head></head>之间加上如下代码
<link rel="Shortcut Icon" href="favicon.ico">

4.在收藏夹中显示出你的图标:
在首页<head></head>之间加上如下代码
<link rel="Bookmark" href="favicon.ico">

5.改变滚动条颜色:
在首页<head></head>之间加上如下代码
<style>
body{
scrollbar-face-color:147faf; scrollbar-shadow-color:147faf;
scrollbar-highlight-color:147faf; scrollbar-3dlight-color:ffffff;
scrollbar-darkshadow-color:ffffff; scrollbar-track-color:ffffff;
scrollbar-arrow-color:ffffff;}
</style>

scrollbar-face-color表示滚动条面的颜色
scrollbar-shadow-color表示滚动条右斜面的颜色
scrollbar-highlight-color表示滚动条左斜面的颜色
scrollbar-3dlight-color表示滚动条上边和左边边沿的颜色
scrollbar-darkshadow-color表示滚动下边和右边边沿的颜色
scrollbar-track-color表示滚动条底板的颜色
scrollbar-arrow-color表示滚动条两端箭头的颜色

6.鼠标移到单元格颜色改变:
<table width=200><tr>
<td
bgcolor="#738278" style="cursor:hand"
onMouseOver="this.style.backgroundColor='red'"
onMouseOut="this.style.background='#738278'">移過來</td><
/tr></table>

7.申请按钮的等待:
把如下代码加入<body>区域中
<FORM action=register.cgi
method=post name=agree><CENTER><INPUT name=agreeb
type=submit value="请认真查看<服务条款和声明> (15秒后继续) "><INPUT
onclick=history.back(-1) type=reset value=" 我 不 同 意
"></CENTER></form>
<SCRIPT language=javascript>
<!--
var secs = 15;
document.agree.agreeb.disabled=true;
for(i=1;i<=secs;i++) {
window.setTimeout("update(" + i + ")", i * 1000);
}
function update(num) {
if(num == secs) {
document.agree.agreeb.value =" 我 同 意 ";
document.agree.agreeb.disabled=false;
}
else {
printnr = secs-num;
document.agree.agreeb.value = "请认真查看<服务条款和声明> (" + printnr +" 秒后继续)";
}
}
//-->
</SCRIPT>

8.实现连续滚动:
<body>
<div id=demo style=overflow:hidden;height:60px>
<div id=demo1>
111111111111111<br>
222222222222222<br>
333333333333333<br>
444444444444444<br>
555555555555555
</div>
<div id=demo2></div>
<script>
var t=demo.scrollTop
demo2.innerText=demo1.innerText
function qswhMarquee(){
if(demo2.offsetTop-demo.scrollTop<=0)
demo.scrollTop-=demo1.offsetHeight
else
demo.scrollTop++
}
setInterval(qswhMarquee,30)
</script>
</body>

9.无提示自动关闭窗口:
脚本说明:
第一步:把如下代码加入<body>区域中
<OBJECT
id=closes type="application/x-oleobject"
classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11"><param
name="Command" value="Close"></object>
第二步:把<body>中的内容改为:
<body onload="setTimeout('closes.Click()',20000)">

10.弹出确认删除:
<1>vbscript:
<script language="vbscript">
sub check()
dim a
a=MsgBox("确定要删除吗?",vbOKCancel)
if a=1 then
window.event.returnvalue=true
else
window.event.returnvalue=false
end if
end sub
</script>

<a href="http://www.asp99.com/" onClick="check()">删除</a>

<2>javascript:
<script language="JavaScript1.2">
<!--
function confirmdel(id){
if (confirm("真的要删除吗?"))
window.location.href="/admin_deladmin.asp?id="+id
}
-->
</script>
<a href='javascript:confirmdel("<%=rs("id")%>")'>删除</a>

11.防止点击空链接回到页首端:
把代码“javascript:void(null)”代替原来的“#”标记.

12.window.open的使用语法:
window.open('URL','Name','Features')
name可为空
如:
<a href="javascript:window.open('http://www.asp99.com','','width=400,height=400')">弹出窗口</a>

其中http://www.asp99.com 是你要打开的网页地址。可以使用相对或者是绝对地址,而width=400,height=400 是定义弹出窗口的宽度和高度都是400,其他的几个参数:
toolbar(yes|no): 是否出现浏览器工具栏,在已经设置窗口大小的情况下,默认为no,即不出现!

下同:
location:地址栏
status:状态栏
menubar:菜单条
scrollbars:滚动条
resizable:表示是否出现窗口大小的调整手柄!

结合flash as里边的getURL就是
getURL("javascript:window.open('http://www.asp99.com','','width=400,height=400')")

13.版权声明的写法正确的格式:
&copy;1995-2004 Macromedia, Inc. All rights reserved.
&copy;2004 Microsoft Corporation. All rights reserved.
Copyright &copy; 2004 Adobe Systems Incorporated. All rights reserved.
&copy;1995-2004 Eric A. and Kathryn S. Meyer. All Rights Reserved.

14.内容提交等待:
把如下代码加入<body>区域中
<script language=javascript>
<!--
function showSending() {
sending.style.visibility="visible";
}
-->
</script>

然后调整下面代码的参数使显示提示显示在你想要的位置:
<div id="sending" style="position:absolute; z-index:10; width: 400; visibility:hidden">
<table width=400 height=80 border=0 cellspacing=2 cellpadding=0 bgcolor="#8FA8E9">
<tr>
<td bgcolor=#eeeeee align=center>内容正在发送, 请稍候...</td>
</tr>
</table>
</div>

最后再提交按钮加入 onClick="showSending()">,如:
<input type='submit' name='ACTION' value='发送' onClick="showSending()">


15.实现 iframe 的自适应高度,参考如下代码:

<iframe id="newslist"
name="newslist" width="540" src="/iframenews.htm" marginwidth="1"
marginheight="1" border="0" frameborder="0" target="_self"
style="height:expression(eval(newslist.document.body.scrollHeight))"
>
 

版权声明:本文为博主原创文章,未经博主允许不得转载。

网页设计中常见的几种布局

1.一列布局,使用margin:0 auto属性 代码: 设置自动居中 body{ margin:0; paddi...
  • qlzx_syzx
  • qlzx_syzx
  • 2016年03月19日 09:55
  • 1243

Web前端技术:10个CSS经典技巧

1.CSS字体属性简写规则 一般用CSS设定字体属性是这样做的: font-weight:bold; font-style:italic; font-varient:small-cap...
  • langyuege
  • langyuege
  • 2015年10月24日 16:57
  • 199

单片机设计经验设计技巧集锦

一、机器人常用的单片机使用经验 一 学习单片机的捷径是什么? 所谓捷径就是少走弯路。我刚开始学单片机时走了不少弯路,很多朋友和我都有相似的经历,刚开始接触单片机,面对琳琅满目的图书教材,不...
  • xuqingbo6686
  • xuqingbo6686
  • 2016年03月24日 20:19
  • 1054

15条经验总结,让FPGA设计更简单!

好消息:新年大促!《单片机与嵌入式系统应用》2017全年电子刊合集仅售29.9!欢迎大家进入嵌粉商城购买~ 1、硬件设计基本原则(1)速度与面积平衡和互换原则:一个设计如果时序余量较大,所能跑的频率远...
  • DP29syM41zyGndVF
  • DP29syM41zyGndVF
  • 2018年01月07日 00:00
  • 104

HTML+css及常用网页设计技巧

1.点击某个按钮跳转到该页面 这个时候就不可以简单的在button,submit按钮中添加标签属性了,具体使用如下: 如果我们要给button 按钮增加跳转事件我们可以在它的确onclick事件上点击...
  • Scarlett_geng
  • Scarlett_geng
  • 2015年10月29日 00:03
  • 633

网页设计中文本输入框的一些参数说明 【精华】

在一般的留言本,论坛等地方都要用到文本输入框,也就是html语言中的textarea,textare包含有众多的参数,学会运用这些参数,就可以随意修改文本输入框的大小和外观,达到你想要的效果,下面就来...
  • ILECY
  • ILECY
  • 2016年02月03日 20:37
  • 765

DIV+CSS网页设计常用布局代码

单行一列body{margin:0px;padding:0px;text-align:center;} #content{margin-left:auto;margin-right:auto;widt...
  • EatgirlHui_Unique
  • EatgirlHui_Unique
  • 2015年07月28日 11:49
  • 1040

网页设计当中的常用标签

java script   如内容超出单元格,则隐藏 style="TABLE-LAYOUT: fixed" 让弹出窗口总是在最上面: 不要滚动条? 让竖条没有: 让横条没有: ...
  • sneiiler
  • sneiiler
  • 2014年05月22日 08:27
  • 822

算法设计之五大常用算法设计方法总结

算法设计之五大常用算法设计方法总结 一、【分治法】     在计算机科学中,分治法是一种很重要的算法。字面上的解释是“分而治之”,就是把一个复杂的问题分成两个或更多的相同或相似的子问题,再把子问题...
  • zolalad
  • zolalad
  • 2013年09月08日 19:22
  • 16373

8个SQL语句常用优化技巧

要提高SQL语句的执行效率,最常见的方法就是建立索引,以及尽量避免全表扫描。在本章MySQL教程中,UncleToo给大家整理一些常见的SQL优化技巧,避免全表扫描。一个简单的优化,也许能让你的SQL...
  • csdnstudent
  • csdnstudent
  • 2014年10月23日 15:31
  • 11039
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:网页设计常用的一些技巧
举报原因:
原因补充:

(最多只允许输入30个字)