HTML语言代码范例_第1页
HTML语言代码范例_第2页
HTML语言代码范例_第3页
HTML语言代码范例_第4页
HTML语言代码范例_第5页
免费预览已结束，剩余44页可下载查看

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

1、HTML语言代码A语言结构1 . <!Doctype > 用于定义HTML文件的类型。如：<!DOCTYPEHTML PUBLIC "-/W3C/DTD HTML 4.0 TransitionalEN">表明 DTD(Document Type Definition) 由 W3C 制订，HTML 版本为 4.0,使 用的语言为英语。2 . <HTML> </HTML> 定义HTML文件的开始和结束。3 . <HEAD> </HEAD> 出现在HTML文件的起始部分，用来表明文 件的标题等有关信息。4 .

2、 <BODY> </BODY> BODY元素是HTML文件的主体，可以理解成除标题以外的所有部分。<BODY>标记可以包含的属性有：BODYGROUND :指定一个图像资源作为网页的背景图案；TEXT :取颜色值，设置文本文字的颜色；LINK :取颜色值，设置未被访问过的链接指示文字的颜色；VLINK :取颜色值，设置已被访问过的链接指示文字的颜色；ALINK :取颜色值，设置被用户选中的链接指示文字的颜色；BGCOLOR :取颜色值，设置网页的背景颜色；ONLOAD :事件处理，当打开网页时，事件 ONLOAD发生；ON UNLOAD :当当前网页移去到另

3、一个网页时，事件 ONUNLOAD 发生；基本用法如下：<BODY aLink=#cc0000 bgColor=#fffffflink=#0000ff text=#0f0000 topMargin=5 vLink=#0000aamarginheight="5">B文件头部HTML文件头部位于<HTML> 和<小丁乂1> 之间,内容包括标题名、创 作信息等。1. <BASE> 这是一个单标记，为网页中出现的URL设定相对引用的基路径，必须出现在任何引用外部资源的元素之前，用法如下：<BASEHREF=>2. <

4、ISINDEX>用于在浏览器上建立一个交互索引框。如：<ISINDEXprompt= "搜索输入” >3. <LINK>定义当前文件和另一文件或资源间的链接关系。用法如： <link rel="stylesheet" href="css.css" type="text/css”>4. <META> 用于指明HTML文件自身的一些信息，如文件制作工具、 文件作者等。使用的属性有：Name :指定特性名；Content :指定特性值；http-equiv :定义标记的特性。用法如下：&

5、lt;META NAME= "keywords " CONTENT= "计算机，电脑,微机” >5. <STYLE> 用于定义网页中文档的显示样式，用法如：<style type=" text/css ” > .black FONT-SIZE: 12px; COLOR: #000000</style>6. <TITLE> 列正定义网页的窗口标题，用法如：<TITLE>标题名 </TITLE>7. <SCRIPT>用来在网页中插入 Script脚本。用法如：<s

