HTML语言源代码实例.doc

资源ID：56705572 资源大小：66KB 全文页数：26页
资源格式： DOC 下载积分：20金币

快捷下载

会员登录下载

微信登录下载

三方登录下载：

微信扫一扫登录

下载资源需要20金币

邮箱/手机：
温馨提示：	快捷下载时，用户名和密码都是您填写的邮箱或者手机号，方便查询和重复下载（系统自动生成）。如填写123，账号就是123，密码也是123。
支付方式：
验证码：	换一换

账号：
密码：
验证码：	换一换
当日自动登录忘记密码？

友情提示

1、下载资料失败解决办法

2、PDF文件下载后，可能会被浏览器默认打开，此种情况可以点击浏览器菜单，保存网页到桌面，就可以正常下载了。

3、本站不支持迅雷下载，请使用电脑自带的IE浏览器，或者360浏览器、谷歌浏览器下载即可。

4、本站资源下载后的文档和图纸-无水印,预览文档经过压缩，下载后原文更清晰。

5、试题试卷类文档，如果标题没有明确说明有答案则都视为没有答案，请知晓。

网站客服

侵权投诉

HTML语言源代码实例.doc

HTML语言源代码实例1. 第一个HTML示例<html><head><title>第一个HTML示例</title></head><body>HTML的基本结构。</body></html>2. 换行标签<br><html><head><title>测试换行标签</title></head><body>铜陵学院 <br>电教中心<br>授课教师李平<br></body></html>3. 强制不换行标签<nobr> </nobr><html><head><title>测试强制不换行标签</title></head><body>黄鹤楼<br><br><nobr>昔人已乘黄鹤去，此地空余黄鹤楼。黄鹤一去不复返，白云千载空悠悠晴川历历汉阳树，芳草萋萋鹦鹉洲。日暮乡关何处是？</nobr>烟波江上使人愁。</body></html>4. 自动换行标签<wbr> </wbr><html><head><title>测试自动换行标签</title></head><body>风中，花儿谢了<br><br><wbr>凄怜的娇花在悲凉的秋风中，从曾经绚烂娇媚的枝梢，轻曼着彩蝶般的舞姿，漫天飞洒，一片片无奈地落在那冰冷森寒的风刃之上。于是，万千飞舞的蝶便化成纷扬的花絮，轻盈地随风而起，又随风飘得很远、很远。</wbr></body></html>5. 分段控制标签<p> </p><html><head><title>测试分段控制标签</title></head><body><p>花儿什么也没有。它们只有凋谢在风中的轻微、凄楚而又无奈的吟怨，就像那受到了致命伤害的秋雁，悲哀无助地发出一声声垂死的鸣叫。</p><p align=left>或许，这便是花儿那短暂一生最凄凉、最伤感的归宿。</p><p align=center>而美丽苦短的花期</p><p align=right>却是那最后悲伤的秋风挽歌中的瞬间插曲。</p>万千飞舞的蝶便化<p>成纷扬<br>的花絮</body></html>6. 原样显示文字标签<PRE><html><HEAD><TITLE>测试原样显示文字标签</TITLE></HEAD><BODY><pre> 列表标签文档中的列表是很重要的，它将使文档一目了然，在HTML中的列表分为无序列表和有序列表。有序列表与无序列表类似，但项目符号为序号数字。</PRE></BODY></html>7. 居中对齐标签<CENTER > </CENTER><html><HEAD><TITLE>测试居中对齐标签</TITLE></HEAD><BODY><PRE><CENTER>关山月明月出天山，苍茫云海间。长风几万里，吹度玉门关。汉下白登道，胡窥青海湾。由来征战地，不见有人还。戌客望边色，思归多苦颜。高楼当此夜，叹息未应闲。</CENTER></PRE></BODY></html>8. 水平分隔线标签<hr><html><HEAD><TITLE>测试水平分隔线标签</TITLE></HEAD><BODY><CENTER>天津公安警官职业学院 <HR color="red"></CENTER><PRE>侦察系<hr size="6">网络专业<hr width="40%" color=green>网页设计与制作<hr width=60 align="left">HTML超文本语言<hr size="120"width=3 align=center color=green ></PRE></body></html>说明：“像素”是屏幕上的一个逻辑点，是图像显示的最小单位。电子枪通过屏幕网罩的小孔打到荧光屏上由三个荧光点（RGB）组成的一个小点称为物理点。在某种显示方式下，包含一个或多个物理点的最小显示单位称为逻辑点。9. 设定背景和文字的颜色<BODY BGCOLOR=><html><HEAD><TITLE>设定网页背景和文字的颜色</TITLE></HEAD><body BGCOLOR=red text="green"><CENTER><Pre>春夜喜雨<hr>好雨知时节，当春乃发生。随风潜入夜，润物细无声。</PRE></CENTER></BODY></html>10. 设定各级标题<Hn> </Hn><HTML><HEAD><TITLE>设定各级标题</TITLE></HEAD><BODY><H1 ALIGN="CENTER">一级标题。</H1><H2>二级标题。</H2><H3>三级标题。</H3><H4>四级标题。</H4><H5 ALIGN="RIGHT">五级标题。</H5><H6 ALIGN="RIGHT">六级标题。</H6></BODY></HTML>11. 控制文字的格式<font><html><head><title>控制文字的格式</title></head><body><center><pre><font face=黑体 size=7 color="red" > 天津公安警官职业学院</font> </center><font face=隶书 size=5 color="green">多媒体网页制作</font><font face=楷体 size=4 color="#00ffff">第二章 HTML超文本标记语言</font></pre></body></html>12. 特殊文字样式<html><head><title>字体的物理类型</title></head><body><b>这些文字是粗体的</b> <br><i>这些文字是斜体的</i> <br> <u>这些文字带有下划线</u></body></html>13. 列表元素文档中的列表是很重要的，它将使文档一目了然，在HTML中的列表分为无序列表和有序列表。无序列表：<UL元素和LI元素>ul元素可用于创建一个以圆点等项目开始的无序列表，列表中的每一项用li加以识别<html><HEAD><TITLE>无序列表的使用</TITLE></HEAD><BODY><UL ><LI>天津公安警官职业学院<LI>电教中心<LI>授课教师：李平<LI>授课内容HTML标记语言<HR width=200 align="left"color=green ><LI>无序列表</UL></BODY></html>有序列表：<OL元素和LI元素>有序列表与无序列表类似，但项目符号为序号数字。<html><head><title>有序列表的使用</title></head><body><ol type=A start=4 ><LI>天津公安警官职业学院<LI>电教中心<LI>授课教师：李平<LI>授课内容HTML标记语言<LI>有序列表<hr width="40%" align="left" color=red ></ol></body></html>嵌套列表<HTML><HEAD><TITLE>嵌套列表</TITLE></HEAD><body bgcolor="green"><ol><LI>天津公安警官职业学院<LI>电教中心 <ul type=square > <LI>授课教师：李平 <LI>授课内容HTML标记语言 </ul><HR color=red></ol><ol type=a start=2 ><LI>无序列表<LI>有序列表<ol type=I start=2><LI>嵌套列表</ol></ol></body></html>14. 空格标签 &nbsp<html><head><title>空格方法</title></head><body><p>花儿什么也没有。它们    只有凋谢在风中的轻微、凄楚而又无奈的吟怨，就像那受到了致命伤害的秋雁，悲哀无助地</p>  发出一声声垂死的鸣叫。</body></html>15. 上下标<sup>标签：用来表示上标签。<sub>标签：用来表示下标签。<html><HEAD><TITLE>上下标标签 </TITLE></HEAD><BODY>12<sup>2</sup>=144<p>(1111)<sub>2</sub></BODY></html>16. 超链接<HTML><HEAD><TITLE>超级链接</TITLE></head><body><CENTER><h3>天津公安警官职业学院</h3><a HREF="jy1.html">著名高校网址</a><BR></CENTER></body></HTML>注：建立超链接的标签为<a>和</a>格式：<a href=链接位置>超链接名称</a>如果需要链接的文件放在同一台机器的同一个目录下，这属于最简单的本地链接，在链接文件时只需写文件名而不需要写文件的路径，但是，要链接的文件若放在不同的目录下进行链接时，则必须写明文件路径。路径名的写法有两种，相对路径和绝对路径。17. 超链接实现发送邮件<HTML><HEAD><TITLE>发送邮件</TITLE></head><body><CENTER><h3>天津公安警官职业学院</h3><a HREF=mailto:liping >给我写信</a><BR></CENTER></body></HTML>格式：<a href=mailto:邮件地址 subject=邮件主题>描述文字</a>18. 背景音乐<html><HEAD><TITLE>背景音乐</TITLE><bgsound src=aa.mp3 loop=1 ></HEAD><BODY><pre>背景音乐的歌名是“隐形的翅膀”</pre></BODY></html>注：src 是声音文件的路径，loop是设置循环播放的意思。19. 插入多媒体文件<html><HEAD><TITLE>插入多媒体文件</TITLE></HEAD><BODY><embed src=aa1.mp3 autostart=false loop=true width=200 height=200></BODY></html>注：embed 是嵌入文件的意思，src 是声音文件的路径，autostart=true 是自动播放/ false是停止播放，loop=true是循环播放的意思，width和height是设置播放器大小的意思。20. 背景图像的设定<html><HEAD><TITLE>用平铺图像作为背景</TITLE></HEAD><body background=tx.gif> <PRE><CENTER><h1>天津公安警官职业学院</h1><h3>电教中心</h3>授课教师：<font face=隶书 size=6 color=red>李平</font>授课内容HTML标记语言</CENTER></PRE></body></html>21. 网页中插入图像<html><HEAD><TITLE>在网页中插入图像</TITLE></HEAD><body > <CENTER><h2>网页制作教材</h2><a HREF=#><img src=dw1.jpg alt=这幅图像好看吗？></CENTER></body></html>注：<img>是单独标签。格式：< img src=图像文件名alt=” “ width=” “ height=” “>属性alt表示显示图像替代文字、width和height是设置图像大小。如果图像的显示有问题，应该检查以下方面：1.文件名是否书写正确；2. 图像文件是否是 .BMP.GIF.JPG格式。22. 表格标签在HTML中，建立表格将使用四个标签<table></table>，<tr></tr>，<th></th>，<td> </td>下面是四个标签的说明。1.定义表格标签<table></table><table>标签用于定义一个表格元素，一个表格元素是由多个横行（<tr>）、单元格（<td>）和表头单元格（<th>）子元素所组成的。2. 定义表格行标签<tr></tr><tr>标签用于定义表格的一行。在一组<tr>标签内可建立一行表格，也可以包含多组由<td>或<th>标签所定义单元格。3. 定义表头标签<th></th><th>标签用于定义一个表格内的表头单元格，此单元格中的文字将以粗体的方式显示。在创建表格中也可以不使用<th>定义表头单元格。4.定义单元格标签<td></td><td>标签用于定义表格的单元格。一组<td>标签将建立一个单元格。<td>标签必须放在<tr>标签内。注意：在一个最基本的表格元素中必须包含一组<table>标签，一组<tr>标签，一组<td>标签。<table border=> border属性的参数值是数字，此属性用于设置表格边框尺寸。 <html><HEAD><TITLE>一个简单的表格</TITLE></HEAD><body > <CENTER><font face=隶书 size=5 color="red" ><b>学生名单</font></b><br> <table border=2><tr><th>姓名</th><th>性别</th><th>年龄</th><th>专业</th></tr><tr><td>王强</td><td>男</td><td>19</td><td>计算机</td></tr><tr><td>张红</td><td>女</td><td>18</td><td>网络</td></tr></CENTER></table></body></html>23. 网页特效举例：在许多网站中，常常在第一个网页的画面停留几秒后，就自动切换到另一个网页。这个技巧就是利用<meta>标签，然后将http-equiv属性设置为refresh(表示自动更新)，并在content属性中指定秒数和自动更新所显示的网页地址。格式：< meta http-equiv=”refresh” content=”秒数 url=网页”><HTML><head><TITLE>网页自动切换</TITLE><meta http-equiv=refresh content=”3; url=jy1.html”></head><body><H4>本网站正在升级</H4><HR><h4>3秒之后将自动切换到高校网。</h4></body></HTML>24. 注释标签<！><html><HEAD><TITLE>注释标签</TITLE></HEAD><BODY><! 这是用脚本语言编写的程序><p align=CENTER ><STYLE>A.menuitem COLOR: menutext; TEXT-DECORATION: noneA.menuitem:hover COLOR: highlighttext; BACKGROUND-COLOR: highlightDIV.contextmenu BORDER-RIGHT: 2px outset; BORDER-TOP: 2px outset; Z-INDEX: 999; VISIBILITY: hidden; BORDER-LEFT: 2px outset; BORDER-BOTTOM: 2px outset; POSITION: absolute; BACKGROUND-COLOR: buttonface</STYLE><SCRIPT language=JavaScript>function Year_Month() var now = new Date(); var yy = now.getYear(); var mm = now.getMonth()+1; var cl = '<font color="#0000df">' if (now.getDay() = 0) cl = '<font color="#c00000">' if (now.getDay() = 6) cl = '<font color="#00c000">' return(cl + yy + '年' + mm + '月</font>'); function Date_of_Today() var now = new Date(); var cl = '<font color="#ff0000">' if (now.getDay() = 0) cl = '<font color="#c00000">' if (now.getDay() = 6) cl = '<font color="#00c000">' return(cl + now.getDate() + '</font>'); function Day_of_Today() var day = new Array(); day0 = "星期日" day1 = "星期一" day2 = "星期二" day3 = "星期三" day4 = "星期四" day5 = "星期五" day6 = "星期六" var now = new Date(); var cl = '<font color="#0000df">' if (now.getDay() = 0) cl = '<font color="#c00000">' if (now.getDay() = 6) cl = '<font color="#00c000">' return(cl + daynow.getDay() + '</font>'); function CurentTime() var now = new Date(); var hh = now.getHours(); var mm = now.getMinutes(); var ss = now.getTime() % 60000; ss = (ss - (ss % 1000) / 1000; var clock = hh+':' if (mm < 10) clock += '0' clock += mm+':' if (ss < 10) clock += '0' clock += ss; return(clock); function refreshCalendarClock() document.all.calendarClock1.innerHTML = Year_Month(); document.all.calendarClock2.innerHTML = Date_of_Today(); document.all.calendarClock3.innerHTML = Day_of_Today(); document.all.calendarClock4.innerHTML = CurentTime(); var webUrl = webUrl; document.write('<table border="0" cellpadding="0" cellspacing="0"><tr><td>'); document.write('<table id="CalendarClockFreeCode" border="0" cellpadding="0" cellspacing="0" width="60" height="70" ');document.write('style="position:absolute;visibility:hidden" bgcolor="#eeeeee">');document.write('<tr><td align="center"><font ');document.write('style="cursor:hand;color:#ff0000;font-family:宋体;font-size:14pt;line-height:120%" ');if (webUrl != 'netflower') document.write('</td></tr><tr><td align="center"><font '); document.write('style="cursor:hand;color:#2000ff;font-family:宋体;font-size:9pt;line-height:110%" '); document.write('</td></tr></table>'); document.write('<table border="0" cellpadding="0" cellspacing="0" width="61" bgcolor="#C0C0C0" height="70">');document.write('<tr><td valign="top" width="100%" height="100%">');document.write('<table border="1" cellpadding="0" cellspacing="0" width="58" bgcolor="#FEFEEF" height="67">');document.write('<tr><td align="center" width="100%" height="100%" >');document.write('<font id="calendarClock1" style="font-family:宋体;font-size:7pt;line-height:120%"> </font><br>');document.write('<font id="calendarClock2" style="color:#ff0000;font-family:Arial;font-size:14pt;line-height:120%"> </font><br>');document.write('<font id="calendarClock3" style="font-family:宋体;font-size:9pt;line-height:120%"> </font><br>');document.write('<font id="calendarClock4" style="color:#;font-family:宋体;font-size:8pt;line-height:120%"><b> </b></font>');document.write('</td></tr></table>');document.write('</td></tr></table>'); document.write('</td></tr></table>'); setInterval('refreshCalendarClock()',1000);</SCRIPT><p>    用脚本语言编写的程序可直接运行，不用服务器的支持。</BODY></html>

注意事项

本文（HTML语言源代码实例.doc）为本站会员（飞****2）主动上传，淘文阁 - 分享文档赚钱的网站仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对上载内容本身不做任何修改或编辑。若此文所含内容侵犯了您的版权或隐私，请立即通知淘文阁 - 分享文档赚钱的网站（点击联系客服），我们立即给予删除！

温馨提示：如果因为网速或其他原因下载失败请重新下载，重复下载不扣分。