网站设计:20个常用技巧

简介: 这是一篇关于网站设计技巧的分享文章,涵盖了20多个实用的小技巧,包括设置浏览器兼容性、禁用右键和复制功能、自定义图标、防止页面被另存为、删除确认提示、获取控件位置、光标定位、屏蔽功能键等。这些技巧适用于前端开发,能够提升网页的功能性和用户体验。欢迎补充更多实用技巧!

一些网站设计的技巧分享,欢迎各位大佬补充分享

1.不管是IE那个版本都规定为IE8使用

    <meta http-equiv="X-UA-Compatible" content="IE=8"/>

2. 关闭自动完成功能

      <input  id="Text1" autocomplete="off" type="text"/>

3. 将彻底屏蔽鼠标右键

    oncontextmenu="window.event.returnValue=false" 

4. 取消选取、防止复制

    <body onselectstart="return false">

5. 不准粘贴

    onpaste="return false"

6. 防止复制

    oncopy="return false;" oncut="return false;"

7. IE地址栏前换成自己的图标

    <link rel="Shortcut Icon" href="favicon.ico">

8. 可以在收藏夹中显示出你的图标

    <link rel="Bookmark" href="favicon.ico">

9. 关闭输入法

    <input style="ime-mode:disabled">

10. 永远都会带着框架

    <script language="JavaScript"><!--if (window == top)top.location.href ="frames.htm"; //frames.htm为框架网页 // --></script>

11. 防止被人frame

    <SCRIPT LANGUAGE=JAVASCRIPT><!--if (top.location != self.location)top.location=self.location; // --></SCRIPT>

12. 网页将不能被另存为

    <noscript><iframe src="/blog/*.html>";</iframe></noscript>

13. 查看网页源代码

    <input type=button value=查看网页源代码 onclick="window.location = "view-source:"+ "http://www.baidu.com/"">

14.删除时确认

    <a href="javascript:if(confirm("确实要删除吗?"))location="boos.asp?&areyou=删除&page=1"">删除</a>
    <a href="a.aspx?act=del&id=1" onclick="return confirm('确认删除文件吗?')">删除</a>

15. 取得控件的绝对位置

    //Javascript <script language="Javascript">function getIE(e){ var t=e.offsetTop; var l=e.offsetLeft; 
    while(e=e.offsetParent) alert("top="+t+"/nleft="+l); } </script>

    //VBScript <script language="VBScript"><!--function getIE() dim t,l,a,b set a=document.all.img1 
    t=document.all.img1.offsetTop l=document.all.img1.offsetLeft
     while a.tagName<>"BODY"set a = a.offsetParent t=t+a.offsetTop l=l+a.offsetLeft wendmsgbox 
    "top="&t&chr(13)&"left="&l,64,"得到控件的位置"end function--></script>

16. 光标是停在文本框文字的最后

    <script language="javascript">function cc() { var e = event.srcElement; var r =e.createTextRange();
     r.moveStart("character",e.value.length); 
    r.collapse(true); r.select(); } </script> <input type=text name=text1 value="123" onfocus="cc()">

