网页制作技巧及常用代码集锦

最新推荐文章于 2024-04-24 15:08:33 发布
最新推荐文章于 2024-04-24 15:08:33 发布
阅读量337 收藏
点赞数
分类专栏： HTML 文章标签： dreamweaver javascript insert border function 框架
  ◇如何在网页中加入单个或几个空格？
◆在源代码中输入&nbsp，每个&nbsp之间请用空格分开。
◆在Dreamweaver中用<CTRL>+<SHIFT>+<SPACE>插入空格或任输几个字符，然后将其色彩设成背景的色彩！

◇如何在网页中加入书签，在页面内任意跳转？
◆在源代码中需要插入书签的地方输入<a name="top"></a>，在调用的地方输入<a href="#top">Top</a>，其中的top是你设定的书签名字。
◆在Dreamweaver中用菜单的「Insert」-「Name Anchor」命令插入书签，调用时，在Link中输入#top，top为书签名。

◇如何在网页中加入书签，在多个页面之间任意跳转？
◆方法与上面类似，不过做链接时要在书签名前加上网页文件名，如：other.htm#top，这样一来就会跳转到other.htm页面中的top书签处。

◇将网页加入收藏夹？
◆请使用如下代码：（注意标点符号）
< a href=''#'' onclick="window.external.addFavorite(''http://qiangwei.126.com'',''【梦想天空】qiangwei.126.com 各种网页工具教程DW、FLASH、FIREWORKS及CGI教学、聊天交友……'')" target="_top">将本站加入收藏夹< /a>

◇如何去掉链接的下划线？
◆在源代码中的<HEAD>…</HEAD>之间输入如下代码：
<style type="text/css"> <!--
a { text-decoration: none}
--> < /style>
◆在Dreamweaver中用「Text」-「Custom Style」-「Edit Style Sheet」-「New」-Redefine HTML Tag中选择a，然后在decoration中选中none

◇如何将网页定时关闭？
◆在源代码中的<BODY>后面加入如下代码：
< script LANGUAGE="JavaScript"> <!--
setTimeout(''window.close();'', 60000);
--> < /script>
在代码中的60000表示1分钟，它是以毫秒为单位的。

◇如何设置命令来关闭打开的窗口？
◆在源代码中加入如下代码：
< a href="/" onclick="javascript：window.close(); return false;">关闭窗口< /a>

◇如何制作电子邮件表单？
◆在<FORM>中输入Action="youremail@XXX.XXX" ，提交采用POST方法。

◇如何自动加入最后修改日期？
◆在源代码中的<BODY>…< /BODY>之间加入如下代码：
< Script Language="JavaScript"><!--
document.write("Last Updated:"+document.lastModified);
-->< /Script>

◇如何在网页中加入EMAIL链接并显示预定的主题？
◆代码：< a href="mailto:yourmail@xxx.xxx?Subject=你好">Send Mail< /a>

◇如何让背景图象不滚动？
◆代码：<BODY Background="bg.gif" Bgproperties="fixed" >
◆在Dreamweaver中用「Text」-「Custom Style」-「Edit Style Sheet」-「New」-Redefine HTML Tag中选择Body，然后在Background中的Attachment里选fixed

◇如何避免别人将你的网页放入他的框架（FRAME）中？
◆在源代码中的<HEAD>…< /HEAD>之间加入如下代码：
<script language="javascript"><!--
if (self!=top){top.location=self.location;}
-->< /script>

◇如何在网页中加入注释？
◆代码：< !-- 这是注释 -->

◇如何定义网页的关键字（KeyWords）？
◆格式如下：
< meta name="keywords" content="dreamweaver,flash,fireworks">
content中的即为关键字，用逗号隔开
◆在Dreamweaver中用「Insert」-「Head」-KeyWords命令

◇如何为不支持框架的浏览器指定内容？
◆在源代码中加入下面代码：
< BODY><noframes>本网页有框架结构，请下载新的浏览器观看< /noframes></ BODY>

◇如何使表格（TABLE）没有边框线？
◆将表格的边框属性：border="0"

◇如何隐藏状态栏里出现的LINK信息？
◆请使用如下代码：
 < a href="http://xx.com" onMouseOver="window.status=''none'';return true">梦想天空< /a>

◇如何为网页设置背景音乐？
◆代码：< EMBED src="music.mid" autostart="true" loop="2" width="80" height="30" >
src：音乐文件的路径及文件名；
autostart：true为音乐文件上传完后自动开始播放，默认为false（否）
loop：true为无限次重播，false为不重播，某一具体值（整数）为重播多少次
volume：取值范围为"0-100"，设置音量，默认为系统本身的音量
starttime："分：秒"，设置歌曲开始播放的时间，如，starttime="00:10"，从第10开始播放
endtime： "分：秒"，设置歌曲结束播放的时间
width：控制面板的宽
height：控制面板的高
controls：控制面板的外观
controls="console/smallconsole/playbutton/pausebutton/stopbutton/volumelever"
·console：正常大小的面板
·smallconsole：较小的面板
·playbutton：显示播放按钮
·pausebutton：显示暂停按钮
·stopbutton：显示停止按钮
·volumelever：显示音量调节按钮
hidden：为true时可以隐藏面板

