教 程 >> HTML >> 文本标志
教程三、文本标志
1.<pre></pre>
上一个教程中我们已经讲了如何在浏览器中输出文本，以及文本输出的格式，这个教程中我们将谈一谈文本输出的字体 ，如斜体、黑体字、下加一划线等等。在本教程的最后给出了一个文本标志的综合示例，希望读者能认真阅读。 标志对用来对文本进行预处理 操作。 语言提供了一系列对文本中的标题 进行操作的标志对： <h1></h1>……<h6></h6> ，即一共有六对标题的标志对。 <h1></h1> 是最大 的标题，而 <h6></h6> 则是最小 的标题，也即是标志中 h 后面的数字越大标题文本就越小。如果您的 Html 文档中需要输出标题文本的话，便可以使用这六对标题标志对中的任何一对。 经常使用 WORD 的人对这三对标志对一定很快就能掌握。 <b></b> 用来使文本以黑体字 的形式输出； <i></i> 用来使文本以斜体字 的形式输出； <u></u> 用来使文本以下加一划线 的形式输出。后边将会有一个综合的例子，所以此处就不再作详细讲解了。 这些标志对的用法和上边的一样，差别只是在于输出的文本字体不太一样而已。 <tt></tt> 用来输出打字机风格 字体的文本； <cite></cite> 用来输出引用方式 的字体，通常是斜体； <em></em> 用来输出需要强调 的文本 ( 通常是斜体加黑体 ) ； <strong></strong> 则用来输出加重 文本 ( 通常也是斜体加黑体 ) 。这些标志对的示例也将在后边综合的例子中出现。 是一对很有用的标志对，它可以对输出文本的字体大小、颜色进行随意地改变，这些改变主要是通过对它的两个属性 size 和 color 的控制来实现的。 size 属性用来改变字体的大小 ，它可以取值： -1 、 1 和 +1 ；而 color 属性则用来改变文本的颜色 ，颜色的取值是我们在教程一中讲过的十六进制 RGB 颜色码或 Html 语言给定的颜色常量名。具体用法请看下边综合的例子。 例 4 文本标志的综合示例 <html> 文本标志的综合示例 </title> 最大的标题 </h1> 使用 h3 的标题 </h3> 最大的标题 </h6> 黑体字文本 </b> </p> 斜体字文本 </i> </p> 下加一划线文本 </u> </p> 打字机风格的文本 </tt></p> 引用方式的文本 </cite></p> 强调的文本 </em></p> 加重的文本 </strong></p> 取值 “+1” 、 color 取值 “red” 时的文本 </font></p> 本例在浏览器中显示的结果如下：
最大的标题 使用 h3 的标题 最大的标题 黑体字文本
斜体字文本
下加一划线文本
打字机风格的文本
引用方式的文本
强调的文本
加重的文本
size 取值 “+1” 、 color 取值 “red” 时的文本
返回顶部
教 程 >> HTML >> 图像标志
教程四、图像标志
1.<img>
再简单朴素的网页如果只有文字而没有图像的话将失去许多活力，图像在网页制作中是非常重要的一个方面， Html 语言也专门提供了 <img> 标志来处理图像的输出。 标志并不是真正地把图像给加入到 Html 文档中，而是将标志对的 src 属性赋值，这个值是图形文件的文件名，当然包括路径，这个路径可以是相对路径 ，也可以是网址 。实际上就是通过路径将图形文件嵌入到您的文档中。您可能并不知道什么是相对路径，我现在就来讲一讲相对路径。所谓相对路径是指您所要链接或嵌入到当前 Html 文档的文件与当前文件的相对位置所形成的路径。假如您的 Html 文件与图形文件 ( 文件名假设是 logo.gif) 在同一个目录下，则可以将代码写成 <img src="logo.gif"> ；假如您的图形文件放在当前的 Html 文档所在目录的一个子目录 ( 子目录名假设是 images) 下，则代码应为 <img src="images/logo.gif"> ；假如您的图形文件放在当前的 Html 文档所在目录的上层目录 ( 目录名假设是 home) 下，则相对路径就必须是准网址 了，即用 “../ ” 表示您的网站，然后在后边紧跟文件在您的网站中的路径，假设 home 是您的网站下的一个目录，则代码应为 <img src="../home/logo.gif"> ，若 home 是您的网站下的目录 king 下边的一个子目录，则代码应该变为 <img src="../king/home/logo.gif"> 了。现在您对相对路径应该有所了解了吧！ 必须强调一下， src 属性在 <img> 标志中是必须赋值 的，是标志中不可缺少的一部分。除此之外， <img> 标志还有 alt 、 align 、 border 、 width 和 height 属性。 align 是图像的对齐方式，在前边的教程中已经讲了很多了，这里就不再提了。 border 属性是图像的边框，可以取大于或者等于 0 的整数 ，默认单位是像素 。 width 和 Height 属性是图像的宽 和高 ，默认单位也是象素。 alt 属性是当鼠标移动到图像上时显示的文本 。 标志是在 Html 文档中加入一条水平线，它可以直接使用，具有 size 、 color 、 width 和 noshade 属性。 size 是设置水平线的厚度 ，而 width 是设定水平线的宽度 ，默认单位是像素。想必大家对 color 属性已经很熟悉了，在此就不再用多讲。 noshade 属性不用赋值，而是直接加入标志即可使用，它是用来加入一条没有阴影 的水平线 ( 不加入此属性水平线将有阴影 ) 。 下面是本教程的一个综合例子。 例 5 图像标志举例 <html> 图像标志的综合示例 </title> 本例在浏览其中的显示结果如下：
返回顶部
教 程 >> HTML >> 表格标志
教程五、表格标志
1.<table></table>
表格标志对于制作网页是很重要 的，我希望您能记住这一点，现在很多很多网页都是使用多重表格，主要是因为表格不但可以固定文本或图像的输出，而且还可以任意的进行背景 和前景 颜色的设置。但愿您也能熟练使用表格来制作您的主页。 标志对用来创建一个表格。它有以下属性：
属性
用途
<table bgcolor="">
设置表格的背景色。
<table border="">
设置边框的宽度 ，若不设置此属性，则边框宽度默认为 0 。
<table bordercolor="">
设置边框的颜色 。
<table bordercolorlight="">
设置边框明亮 部分的颜色 ( 当 border 的值大于等于 1 时才有用 ) 。
<table bordercolordark="">
设置边框昏暗 部分的颜色 ( 当 border 的值大于等于 1 时才有用 ) 。
<table cellspacing="">
设置表格格子之间空间的大小。
<table cellpadding="">
设置表格格子边框与其内部内容之间空间的大小。
<table width="">
设置表格的宽度，单位用绝对像素值 或总宽度的百分比 。
说明 : 以上各个属性可以结合使用。有关宽度、大小的单位用绝对像素值 。而有关颜色的属性使用十六进制 RGB 颜色码或 Html 语言给定的颜色常量名 ( 如 Silver 为银色 )
2.<tr></tr><td></td> 标志对用来创建表格中的每一行 。此标志对只能放在 <table></table> 标志对之间使用，而在此标志对之间加入文本将是无用的，因为在 <tr></tr> 之间只能紧跟 <td></td> 标志对才是有效的语法， <td></td> 标志对用来创建表格中一行中的每一个格子 ，此标志对也只有放在 <tr></tr> 标志对之间才是有效的，您想要输入的文本也只有放在 <td></td> 标志对中才有效 ( 即才能够显示出来 ) 。 <table></table> 、 <tr></tr> 和 <td></td> 标志对的关系如下所示：
最外层 , 创建一个表格 -->
<table>
创建一行 -->
<tr>
创建一个格子 ( 这里总共创建了三个格子 )-->
<td> 要输出的文本只能放在此处 </td>
<td> 要输出的文本只能放在此处 </td>
<td> 要输出的文本只能放在此处 </td>
</tr>
最外层 -->
</table>
此外， <tr> 还有 align 和 valign 属性。 align 是水平对齐方式 ，取值为 left ( 左对齐 ) 、 center ( 居中 ) 、 right ( 右对齐 ) ；而 valign 是垂直对齐方式 ，取值为 top ( 靠顶端对齐 ) 、 middle ( 居中间对齐 ) 或 bottom ( 靠底部对齐 ) 。 <td> 具有 width 、 colspan 、 rowspan 和 nowrap 属性。 width 是格子的宽度，单位用绝对像素值 或总宽度的百分比 ； colspan 设置一个表格格子跨占的列数 ( 缺省值为 1) ； rowspan 设置一个表格格子跨占的行数 ( 缺省值为 1) ； nowrap 禁止 表格格子内的内容自动断行 。 标志对用来设置表格头 ，通常是黑体居中文字。 看一看下边的例子就明白以上标志对的用法了。 例 6 表格标志的综合示例 <html> 表格标志的综合示例 </title> 意大利 </th> 英格兰 </th> 西班牙 </th> 米兰 </td> 佛罗伦萨 </td> 曼联 </td> 纽卡斯尔 </td> 巴塞罗那 </td> 皇家社会 </td> 尤文图斯 </td> 桑普多利亚 </td> 利物浦 </td> 阿申纳 </td> 皇家马德里 </td> 拉齐奥 </td> 国际米兰 </td> 切尔西 </td> 米德尔斯堡 </td> 马德里竞技 </td> 本例在浏览器中显示的结果如下：
意大利
英格兰
西班牙
AC 米兰
佛罗伦萨
曼联
纽卡斯尔
巴塞罗那
皇家社会
尤文图斯
桑普多利亚
利物浦
阿申纳
皇家马德里
……
拉齐奥
国际米兰
切尔西
米德尔斯堡
马德里竞技
……
返回顶部
教 程 >> HTML >> 链接标志
教程六、链接标志
1.<a href=""></a>
教程六的内容不是很多，而且很简单。链接是 Html 语言的一大特色，正因为有了它，我们对内容的浏览才能够具有灵活性和网络性。 本标志对的属性 href 是无论如何不可缺少 的，标志对之间加入需要链接的文本或图像 ( 链接图像即加入 <img src=""> 标志 ) 。 href 的值可以是 URL 形式，即网址或相对路径，也可以是 mailto: 形式，即发送 E-Mail 形式。对于第一种情况，语法为 <a href="URL"></a> ，这就能创建一个超文本链接 了，例如： 这是我的网站 </a> 对于第二种情况，语法为 <a href="mailto:EMAIL"></a> ，这就创建了一个自动发送电子邮件的链接 ， mailto: 后边紧跟想要制动发送的电子邮件的地址 ( 即 E-Mail 地址 ) ，例如： 这是我的电子信箱 (E-Mail 信箱 )</a> 此外， <a href=""></a> 还具有 target 属性，此属性用来指明浏览的目标帧 ，我们将在讲帧标志时作详细的说明，这里您只要知道如果不使用 target 属性，当浏览者点击了链接之后将在原来的浏览器窗口中浏览新的 Html 文档，若 target 的值等于 “_blank ” ，点击链接后将会打开一个新的浏览器窗口来浏览新的 Html 文档。例如： 这是我的网站 </a> 标志对要结合 <a href=""></a> 标志对使用才有效果。 <a name=""></a> 标志对用来在 Html 文档中创建一个标签 ( 即做一个记号 ) ，属性 name 是不可缺少 的，它的值也即是标签名，例如： 标签名 "> 此处创建了一个标签 </a> 创建标签是为了在 Html 文档中创建一些链接，以便能够找到同一文档 中的有标签的地方。要找到标签所在地，就必须使用 <a href=""></a> 标志对。例如要找到 “ 标签名 ” 这个标签，就要编写如下代码： 标签名 "> 点击此处将使浏览器跳到 “ 标签名 ” 处 </a> 注意 ： href 属性赋的值若是标签的名字，必须在标签名前边加一个 “# ” 号。 下面是本教程的一个综合示例： 例 7 链接标志的综合示例 链接标志的综合示例 </title> 创建标签处 </font></a><br> 欢迎想要学习网页制作的同学访问我的网站 <br> 欢迎访问 " 网页制作 "" border="0" width="468" height="60"></a><br> 本网站的主要内容 <br> 教程 </a><br> 动态 Html 教程 </a><br> 教程 </a><br> 教程 <br> 教程 <br> 友情链接 </a><br> 我要留言 <br> 作者介绍 <br> 欢迎给我来信，我的 E-Mail 是： 点击此处回到标签处 </font></a><br> 本例在浏览器中显示的结果如下：
返回顶部
教 程 >> HTML >> 帧标志
教程七、帧标志
1.<frameset></frameset>
帧是由英文 Frame 翻译过来的，它可以用来向浏览器窗口中装载多个 Html 文件。即每个 Html 文件占据一个帧，而多个帧可以同时显示在同一个浏览器窗口中，它们组成了一个最大的帧，也即是一个包含多个 Html 文档的 Html 文件 ( 我称它为主文档 ) 。帧通常的使用方法是在一个帧中放置目录 ( 即可供选择的链接 ) ，然后将 Html 文件显示在另一个帧中。 标志对放在帧的主文档 的 <body></body> 标志对的外边 ，也可以嵌在其他帧文档中，并且可以嵌套使用 。此标志对用来定义主文档中有几个帧并且各个帧是如何排列的。它具有 rows 和 cols 属性，使用 <frameset> 标志时这两个属性至少必须选择一个 ，否则浏览器只显示第一个定义的帧，剩下的一概不管， <frameset></frameset> 标志对也就没有起到任何作用了。 rows 用来规定主文档中各个帧的行定位 ，而 cols 用来规定主文档中各个帧的列定位 。这两个属性的取值可以是百分数、绝对像素值或星号 (“*”) ，其中星号代表那些未被说明的空间，如果同一个属性中出现多个星号则将剩下的未被说明的空间 平均分配 。同时，所有的帧按照 rows 和 cols 的值从左到右 ，然后从上到下 排列。示例如下：
<frameset rows="*,*,*">
总共有三个按列排列的帧 , 每个帧占整个浏览器窗口的 1/3
<frameset cols="40%,*,*">
总共有三个按行排列的帧 , 第一个帧占整个浏览器窗口的 40%, 剩下的空间平均分配给另外两个帧
<frameset rows="40%,*" cols="50%,*,200">
总共有六个帧 , 先是在第一行中从左到右排列三个帧 , 然后在第二行中从左到右再排列三个帧 , 即两行三列 , 所占空间依据 rows 和 cols 属性的值 , 其中 200 的单位是像素
2.<frame> 标志放在 <frameset></frameset> 之间，用来定义某一个具体的帧。 <frame> 标志具有 src 和 name 属性，这两个属性 都是必须赋值 的。 src 是此帧的源 Html 文件名 ( 包括网络路径 , 即相对路径或网址 ) ，浏览器将会在此帧中显示 src 指定的 Html 文件； name 是此帧的名字 ，这个名字是用来供超文本链接标志 <a href="" target=""> 中的 target 属性用来指定链接的 Html 文件将显示在哪一个帧中。例如定义了一个帧，名字是 main ，在帧中显示的 Html 文件名是 jc.htm ，则代码是 <frame src="jc.htm" name="main"> ，当您有一个链接，在点击了这个链接后，文件 new.htm 将要显示在名为 main 的帧中，则代码为 <a href="new.htm" target="main"> 需要链接的文本 </a> 。这样一来，就可以在一个帧中建立网站的目录，加入一系列链接，当点击链接以后在另一个帧中显示被链接的 Html 文件。 此外， <frame> 标志还有 scrolling 和 noresize 属性， scrolling 用来指定是否显示滚动轴 ，取值可以是 “yes ”( 显示 ) 、 “no ”( 不显示 ) 或 “auto ”( 若需要则会自动显示 , 不需要则自动不显示 ) 。 noresize 属性直接加入标志中即可使用，不需赋值，它用来禁止用户调整 一个帧的大小。 标志对也是放在 <frameset></frameset> 标志对之间，用来在那些不支持帧 的浏览器中显示文本或图像信息。在此标志对之间先紧跟 <body></body> 标志对，然后才可以使用我们在教程七以前讲过的任何标志。 下边是一个综合示例： 例 8 帧标志的综合示例 主文档： <html> 帧标志的综合示例 </title> 对不起，您的浏览器不支持 “ 帧 ” ！ </p> <html> 目录 </title> 目录 </font></p> 链接到第一页 </a></p> 链接到第二页 </a></p> <html> 第一页 </title> 这是第一页！ </font></p> <html> 第二页 </title> 这是第二页！ </font></p>
返回顶部
教 程 >> HTML >> 表单标志
教程八、表单标志
1.<form></form>
表单在 Web 网页中用来给访问者填写信息，从而能获得用户信息，使网页具有交互的功能 。一般是将表单设计在一个 Html 文档中，当用户填写完信息后做提交 (submit) 操作，于是表单的内容就从客户端的浏览器传送到服务器上，经过服务器上的 ASP 或 CGI 等处理程序 处理后，再将用户所需信息传送回客户端的浏览器上，这样网页就具有了交互性。这里我们只讲怎样使用 Html 标志来设计表单。 标志对用来创建一个表单，也即定义表单的开始和结束位置，在标志对之间的一切都属于表单的内容。 <form> 标志具有 action 、 method 和 target 属性。 action 的值是处理程序的程序名 ( 包括网络路径 : 网址或相对路径 ) ，如： <form action="http://www.netsh.com/counter.cgi"> ，当用户提交表单时，服务器将执行网址 http://www.netsh.com/ 上的名为 counter.cgi 的 CGI 程序。 method 属性用来定义处理程序从表单中获得信息的方式，可取值为 GET 和 POST 的其中一个。 GET 方式是处理程序从当前 Html 文档中获取数据，然而这种方式传送的数据量是有所限制的，一般限制在 1KB 以下。 POST 方式与 GET 方式相反，它是当前的 Html 文档把数据传送给处理程序，传送的数据量要比使用 GET 方式的大的多。 target 属性用来指定目标窗口或目标帧。 标志用来定义一个用户输入区，用户可在其中输入信息。此标志必须放在 <form></form> 标志对之间。 <input type=""> 标志中共提供了八种类型的输入区域，具体是哪一种类型由 type 属性来决定。请看下边列表：
type 属性取值
输入区域类型
输入区域示例
<input type="TEXT " size="" maxlength="" >
单行的文本输入区域 ,size 与 maxlength 属性用来定义此种输入区域显示的尺寸大小与输入的最大字符数
<input type="SUBMIT ">
将表单内容提交给服务器的按钮
<input type="RESET ">
将表单内容全部清除 , 重新填写的按钮
<input type="CHECKBOX " checked >
一个复选框 ,checked 属性用来设置该复选框缺省时是否被选中 , 右边示例中使用了三个复选框
你喜欢哪些教程： 入门 动态 Html
<input type="HIDDEN ">
隐藏区域 , 用户不能在其中输入 , 用来预设某些要传送的信息
<input type="IMAGE " src="URL" >
使用图像来代替 Submit 按钮 , 图像的源文件名由 src 属性指定 , 用户点击后 , 表单中的信息和点击位置的 X 、 Y 坐标一起传送给服务器
<input type="PASSWARD ">
输入密码的区域 , 当用户