17.屏蔽功能键Shift,Alt,Ctrl

    <script>function look(){ if(event.shiftKey) alert("禁止按Shift键!"); //可以换成ALT CTRL } document.onkeydown=look; </script>

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

    <body onblur="this.focus();">

19.怎样去掉图片链接点击后,图片周围的虚线?

    <a href="#" onFocus="this.blur()"><img src="/blog/logo.jpg" border=0></a>

20.脚本永不出错

    <SCRIPT LANGUAGE="JavaScript"><!-- Hide function killErrors() { returntrue; } window.onerror = killErrors; // --> </SCRIPT>
相关文章
|
6月前
|
前端开发 JavaScript 安全
剖析跨域问题始末及其解决方案——前端必备交叉知识(一)
跨域问题是前端开发中的常见挑战,了解并掌握不同的跨域解决方案能帮助你更高效地进行开发工作。本文对同源策略、跨域以及解决跨域的三种方案: CORS、JSONP、代理等跨域技术进行了介绍。选择合适的跨域解决方案非常重要。 在实际开发中,推荐优先考虑使用 CORS,因为它是现代浏览器支持的标准,且安全性较高。如果服务器无法修改,则可以考虑使用代理。如果是特殊情况,可以使用 JSONP,但要注意安全性。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错
|
5月前
|
数据采集 Web App开发 iOS开发
Python 爬虫如何伪装 Referer?从随机生成到动态匹配
Python 爬虫如何伪装 Referer?从随机生成到动态匹配
|
4月前
|
小程序 前端开发 Android开发
小程序微信分享功能如何开发?开放平台已绑定仍不能使用的问题?-优雅草卓伊凡
小程序微信分享功能如何开发?开放平台已绑定仍不能使用的问题?-优雅草卓伊凡
850 29
小程序微信分享功能如何开发?开放平台已绑定仍不能使用的问题?-优雅草卓伊凡
|
5月前
|
人工智能 运维 Serverless
OpenManus:开源版 Manus,无需邀请码,5 分钟极速体验!
OpenManus 是一款基于多智能体协作的开源自动化系统,能将复杂任务拆解为可执行子流程。通过多智能体机制分解任务、协调工具调用,实现代码执行、文件处理、网络搜索等复杂操作。本方案基于函数计算 FunctionAI 开发平台和阿里云百炼模型服务,提供一键部署方案,让企业无需过多运维投入即可获得灵活透明的智能任务处理能力。方案具备三大核心优势:Serverless 架构降本、实时反馈与透明化、模块化自由组合,支持快速接入多种功能模块。用户可通过简单步骤获取 API-KEY 并完成部署,体验 AI 自动化任务处理。
|
5月前
|
数据采集 XML 存储
Headers池技术在Python爬虫反反爬中的应用
Headers池技术在Python爬虫反反爬中的应用
|
5月前
|
数据采集 JSON 搜索推荐
AI+代理IP手把手教你爬取某度
AI+代理IP手把手教你爬取某度
183 0
|
5月前
|
Linux Windows
幻兽帕鲁服务端性能优化mod
这是一个非官方的《PalWorld》服务器Mod,主要用于修复内存泄漏和高CPU负载问题。目前可能存在未知Bug,建议备份游戏数据后自行测试。下载后,根据系统不同,替换对应路径下的文件即可使用。Windows路径为`PalServer\Pal\Binaries\Win64\`,Linux路径为`pal\pal\binaries\Linux\`。更多详情可访问Github或哔哩哔哩提供的下载地址。
150 9
|
5月前
|
文字识别 BI
【工具教程】批量PDF和图片OCR识别指定区域文字自动改图片名字,多个区域一次性批量识别改名批量重命名
本内容介绍了一款用于企业档案、医院病历及办公文件管理的图片和PDF文字识别工具。通过框选识别区域,软件可批量提取关键信息,实现文件重命名或导出为表格,极大提升管理效率。支持图片与PDF两种模式,操作简单,适用于合同、病历、报告等场景。提供详细步骤指导,包含区域设置、文件导入、批量处理及结果校验等功能。
686 8
|
7月前
|
Cloud Native 关系型数据库 分布式数据库
世界第一!阿里云PolarDB刷新全球数据库性能及性价比记录
世界第一!阿里云PolarDB刷新全球数据库性能及性价比记录
|
6月前
|
编解码 人工智能 安全
快来试试这个开箱即用的万相2.1服务!!!
阿里云万相2.1系列提供高效灵活的视频生成解决方案,支持文生视频、图生视频等多模态任务。通过阿里云计算巢与ComfyUI推出的快速视频生成服务,用户可轻松制作微电影或短视频。针对长视频生成,提供了三种方法:使用高性能显卡、首尾帧拼接和补帧模型。此外,还内置工作流实现文生图和图生图功能,简单易用。部署说明及使用流程详细列出,方便开发者快速上手。访问计算巢了解更多有趣服务。