6、criptlanguage="JavaScript"> function doclock()window.setTimeout("doclock()”,1000) today=newDate self.status=today.toString()</script>C文本标记文档格式1 .属性<BGCOLOR> 背景颜色Black= " #000000 " Green= " #008000 " Silver= "#C0C0C0 "Lime= " #00FF00 &q

7、uot;Gray= " #808080 " Olive= "#808000 " White= " #FFFFFF” Yellow= " #FFFF00 " Maroon= "#800000 " Navy= " #000080 “ Red= " #FF0000 " Blue= " #0000FF Purple= "#800080 " Teal= " #008080 " Fuchsia= "#FF00FF" A

8、qua= #00FFFF ”2 .属性<ALIGN>给元素在浏览器显示中指定对齐方式，属性值可取“ left ” (居左)、“center ” (居中)、"right ” (居右)、 justify二(撑满整行)。3 . <CENTER> </CENTER> 使文本或图像居中。4 落标记1 . <P> . y/P将指定文本作为一个段落，5 于分段2. <BR>强行给文本换行注释<!-内空->引进注释，说明文字标题 <Hn> </Hn> n级标题。其中n的取值可为1,2, ,6, <H

9、1> 是一级标题，字号最大，<H6>是六级标题，字号最小，如：<H4>电脑三维制 作 </H4>字体与字号：1 . <B></B> 指定文本为粗体。2 . <I></I> 指定文本为斜体格式。3 . <U> </U> 指定文本加上下划线。4 . <EM><同>强调某段文字，通常用斜体显示。5 . <STRONG>必丁配粗体显示，强调文本。6 . <TT><"丁 等宽体显示，标准打印机字体。7 . <CODE>

10、; </CODE>将程序代码显示成等宽字体。如：<CODE>int x;x+;</CODE>8 . <KBD>怖口 提示用户应该从键盘输入的文字，浏览器 一般用等宽字体显小09 . <SAMP> </SAMP>样本字体格式，常用于举例，浏览器一般用等宽字体显示。10 . <VAR></VAR> 参数或变量型字体，常显示为斜体。11 . <CITE>次作 书目或报刊杂志的标题引用，通常为斜 体文字。12 . <BLOCKQUOTE> </BLOCKQUOTE> 大段

11、引用，通常为 缩进编排。用法如： <BLOCKQUOTE> 爱因斯坦说过：A=X+Y+Z , A代表 成功一</BLOCKQUOTE>13 . <Q><IQ> HTML4.0新增的标记，给指定文字加上引号， 目前大部分浏览器还不支持<Q>标记。用法如：<Q LANG= " en” >Good Evening! </Q>14 . <DFN></DFN>指定一个术语的定义。15 . <ADDRESS> </ADDRESS>地址型格式，用于地址、签名等，表现为

12、斜体。16 . <PRE> </PRE>预格式化文本，元素<PRE>中的文本在浏览器中会以你键入时的编排格式显示。17 . <SUB> </SUB> 指定文字为下标。18 . <SUP> </SUP> 指定文字为上标。19 . <BIG>小曲大字体文本。20 . <BLINK> </BLINK>设定文本闪烁（只适用于NetscapeNavigator）。 如：<BLINK>此处是闪烁的文本</BLINK>21 . <SMALL> </

13、SMALL>指定一段文字为小字体（比当前字体小一号）。22 . <BASEFONT> 使用size属性，指定文档中文字的基准大小。用法如：<BASEFONT SIZE= " 3" >23 . <FONT> </FONT>规定字体属性，使用的属性有：size、color I?。 用法如：<FONT SIZE=1 COLOR= "#00A0FF ”> 字号 3</FONT>24 . <STRIKE> </STRIKE>指定一段文字在浏览器中显示带删除线。以下是上述元素

14、的一些使用实例。<BASEFONT size=2> <CITE><B>TCP/IP</B></CITE> 是网络中使用的 <FONT size=+1 color=#0000FF>基于软件的 <BIG><EM> 通信协议</EM></BIG></FONT> 。从名字上看<I><SMALL>TCP/IP</SMALL>包括两个协议:</I><SUP >传输控制协议</SUP> 和 <SUB&

15、gt; 网际协议 </SUB> , <STRIKE> 但<VAR>TCP/IP</VAR>远非这两个协议组成的单个实体</STRIKE>,<U> 而是一大批软件程序</U> ,它们提供诸如 <STRONG><FONT size=-1 color="#00A0FF”> 远程登陆、远程文件传输和电子邮件</FONT></STRONG> 等网络服务。浏览器显示如图C-1圉C-1图C-1画水平线<HR> 在浏览器上显示一段水平线。用法如：<HR

16、SIZE=" 5" WIDTH= " 700 " ALIGN= " CENTER” >缩写：1 . <ABBR> -v/ABBR将指定文字标记缩写，缩写形式为字母，用法如：<ABBR TITLE= " World Wide Web ” >WWW</ABBR> 。2 . <ACRONYM> </ACRONYM>将指定文字标记缩写，缩写形式为单词。文档更新：1 . <INS> </INS>当对网页某些内容进行更新时，可以将指定文字标记为插入修改的新内

17、容。2 . <DEL> </£!>当对网页某些内容进行更新时， 可以将指定文字标记为删除的旧内容。模块元素：1 . <DIV>河用于将文本划分成不同的部分， 使用Align属性（值可为left、right和center）为各个段落指定不同的对齐方式。如： <DIV Align="Center">日照香炉生紫烟<BR> 遥看瀑布挂前川</DIV>2 . <SPAN> </SPAN>用于将文本划分成不同的部分， 使用Align属性（值可为left > right和ce

18、nter）为某行文字指定不同的对齐方式或 CLASS属性。 如：<SPAN Align="Center”>日照香炉生紫烟 </SPAN> <SPANAlign="Left" CLASS= " myclass ” > 遥看瀑布挂前川 </SPAN> 列表：1 . <OL> </OL>定义带序号的列表，即有序列表。如：<H3>Internet 介绍</H3> <OL><LI>WWW<LI>HTTP <LI>TCP/I

19、P <LI> 浏览器 </OL>浏览器显示如图C-2图C 22. <UL></UL>定义无序列表，用<LI>定义表项3. <LI>用于定义表项4. <DL> </DL> 与<口口> ffi<DT>元素配合使用，定义项目列表5. <DT> 定义项目，特点是换行和左对齐。以下是<DL> , <DD>和<DT> 的一个应用实例。<DL> <DT>WWW <DD>WWW(World WideWeb的缩

20、写)是一种把Internet上的资源全部连接起来，<DT>HTTP <DD>HTTP(HyperText Transfer Protoco 的缩写)是专门为传输HTML页面的一种网络协议.</DL> 浏览器显示如图C-3I JjlT J图C36. <DD> 定义项目内容，特点是换行、不带记号和缩进左对齐。7. <DIR>仁/口旧建立目录表，作为无序列表，在 HTML中推荐使用<UL>标记。8. <MENU> 定义菜单列表，作为无序列表，在HTML中推荐使用<UL> 标记。D 超文本链接标记1. &l

21、t;A><2 用于创建超文本链接，可以使用的属性有:Href :指定一个url作为有效的链接资源地址。Name :指定一个字符串作为链接时可以使用的位置名称。Target :用于设置所链接的文件显示在指定的窗口。Rel:用来指定源端在当前文件的链接。Rev：用来指定目的端在当前文件的链接，与 Rel 一样，对A元素它们 都不是必须的。以下是<A></A>的一个使用实例。 <p><A href="right.htm"> 我 的主页 </A></p><p><A Href=&qu

22、ot;KeyGif.gif" target="NewWindow"> 作品欣赏 </A></p> <p><A Href=" mailto:"> 最新动态 </A></p> <p></a><A href="">友情链接 </A></p>2. <MAP> </MAP>为客户端的图像映像指定链接。使用的属性为Name。3. <AREA> v/AREA用于定义热

23、区或区域。使用的属性有： Shape :定义形状，属性值可为 rect、circle、polygon 、default 。 Coords :定义一个以逗号分隔的坐标列表。使用形式如下：<IMGSRC="KeyGif.gif' usemap=''#myMAP"><MAPname="myMAP"><AREA shape="circle" coords="30,30,30”href="temp.html"><AREA shape="re

24、ct" coords="10,10,100,100"href="temp.html"> </MAP>E制表元素1 . <CAPTION> </CAPTION>为表格定义一个标题,使用属性 Align指定标题的位置。2 . <TABLE></TABLE> 定义一个表格，可以使用以下属性：Align= " left/right ”：表格在页面白位置。 Border=value :设定边 框的粗细，value取整数，单位为像素。Bordercolor=color :设置边框线

25、颜色。Bordercolordark=color :设定边框的亮度（暗色）。Bordercolorlight=color : 设定边框的亮度（亮色）。 Cellpadding=pixels :设置表元四周格线和数据之间的距离。Cellspacing=pixels :设定两个表元间隙。3 .<TBODY> v/TBODY表格主体段。在一个表格<TABLE>元素中,可以重复出现多次。4 . <TD> <”口>表格数据单元，即表格数据写在 <TD>和</TD>之问。5 . <TFOOT>厅。表格注脚段。6 . <

26、;TH></TH>表格的表头内容。7 .<TR> </TR>指定表格一行，每个<TR>必须包含一个以上的<TH>或<TD>元素。8 . <THEAD> v/THEAD表格标题，在一个表格<TABLE>元素中,只能出现一次。9 . <TFOOT>厅。表格脚注，在一个表格<TABLE>元素中,只能出现一次，必须写在<TBODY>之前。10、<COLGROUP> </COLGROUP>定义表格内的一个列组，其主要作用是从结构上划分表格。用法

27、如下：<COLGROUP SPAN= "10”WIDTH= " 40" ><COL ID= " 1" ></COLGROUP> 定义一个 10 歹U,每列宽 度均为40像素的列组。11、<COL>定义表格中各列的属性，它可出现在列组<COLGROUP>元素内，也可出现在列组外。F其他对象1. . <BGSOUND> 为HTML文件指定背景声音（适用与Microsoft Internet Explorer）,使用的属性有：.Src :指定声音文件的url。Loop :声音播放

28、的次数，若为-1或Infinite ,则一直播放下去。2. <IMG>用于将图像嵌入HTML文件。使用的属性有：Src :指定图像的url oAlt :指定当浏览器尚未完全读入图像、或浏览器不支持内联图像、或 用户为加快浏览速度设置不显示图像时，在图像位置显示的说明性的文字。Align :指定图像的对齐和布局方式。可取值为：top、texttop 、middle 、 absmiddle 、baseline、bottom 、absbottom 。Hspace :设定图像与文本之间水平方向的空白。Vspace :设定图像与文本之间垂直方向的空白。Border :用于给图像加边。Heig

29、ht和Width :用于指定图像大小。举例如下：<B>右边是一幅图像 </B> <IMG SRC="KeyGif.gif" Alt=" 此处是 Gif 图像" Align=middle Border='2' Height="120" Width="160" Hspace="5">.3. <OBJECT> </OBJECT> 是HTML4.0新增的元素，用来控制是否 由外部程序来处理数据。可以使用的属性有：CLASSID

30、:取值URL,指定对象从何位置装入，插入对象时，此属性 必不可少。CODEBASE :取值URL,指定底层路径，缺省值是当前网页的底层 URL。CODETYPE :当下载由属性CLASSID指定的对象时，该属性指定预期 数据的内容类型。DATA :取值URL,指定对象的数据位置。TYPE:指定由属性DATA给出的数据的内容类型。ARCHIVE :给出一个由空格隔开的URL歹表，这些URL给出了与对 象相关的资源的存档位置，也可以包括属性CLASSID和DATA指定的资源。DECLARE :布尔性属性。STANDBY :属性值是一段文本。NAME :利用表单提交对象时，NAME属性指定控件名。T

31、ABINDEX :正整数型值，取值限于（含）0-32767之间。指定对象 在文档中的遍历次序。HEIGHT :指定对象在浏览器中显示区域的高度，以百分比或像素为单 位。WIDTH :指定对象在浏览器中显示区域的宽度，以百分比或像素为单 位。ALIGN :指定页面中对象与上下文的对齐方式或浮动位置，可取的值为:bottom 、 top、 middle 、 left、 right 。BORDER :取整数值。指定对象四周的边框宽度，以像素为单位。HSPACE :取整数值。指定对象左右应留的空，以像素为单位。VSPACE :取整数值。指定对象上下应留的空，以像素为单位。USEMAP :取URL值，为

32、对象建立客户端Image map 。4. <PARAM>在<OBJECT>元素中，给出运行时需要的数据。用法如下：<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-0000”codebase=" /shoekwave/cabs/flash/swflash.cab#version=6,0,29,0 " width="530" height="80"><param name="movie”value="./img/DV.sw

33、f">vparam name="quality”value="high">vembed src="./img/DV.swf"quality="high" pluginspage=" /getflashplayer " type="application/x-shockwave-flas h" width="530" height="80"></embed>v/object>5. <APPLET&

34、gt; v/APPLET>用于在网页中插入JAVA程序。用法如下：vAPPLET CODE= " Bubbles.class ” WIDTH= " 300" HEIGHT= " 300 ” > Java applet that draws animated bubbles </APPLET>G框架元素1 . <FRAME>定义一个框架窗口，使用的属性如下。Frameborder= "yes/no " ： 指定框架有无边框。Marginwidth=pixels :框架内容和框架左、右边框之间的空白。M

35、arginheight=pixels :框架内容和框架上、下边框之间的空白。Scrolling="yes/no/auto "：是否加入滚动条。Name :指定框架名。Src=url :指定源文件。2 . <Frameset> </Frameset>定义框架集，即整体框架，使用的属性如下。Cols :按纵向将窗口划分成几个框架。Rows :按横向将窗口划分成几个框架。3 . <NOFRAMES> </NOFRAMES>为不能显示框架的浏览器指定替换显示内容。以下是框架的一个实例：<FRAMESET cols=140,*fr

36、ameSpacing=0> <FRAME marginHeight=10 marginWidth=5 name=folder src="myFree.files/ldapapp.html"target="rtop"> <FRAME name=main Frameborder="NO"src="D:MyIntranetmyFree.filesldapapp.html"target="rbottom"><NOFRAMES> <body bgcolor=

37、#ffffff><p>This page uses frames, butyour browser doesn't supportthem.</p> </body> </NOFRAMES></FRAMESET>4 . <IFRAME> </IFRAME>用来在一块文本中插入一个子窗口。 用法如下：<IFRAME SRC= "title.html ” WIDTH= "400 " HEIGHT=" 300 " ALIGN= " LEFT

38、” SCROLLING= " yes" FRAMEBORDER= " 1" > 如果您的浏览器不支持 FRAME ,你可以访问<A HREF= "title.html ” >相关 文档 </A></IFRAME>H表单元素1. <FORM> </FORM>在文档中产生表单，使用的属性如下。Action=url :设定处理表单数据的url。Method=get/post :说明如何处理表单数据。2. <INPUT> </INPUT>用于设计输入控件。使用的属

39、性如下：Type :指定控件的类型。可以选择的属性值为text ,checkbox、定io、 submit 、reset、image 等。Size=n : 控件的大小。Name :指定控件的名称。Maxlength=nchars :限定用户所能输入的最多字符数目。3. <OPTION> </OPTION> 为由SELECT定义的列表控件定义一个 选项，使用的属性如下。Selected :该选项被预置。Value=n :用户选中某选项后的返回值。4. <SELECT> </SELECT>用于定义列表框。以下是SELECT和OPTION 的一个使用实

40、例。<TD><SELECT name=node_id size=1><OPTION selected value=11> 杭州 </OPTION> <OPTION value=12> 温州 </OPTION> <OPTION value=31> 嘉兴 </OPTION> <OPTION value=32> 绍兴 </OPTION> <OPTION value=34>宁波</OPTION> </SELECT></TD>5. <

41、;TEXTAREA> </TEXTAREA>定义多行文本输入框，使用的属性如下。Name :指定控件名。Cols=n :文本框的列数。Rows=n :文本框的行数。6. <BUTTON> yBUTTON创建按钮。用法如：<BUTTONNAME= " submit ” VALUE= " submit " TYPE= " submit ” > 发送至 <IMG SRC= " /images/wow.gif “ ALT= " wow " ></BUTTON>7. &

42、lt;OPTGROUP> </OPTGROUP> HTML4.0 新增的元素，用于对 选项进行分组，将相关的选项组合在一起。8. <ISINDEX>创建单行文本输入控件。用法如：<ISINDEXPROMPT= "输入关键词，关键词之间用空格隔开：”>9. . <LABEL>y/LABEL> 用来为无法用 VALUE属性值指定标签的控 件指定标签。 用法如：<LABEL FOR= "kword ”> 关键词：</LABEL><INPUT TYPE= " text "

43、NAME= " keyword " ID= " kword ” >10. . <FIELDSET> </FIELDSET>将主题相关的控件和标签组合在一起。11. . <LEGEND> </LEGEND>用来给 <FIELDSET> 元素指定标题。<LEGEND>元素必须嵌套在<FIELDSET>中。HTML语言范例些基础的 HTML Tag （类另1）1.1 : 一个非常简单的 HTML文件 HTML语言如下:<html><title>我的第一个网站

44、</title><body>这是一个非常简单的HTML 。 </body></html>效果如下:这个示例算是一个最简单的HTML文件，只包含了最基本的能构成一个 HTML文件的Tag。通过这个例子，你可以看到浏览器是如何显示这个文件的， 以此对HTML文件有个最初的认识。1.2 :更多段落 这个示例显示了段落的特性，在HTML里用<p>和<e><p>这是第二段。</p><p>这是第三段。</p><p>在HTML里，用p来定义段落。</p></b

45、ody></html>效果如图：这是第一段。这是第二段，这是第三段,在HTHL里，用p来定义段落.1.3 :换行 这个示例告诉你如何在 HTML文件里换行。<br> HTML语言如下:<html><body><p>要<br> 在一段<br> 里<br> 换行<br> 请使用<br>br 这个Tag。</p></body></html>效果如下：段 用个 一 行使这 要在里相请br通过使用<br>这个Tag,可以在不新建段落

46、的情况下换行。用<p>换行是个坏习惯，正确的是使用 <br> 。1.4 :正文标题这个示例教会你如何在HTML文件里显示正文标题。HTML用<h1>至kh6>这几个Tag来定义正文标题，从大到小。每个正文标题自成一段。HTML语言如下：<html><body><h1>这是1号标题</h1><h2>这是2号标题</h2><h3>这是3号标题</h3><h4> 这是4号标题</h4><h5> 这是5号标题</h5>

47、<h6> 这是6号标题</h6></body> </html>效果如图:这是1号标题这是2号标题这是3号标嶷这是4号标题这是b号标也1.5 :居中的正文标题这个示例告诉你如何将正文标题居中显示。使用<center> 与</center> 表示居中。 HTML 语言如下：<html><body><center> <h1> 这是 1 号标题 </h1> </center><p>上面的标题是居中显示的。</p></body>

48、;</html>效果如图：这是1号标题 '上面的标题是居中显示的.1.6 :加条横线<hr> HTML语言如下：<p>用hr这个Tag可以在HTML文件里加一条横线。</p> <hr><p>你看到上下的横线了吗？ </p> <hr><p>初中某数学老师讲方程式变换，在讲台上袖子一挽大声喝道：同学 们注意！我要变形了！ ?</p></body> </html>效果如下:用hr这个T"可以在HTKL文件里加一条横线,你看到上下的慢线了吗？

49、初中某数学老师讲方程式变换，在讲台上袖子一挽大声喝道土 同学们注意i我要变形了 I1.7 :代码注释 这些注释只显示在HTML源代码中，而源代码最终形成的网页里是看不到这些注释的。<!一注释内容-> HTML语言如下：<html><body><!-这是代码注释-><p>代码注释是不会显示在网页里的。</p></body></html>效果如图:代码注释是不会显示在网页里的.1.8 :背景颜色可以直接写颜色的英文名,也可以找到色彩的数字代码。 HTML语言如下：<body bgcolor=&qu

50、ot;yellow"><h2>看，这个页面是黄色的。</h2></body></html>效果：看，这个页面是黄色的、HTML常用格式2.1、HTML常用的格式 HTML语言如下:<html><body><p><b> 粗体用 b 表示。</b></p><p><i> 斜体用 i 表示。</i></p><p><del> 芙蓉姐姐</del>这个词当中划线表示删除。</p>

51、;<p><ins> 想唱就唱</ins>这个词下划线插入。</p><p>X<sub>2</sub> 其中的 2 是下标 </p><p>X<sup>2</sup> 其中的 2 是上标 </p><p><blockquote> 好好学习，天天向上。这句话缩进表示引用</blockquote></p><pre> 这是 预设(preformatted) 文本.在pre这个tag里的文本保留 空格和分行。

52、</pre><code>call getOrders</code><p>用code显示计算机代码，code里显示的字符是等宽字符。</p></body> </html>效果:粗体用卜表示.英菩怛如这个词当中划级表示删除.想唱就唱这个词下划线插入 与其中的2是下标 "其中的2是上标好好学习，天天问上，这句话缩进表示引用这是ffii更(peforxaVCcd)文本.在ps这个t 管里的文本浮明交格和分行.用s加显示H弹机代码，s加里显示的字符是等宽字符.常用文本格式TagTag<b><d

53、el><ins><sub>< sup ><blockquote><pre><code>Tag»«粗体bold斜体italic文字当中划统表示删除文字下戈峨表示插入下标上标缩进表示引用俣管空格和强行表示计菖机代码,等宽字体三、HTML利用超链接打开链接文件3. 1、建立超链接点击<a> </a> 当中的内容,即可打开一个链接文件，href属性则表示这个链接文件的路径。使用target属性,可以在一个新窗口里打开链接文件。 HTML语言如下：<html><bo

54、dy><p> <a href="">这是百度的链接</a> </p><p> <a href=""target=_blank>从新的页面打开网易的主页 </a></p></body></html>效果如下:这是百度的辕从新的页面打开网易的主页3. 2、将一个图片作为一个超链接演示了如何将一个图片作为一个超链接，即点击一个图片，可以连接到其它文件。 HTML语言如下： <html><body><p>

55、 你可以将一张图片作为一个链接，点击这个图片。<ahref=" "><img src="tupian.jpg" ></a> </p></body> </html>效果:你可以将一张图片作为一个嬉接.点击这个图片。3. 3、title 属性<p> <a href=" .cn" title ="这是川音成都美术学院的网站"> 川音成都美术学院</a> </p><p> <a href=

56、" .cn" title ="川音成都美术学院的网站 &#10;我们的学院”> 川音成都美术学院</a> </p></body> </html>效果:川音成都美术学院J11音成都美术学但却|青威3术物掰嗝川音成都美东学院川音感都美木芋院.音丁学院的因普 卦门a喇4. 4、 name 属性使用name属性、可以跳转到一个文件的指定部位。使用name属性、要设置一对。一是设定name的名称,二是设定一个href指向这个name :HTML语言如下：<html><body><p&

57、gt; <a href="#C5">参见第5章</a> </p>37<p> <a name="C1"><h2> 第 1 章</h2></a> <p>这个是练习第 2 章</h2></a>ame 属性的。</p> <a name="C2"><h2><p>这个是练习name属性的。</p> <a name="C3">&

58、lt;h2> 第3章</h2></a> <p>这个是练习 name 属性的。</p><a name="C4"><h2>第 4 章</h2></a><p>这个是练习name属性的。</p> <a name="C5"><h2> 第5章</h2></a> <p>这个是练习name 属性的。</p></body> </html>效果:参见第5章

59、第1章这个是绯习力油-嵋性的。这个是埼习naine属性的*第5章这个超东习如属性的.单击第一张图的“参见第5章”就跳到第二张图的效果5. 5、链接至U email 地址在网站中，你经常会看到“联系我们”的链接，一点击这个链接，就会触发你的邮件客户端，比如Outlook Express .然后显示一个新建 mail的窗口用<a>可以实现这样的功能HTML语言如下:<html><body><p>这是一个最简单的邮箱地址的链接：<a href=" mailto:">给自己的邮箱发信</a> </p>

60、;</body></html>效果:这是一个最荷单的邮箱地址的链接* 一l匕的邮箱发信单击上图中的“给自己的邮箱发信”就会得到下图这个对话框四、如何创建 HTML 表格HTML表格用<table> 表示。一个表格可以分成很多行(row), 用<tr> 表示;每行又可以分成很多单元格 (cell),用<td> 表示。 示 例： HTML语言如下：<p> 表格所用到的Tag :整个表格开始要用table ;每一行开始要用tr;每一单元格开始要用td 。 </p><h4> 只有一行(Row) 一列(Col

61、umn)的表格 </h4><table border="1"><tr><td>100</td></tr></table><h4> 一行三列的表格</h4><table border="1"><tr><td>100</td> <td>200</td> <td>300</td></tr></table><h4>两行三列的

62、表格</h4><table border="1"><tr><td>100</td> <td>200</td> <td>300</td></tr> <tr><td>400</td> <td>500</td> <td>600</td></tr></table></body></html>效果如图：表格所用到的Tm，整个泰格开始饕用

63、t让衽一行开始襄用tn 每一单元格开蛤要用td.只有一行(如)"列(Cnluwi)的表格|100一行三列的表格Jiioo 200 300两行三列的表格iioo 28 血400 500 6006. 1、 border 属性在缺省情况下，如果不设置表格的边界，表格是不显示边界的。示例： HTML语言如下：<html><body><h4>缺省border情况下，表格没有边界。</h4><table><tr><td>100</td><td>200</td><td>

64、;300</td></tr><tr><td>400</td> <td>500</td> <td>600</td></tr></table><h4>表格Border设为0,也不显示边界：</h4><table border="0"><tr><td>100</td> <td>200</td> <td>300</td></tr

65、> <tr><td>400</td> <td>500</td> <td>600</td></tr></table><h4>表格的border （边界）值设为8,边界更粗：</h4><table border="8"><tr><td> 弟一 </td><td> 行 </td></tr><tr><td> 第二 </td>&l

66、t;td> 行 </td></tr></table></body></html>效果如图：钦省budL情况下，表格没有边黑.100 200 300400 500 600表格Bord”设为也不足示边界.100 200 300400 500 600表格的bor加r （边界）值设为心边翳更粗r第一行|第二京4. 2、表格的表头用<th> 来表示表格的表头,表头的字是粗体显示的。HTML语言如<html><body><h4>横向表头的表格：</h4><table bord

67、er="1"><tr><th> 姓名 </th> <th> 电话 </th><th> 传真 </th></tr> <tr><td>Bill Gates</td> <td>555 77 854</td><td>555 77 855</td></tr></table><h4> 竖直方向的表头：</h4><table border="

68、1"><tr><th> 姓名 </th> <td>Bill Gates</td></tr><tr><th> 电话 </th><td>555 77 854</td></tr><tr><th> 传真 </th><td>555 77 855</td></tr></table></body></html>效果如图：横向表夫的表格,姓名 电

69、话二传真_I Bill Gates 5S& 77 254 555 77 855密直方向的表具工姓名 Bill Gates 电话 555 77 254 侍真 555 77 8554. 3、空的单元格如果表格的单元格<td> </td>之间没有内容，那么这个单元格的边界是不会被显示出来的，尽管整个表格已设置边界值。 要显示这个单元格的边界，可以插入一个&nbsp;空格符。 HTML语言如下：<html><body><table border="1"><tr><td>Some te

70、xt</td><td>Some text</td></tr> <tr> <td></td><td>Some text</td></tr></table><p>上面的表格中，有一个单元格里是没有任何内容的，这个空的单元格没有显示边界，虽然整个表格设了边界值。</p><table border="1"><tr><td>Some text</td><td>Some t

71、ext</td></tr><tr><td>&nbsp;</td><td>Some text</td></tr> </table><p>上面的例子，你可以看到，给这个单元格加上一个空格符号之后，单元格的边界就显示出来了。</p><p>注意：空格符要用&bsp;表示。&nbsp;是一个HTML特别字符，参见HTML 特别字符(HTML CharacterEntities) 。 </p></body></

72、html>效果如下：Some teit Some textSone terl上面的表格中，有一个单元格里是没有任何内容的，这个空的单元格没有显 示边界，虽然整个表格设了边界值。Some teit Some teilSone text上面的伊仔，你可以看到，给这个单元格加上一个空格符号之后,单元格的 边界就显示出来了.注意，空格符要用处敝表示是一个HTIL特别字符,参见HTML特别字符(HTML Character Entities)*4.4、包含多列或多行的单元格这个示例演示如何用colspan , rowspan 设置多列或者多行的单元格。 HTML语言如下：<html>&

73、lt;body><h4>用colpsan 属性，设置包含多列的单元格：</h4><table border="1"><tr><th> 姓名 </th> <th colspan="2">联系方式 </th></tr><tr><td>Bill Gates</td><td>555 77 854</td><td>555 77 855</td></tr>&l

74、t;/h4></table><h4>用rowspan 这个属性，设置包含多行的单元格:<table border="1"><tr><th> 姓名 </th><td>Bill Gates</td></tr><tr><th rowspan="2"> 联系方式 </th><td>555 77 854</td></tr><tr><td>555 77 855</td></tr></table></body></html>效果如图:用Cdlpsan属性.设M包含多的单兀格工姓名二I 一联系方一二TlBill Gatfs 5皓 77 854 555 77 凿5用rowEpan这个属性.设置包含多行的单元格工姓名 Bill G

人人文库> 全部分类> 应用文书 > 作业报告

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论