◇如何定时载入另一个网页内容？
◆在源代码中的<HEAD>…< /HEAD> 加入如下代码：
< meta http-equiv="refresh" content="40;URL=http://xx.com " >
40秒后将自动载入http://xx.com所在的网页

◇图片的变亮效果
◆一、在</head>后面放入以下代码：
<SCRIPT language="JavaScript1.2">
<!--
function high(which2){theobject=which2
highlighting=setInterval("highlightit(theobject)",50)}function low(which2){clearInterval(highlighting)
which2.filters.alpha.opacity=40}function highlightit(cur2){if(cur2.filters.alpha.opacity<100)
cur2.filters.alpha.opacity+=10
else if(window.highlighting)
clearInterval(highlighting)}//--></SCRIPT>
◆二、在需要应用的地方如下使用：
<IMG
onmouseover=high(this) style="FILTER: alpha(opacity=40)"
onmouseout=low(this) src="（你的图片文件名）" border=0 >


◇自动弹出页面

◆将下面的代码放在<head>与</head>之间。

<script language="JavaScript">
<!--
var gt = unescape(''%3e'');
var popup = null;
var over = "Launch Pop-up Navigator";
popup = window.open('''', ''popupnav'', ''width=200,height=170,resizable=1,scrollbars=auto'');
if (popup != null) {
if (popup.opener == null) {
popup.opener = self;
}
popup.location.href = ''新窗口的文件名.htm'';
}
// --></script>

yuest709
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
200多个网页设计常用技巧代码
09-14
从中很快了解网页的相关设计技巧，让你更快的掌握心得，全面、深入，通俗易懂。很不错的...
js调用cmd命令行，执行后自动关闭命令窗口
02-12 1万+
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=gb2312" /&gt; &lt;title&gt;测试php+js调用cmd命令行&lt;/title&gt;
【HTML】命令大全（常用的命令解析）
five小点心的博客
11-26 7520
什么是HTML？HTML的英文全称是Hyper Text Marked Language，即超文本标记语言。所谓超文本，就是比文本的功能更加全面，包含了我们常见的文字、图片、音频、视频、超链接等。在HTML文本文件中，同样能存放标题、文本框、选项等内容。那标记又是什么呢？标记是HTML用自己的语法规则，把文本内容给包裹起来，就叫做标记。一般由尖括号包含关键词，如就是一个标记。
如何使用html制作网页
热门推荐
2301_76469377的博客
07-10 1万+
超文本指的是超链接，标记指的是标签，是一种用来制作网页的语言，这种语言由一个个的标签组成，这种语言制作的文件保存的是一个文本文件，文件的扩展名为 .html 或者 .htm。HTML文本的结构包括“头”部分（head）、和“主体”部分（body），其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容 ，它的标记语法是以“<”和">"，主要有两种形式的标签，分别是双标签（<标签名字>标签内容<标签名字>）和单标签（<标签名字/>）。<p>HTML称为超文本标记语言，是一种标识性的语言。
如何编写一个基础HTML网页
一直豚桑的博客
04-20 2863
你可以使用< p > < img src = “文件名” width = “500” > < /p >来放入图片。把你要写在网页中的东西全部都输入编辑器中，确认所有内容都在< body >和< /body >标签之间。（小编提示：如果你需要修改错误，请切记保存好网页，并重新把他加载到浏览器中。·在Mac操作系统中，从应用程序中找到文本编辑器，点击格式选择，制作纯文本。4.如果你要是用图片，需要将他于你的HTML文件放在同一个文件夹中，·在Windows操作系统中，使用记事本程序，将文件保存为文档。
网页设计常用的一些技巧
01-19
–脚本说明： 把如下代码加入<body>区域中:–> <form> <p> <input type=”button” value=”返回” name=”button” class=”pt9″> <input TYPE=”button” NAME=”view” value=”...
总结网页代码常用小技巧,网页制作必学
07-29
总结网页代码常用小技巧,网页制作必学
Html网页代码常用小技巧总结续,网页制作学习.docx
12-22
Html网页代码常用小技巧总结续,网页制作学习.docx
网页制作常用代码
05-27
零基础掌握简单的网页制作技巧，掌握网页制作常用代码，就可以轻松制作网页了。
制作网页命令
07-05
制作网页命令,小全。请大家踊跃下载！我的积分就靠你们了。
网站建设代码大全：网页制作常用代码
03-03
网站建设代码大全：网页制作常用代码.Dreamweaver网页制作常用代码，网页制作热潮的兴起，Dreamweaver 得到了广泛的应用
DreamweaverCS5各种代码大全
06-11
DreamweaverCS5各种代码大全
HTML5常用命令-零基础
05-10
这份文件是国外一个学习网站上免费提供的，虽然是英文的，但是命令都很清楚，希望有帮助
网页设计html代码大全
02-07
文档对学习网页设计的人很有帮助，里面的HTML代码比较全面，学习时可供查阅，希望能对你学习网页设计有所帮助
DW前端代码汇总
HCTLTCT的博客
04-29 9615
DW前端代码汇总 ==============================前端代码============================ ------------------------------------*标签*--------------------------------- <button></button>--按钮标签 <ul></ul>---段落标签 <u></u>--下划线 <link r...
dw常用标签_Dreamweaver代码大全DW常用代码
weixin_39703551的博客
12-21 3461
Dreamweaver代码大全Dreamweaver代码基本结构标签:,表示该文件为HTML文件包含文件的标题,使用的脚本,样式定义等---,包含文件的标题,标题出现在浏览器标题栏中,的结束标志放置浏览器中显示信息的所有标志和属性,其中内容在浏览器中显示.,的结束标志,的结束标志其它主要标签,以下所有标志用在中:…">,链接标志,"…"为链接的文件地址,src="…">,显示图片标志...
网页设计常用的博客代码
06-18
网页博客的梅花美化常用的代码很好用，喜欢美化自己的博客的人请拿走吧
【Webgl_glsl&Threejs】搬运分享shader_飘落心形
最新发布
qq_61834461的博客
04-24 236
将shadertory上的代码转成了threejs可以直接用的代码，引入文件的material，并在创建mesh或已有物体上使用material即可，使用时请注意uv对齐。
qq音乐网页制作代码
11-21
根据提供的引用内容，我们可以了解到QQ音乐网页的设计和布局思路。但是，由于版权问题，我们无法提供完整的QQ音乐网页制作代码。不过，我们可以提供一些制作网页的基本知识和技巧，帮助您更好地理解和学习网页制作。 制作网页的基本知识和技巧包括HTML、CSS和JavaScript等。其中，HTML是网页的基础，用于定义网页的结构和内容；CSS用于定义网页的样式和布局；JavaScript用于实现网页的交互和动态效果。 以下是一个简单的HTML代码示例，用于创建一个网页的基本结构： ```html <!DOCTYPE html> <html> <head> <title>网页标题</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="style.css"> </head> <body> <header> <nav> <ul> <li><a href="#">导航链接1</a></li> <li><a href="#">导航链接2</a></li> <li><a href="#">导航链接3</a></li> </ul> </nav> </header> <main> <section> <h1>内容标题1</h1> <p>内容1</p> </section> <section> <h1>内容标题2</h1> <p>内容2</p> </section> </main> <footer> <p>版权信息</p> </footer> </body> </html> ``` 在上面的代码中，`<!DOCTYPE html>`用于声明文档类型；`<html>`标签用于定义HTML文档；`<head>`标签用于定义文档头部，包括网页标题、字符集、视口等信息；`<body>`标签用于定义文档主体，包括网页的内容和结构；`<header>`、`<main>`和`<footer>`标签用于定义网页的头部、主体和底部；`<nav>`、`<ul>`和`<li>`标签用于定义导航栏和链接；`<section>`、`<h1>`和`<p>`标签用于定义网页的内容区域和标题、段落等。 除了HTML之外，CSS也是网页制作中不可或缺的一部分。以下是一个简单的CSS代码示例，用于定义网页的样式和布局： ```css body { font-family: Arial, sans-serif; background-color: #f0f0f0; } header { background-color: #333; color: #fff; padding: 10px; } nav ul { list-style: none; margin: 0; padding: 0; } nav li { display: inline-block; margin-right: 10px; } nav a { color: #fff; text-decoration: none; } section { margin: 20px; padding: 10px; background-color: #fff; box-shadow: 0 0 5px #ccc; } h1 { font-size: 24px; margin: 0 0 10px; } p { font-size: 16px; line-height: 1.5; margin: 0; } ``` 在上面的代码中，`body`用于定义网页的整体样式，包括字体、背景颜色等；`header`用于定义网页的头部样式，包括背景颜色、文字颜色、内边距等；`nav`、`ul`和`li`用于定义导航栏的样式和布局，包括列表样式、外边距、内边距等；`a`用于定义链接的样式，包括文字颜色、下划线等；`section`用于定义网页的内容区域的样式和布局，包括外边距、内边距、背景颜色、阴影等；`h1`和`p`用于定义标题和段落的样式，包括字体大小、行高、外边距等。 除了HTML和CSS之外，JavaScript也是网页制作中常用的一部分。以下是一个简单的JavaScript代码示例，用于实现网页的交互和动态效果： ```javascript var navLinks = document.querySelectorAll('nav a'); for (var i = 0; i < navLinks.length; i++) { navLinks[i].addEventListener('click', function(event) { event.preventDefault(); alert('你点击了导航链接：' + this.textContent); }); } ``` 在上面的代码中，`querySelectorAll`用于选择所有的导航链接；`addEventListener`用于为导航链接添加点击事件；`preventDefault`用于阻止链接的默认行为；`alert`用于弹出提示框，显示点击的链接文本内容。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值