1、詳解HTML
標(biāo)簽和屬性
在HTML中,通常標(biāo)簽都是由開始標(biāo)簽和結(jié)束標(biāo)簽組成的,開始標(biāo)簽用“<標(biāo)簽名>”表示,結(jié)束標(biāo)簽用“</標(biāo)簽名>”表示。
元素指的是包含標(biāo)簽在內(nèi)的整體,除去標(biāo)簽的部分叫做內(nèi)容。
屬性要在開始標(biāo)簽中指定,用來(lái)表示該標(biāo)簽的性質(zhì)和特性。通常都是以“屬性名=”值””的形式來(lái)表示,用空格隔開后,還可以指定多個(gè)屬性。指定多個(gè)屬性時(shí)不用區(qū)分順序
顏色的指定方法
用HTML指定顏色有兩種方法
1、用16進(jìn)制數(shù)值來(lái)指定:在#號(hào)的后面,把RGB的各個(gè)選項(xiàng)用十六進(jìn)制的數(shù)值來(lái)表示,數(shù)值保持兩位數(shù)。
2、指定顏色的名稱:可以對(duì)基本的16色用名稱來(lái)指定其顏色
指定文件的位置
在對(duì)某部分設(shè)置鏈接的時(shí)候,需要指定鏈接端HTML文件的位置;同樣,如果想在該處顯示圖像也需要指定圖像的位置。在HTML中,這個(gè)位置用URL來(lái)表示,有以下兩種表示方法:
1、絕對(duì)URL:絕對(duì)URL就是用Web瀏覽器查看網(wǎng)頁(yè)時(shí),地址欄中顯示的以http://開頭的路徑
2、相對(duì)URL:相對(duì)URL是在同一站點(diǎn)內(nèi)進(jìn)行設(shè)置,類似于在同一磁盤上管理文件的形式。這種方法是以當(dāng)前文件的位置為基準(zhǔn)。使用相對(duì)URL時(shí),如果要指定的文件在當(dāng)前文件的下級(jí),就從目錄名開始一直寫到要指定的文件名,中間用“/”符號(hào)隔開。如果在當(dāng)前文件的上級(jí),每上一級(jí)就加一個(gè)“../”符號(hào)
2、基本內(nèi)容
顯示HTML的版本
<!DOCTYPE~>
HTML的版本表明HTML文件是按照哪個(gè)版本進(jìn)行編寫的(標(biāo)明該HTML文件遵循的DTD文件),不同的版本和種類都有固定的書寫格式,要按照固定的格式輸入文件開頭,然后在文件開頭處寫明版本,按照這種版本的規(guī)定格式進(jìn)行編寫
必須使用的標(biāo)簽
<html>~</html>
<head>~</head>
<title>~</title>
<body>~</body>
HTML文件的開頭寫有<!DOCTYPE~>的部分,代表HTML的版本,其后是必須存在的四種標(biāo)簽
首先,<!DOCTYPE~>后面的整個(gè)都要用html標(biāo)簽(<html>~</html>)括起來(lái),其中要按照head標(biāo)簽(<head>~</head)和body標(biāo)簽的順序(<body>~</body>)的順序進(jìn)行排列。
在head標(biāo)簽中填寫與該文件相關(guān)的信息,body標(biāo)簽中填寫世紀(jì)要在瀏覽器上顯示的內(nèi)容。另外,在head標(biāo)簽中,只能有一個(gè)代表文件標(biāo)題的title標(biāo)簽
設(shè)置頁(yè)面的文字顏色
<body text=”顏色指定”>~</body>
設(shè)置頁(yè)面的背景顏色
<body bgcolor=”顏色指定”>~</body>
設(shè)置頁(yè)面的背景圖像
<body background=”圖像的URL”>~</body>
按照目的設(shè)定范圍
<div>~</div>
<span>~</span>
插入注釋
<!—注釋語(yǔ)句-->
3、設(shè)置文件信息
添加標(biāo)題
<title>~</title>
title標(biāo)簽用來(lái)給HTML文件添加標(biāo)題
這個(gè)標(biāo)簽一定要位于<head>~</head>圈定的范圍內(nèi)。在這里指定的標(biāo)題除了可以在通常的瀏覽器窗口的標(biāo)題欄中顯示以外,還可以作為加入收藏夾時(shí)的標(biāo)題
顯示文件編碼
<meta http-equiv="Content-Type" content="text/html; charset=文字編碼" />
meta標(biāo)簽的charset屬性表示該HTML文件是用什么文字編碼編寫的
注意,該標(biāo)簽一定要位于<head>~</head>范圍內(nèi)
添加關(guān)鍵字、內(nèi)容介紹及作者姓名
<meta name="keywords" content="關(guān)鍵字1,關(guān)鍵字2,…" />
<meta name="description" content="內(nèi)容介紹" />
<meta name="author" content="作者姓名" />
這些信息都不會(huì)在畫面上顯示出來(lái),但是搜索引擎在收集信息時(shí)要用到
注意,該標(biāo)簽一定要位于<head>~</head>范圍內(nèi)
設(shè)置樣式表和腳本語(yǔ)言的種類
<meta http-equiv="Content-Style-Type" content="樣式表的種類" />
<meta http-equiv="Content-Script-Type" content="腳本的種類" />
在HTML文件內(nèi)可以設(shè)置樣式表和腳本的默認(rèn)語(yǔ)言
注意,該標(biāo)簽一定要位于<head>~</head>范圍內(nèi)
設(shè)置進(jìn)入網(wǎng)頁(yè)
<link rel=”關(guān)系” href=”URL”>
<link rev=”關(guān)系” href=”URL”>
rel:在本頁(yè)看到的,與URL標(biāo)明的網(wǎng)頁(yè)之間的關(guān)系
rev:在URL標(biāo)明的網(wǎng)頁(yè)中看到的,與本頁(yè)之間的關(guān)系
link標(biāo)簽表示的是該文件和與其相關(guān)的其他文件之間的關(guān)系
注意,該標(biāo)簽一定要位于<head>~</head>范圍內(nèi)
設(shè)置標(biāo)準(zhǔn)URL
<base href=”絕對(duì)URL”>
<base href=”絕對(duì)URL” target=”目標(biāo)名”>
base標(biāo)簽用來(lái)設(shè)置將該頁(yè)中使用的相對(duì)URL的標(biāo)準(zhǔn)指向成絕對(duì)URL,指定了這個(gè)標(biāo)簽之后,在該頁(yè)指定的相對(duì)URL就會(huì)全部認(rèn)定為已在這里指定的絕對(duì)URL。如果不進(jìn)行這項(xiàng)設(shè)置,就以當(dāng)前頁(yè)的位置為標(biāo)準(zhǔn),如果指定了Target屬性,就可以指定打開鏈接地址網(wǎng)頁(yè)的默認(rèn)框架和窗口
注意,該標(biāo)簽一定要位于<head>~</head>范圍內(nèi)
設(shè)置自動(dòng)倒入網(wǎng)頁(yè)功能
<meta http-equiv="refresh" content="秒數(shù)" />
<meta http-equiv="refresh" content="秒數(shù)";URL=要移動(dòng)到的URL />
在經(jīng)過數(shù)秒后,自動(dòng)開始導(dǎo)入網(wǎng)頁(yè)。如果指定了要移動(dòng)到的URL,就會(huì)導(dǎo)入U(xiǎn)RL指定的網(wǎng)頁(yè)。如果沒有指定,就會(huì)再次導(dǎo)入相同的頁(yè)
注意,該標(biāo)簽一定要位于<head>~</head>范圍內(nèi)
4、設(shè)置文本類型
設(shè)置各級(jí)標(biāo)題
<h1>~<h1>
…
設(shè)置段落
<p>~</p>
p標(biāo)簽表示的是該部分為一個(gè)段落
設(shè)置聯(lián)系地址
<address>~</address>
address標(biāo)簽表示的內(nèi)容是該網(wǎng)頁(yè)制作者的聯(lián)系地址和有關(guān)網(wǎng)頁(yè)內(nèi)容的咨詢地址等信息
設(shè)置強(qiáng)調(diào)內(nèi)容
<em>~</em>
<strong>~</strong>
這兩個(gè)標(biāo)簽所圈內(nèi)容表示該部分是強(qiáng)調(diào)的內(nèi)容
設(shè)置較短的引用文字
<q>~</q>
<q cite=”引用頁(yè)的URL”>~</q>
q標(biāo)簽代表的意思是該部分為較短的引用文,在引用段落的某一部分的時(shí)候使用,如果使用cite屬性,還能夠把引用頁(yè)的URL顯示出來(lái)
設(shè)置較長(zhǎng)的引用文章
<blockquote>~</blockquote>
<blockquote cite=”引用頁(yè)的URL”>~</blockquote>
設(shè)置文字內(nèi)容的出處
<cite>~</cite>
設(shè)置縮略語(yǔ)
<abbr title=”字符串”>~</abbr>
<acronym title=”字符串”>~</acronym>
title:不處于省略狀態(tài)下的詞匯(字符串)
設(shè)置添加的內(nèi)容
<ins cite=”URL” datetime=”添加日期時(shí)間”>~</ins>
設(shè)置需要?jiǎng)h除的內(nèi)容
<de cite=”URL” datetime=”刪除日期時(shí)間”>~</del>
突出顯示段落中的術(shù)語(yǔ)
<dfn>~</dfn>
表示與程序關(guān)聯(lián)的文本
<kbd>~</kbd>:輸入文本
<samp>~</samp>:輸出樣本
<code>~</code>:源代碼
<var>~</var>:變量
顯示特殊符號(hào)
<:<
>:>
":”
&:&
5、設(shè)置顯示方式
設(shè)置文字的換行
<br>
添加了br標(biāo)簽之后,文本就會(huì)再該處換行。即使在HTML代碼中已經(jīng)換行了,在瀏覽器上顯示的時(shí)候卻反映不出來(lái),因此如果想在瀏覽器上換行的話,就要使用br標(biāo)簽
添加不同橫線效果
<hr>
<hr size=”粗細(xì)” width=”長(zhǎng)度” align=”對(duì)齊方式” noshade>
加入了hr標(biāo)簽后,就可以在其標(biāo)注的地方顯示橫線
設(shè)置文本格式
<b>~</b>:黑體字
<i>~</i>:斜體字
<tt>~</tt>:等大字體
<sup>~</sup>:上標(biāo)
<sub>~</sub>:下標(biāo)
<u>~</u>:下劃線
<s>~</s>:刪除線
設(shè)置空格和換行
<pre>~</pre>
<pre>標(biāo)簽可以保留文字在源代碼中的格式,使得頁(yè)面中顯示的內(nèi)容和源代中的格式完全一致
設(shè)置居中效果
<center>~</center>
center標(biāo)簽用于將指定范圍內(nèi)的內(nèi)容設(shè)置為居中
設(shè)置行對(duì)齊方式
<h1 align=”行對(duì)齊方式”>~<h1>
<p align=”行對(duì)齊方式”>~<p>
<div align=”行對(duì)齊方式”>~<div>
使用align屬性可以設(shè)置標(biāo)題、段落以及指定范圍內(nèi)的行對(duì)齊方式
設(shè)置文字顏色
<font color=”設(shè)置顏色”>~</font>
設(shè)置字體類型
<font>字體名”>~</font>
設(shè)置字體字號(hào)
<font size=”字號(hào)”>~</font>
相對(duì)改變字體大小
<big>~</big>:增大
<small>~</small>:減小
<font size=”+n”>:增大n號(hào)
<font size=”-n”>:減小n號(hào)
設(shè)置字號(hào)的基本大小
<basefont size=”字號(hào)”>
size:1~7
6、設(shè)置鏈接相關(guān)的屬性
鏈接到其他頁(yè)面
<a href=”鏈接目標(biāo)URL”>~</a>
a標(biāo)簽的href屬性能把指定的范圍鏈接到其他頁(yè)面上,鏈接部分的詞語(yǔ)要設(shè)置得讓人看到這個(gè)部分就能聯(lián)想到鏈接網(wǎng)頁(yè)上的具體內(nèi)容
另外,在鏈接圖像的時(shí)候,一定要插入替代的文字(alt=”~”)使用戶能夠很明確的了解到鏈接的目標(biāo)
鏈接到當(dāng)前頁(yè)的特定位置
<a href=”#位置名”>~</a>:指定鏈接文件(從什么位置開始鏈接)
<a name=”位置名”>~</a>:指定鏈接的地址(要鏈接的位置)
如果一頁(yè)上的內(nèi)容非常多,可以在一個(gè)網(wǎng)頁(yè)中給特定的位置命名,然后再鏈接到該位置(跳轉(zhuǎn))。在給鏈接對(duì)象位置命名的時(shí)候要使用name屬性。然后,在鏈接的時(shí)候,要用href屬性在鏈接地址名稱的前面加上#號(hào)
設(shè)置鏈接到其他頁(yè)面的特定位置
<a href=”URL#位置名”>~</a>:指定鏈接源(從什么位置開始鏈接)
<a name=”位置名”>~</a>:指定鏈接的地址(要鏈接的位置)
在鏈接到其他網(wǎng)頁(yè)上的時(shí)候,可以先給那一頁(yè)上特定的位置命名,然后鏈接到該位置。在給鏈接對(duì)象位置命名的時(shí)候要使用name屬性。然后,在鏈接的時(shí)候,要用href屬性設(shè)置成”URL+#+位置名”這樣一種格式
設(shè)置鏈接文字的顏色
<body link=”指定顏色” vlink=”指定顏色” alink=”指定顏色”>~<body>
link:還沒有看見的鏈接部分的文字顏色
vlink:已經(jīng)看見的鏈接部分的文字顏色
alink:鼠標(biāo)單擊鏈接部分的文字顏色
body標(biāo)簽用于設(shè)置網(wǎng)頁(yè)整體鏈接部分的文字顏色
在新窗口中打開鏈接網(wǎng)頁(yè)
<a href=” URL” target=”窗口名”>~</a>
利用target屬性可以設(shè)置打開鏈接窗口的方式
通過設(shè)置鏈接來(lái)啟動(dòng)郵箱
<a href=”mailto:郵箱地址”>~</a>
7、制作不同類型的列表
為列表添加不同類型的標(biāo)記
<ul><li>列表項(xiàng)目1</li><><li>列表項(xiàng)目2</li>…<ul>
ul標(biāo)簽的作用是將列表(條款形式)加上圓點(diǎn)或方括號(hào)的標(biāo)記。列表的整體要在<ul>~</ul>標(biāo)簽范圍內(nèi),在這之間的各個(gè)項(xiàng)目要在<li>~</li>標(biāo)簽之內(nèi)
更改列表標(biāo)記
<ul type=”標(biāo)記種類”>~</ul>
<li type=”標(biāo)記種類”>~</li>
標(biāo)記的種類包括disc、cicle和square
制作帶序號(hào)的列表
<ol><li>列表項(xiàng)目1</li><><li>列表項(xiàng)目2</li>…<ol>
改變序號(hào)的樣式
<ol type=”序號(hào)樣式”>~</ol>
<li type=”序號(hào)樣式”>~</li>
改變序號(hào)的順序
<ol start=”開始序號(hào)”>~</ol>
<li value=”開始序號(hào)”>~</li>
制作包含專用語(yǔ)和解釋的列表
<dl><dt>專用語(yǔ)<dt><dd>對(duì)其解釋</dd>…<dl>
8、設(shè)置表格
表格的基本形式
<table border=”邊框的粗度”>~</table>:整個(gè)表格
<tr>~</tr>:?jiǎn)为?dú)一行
<th>~</th>:?jiǎn)卧瘢簶?biāo)題用
<td>~</td>:?jiǎn)卧瘢簲?shù)據(jù)用
表格的整體要圈在<table>~</table>之間顯示,表格當(dāng)中某一個(gè)單元格用<th>~</th>表示或者<td>~</td>表示。每個(gè)單元格都在表的單獨(dú)以行,放置在<tr>~</tr>中。也就是說,table標(biāo)簽的內(nèi)容是由tr標(biāo)簽構(gòu)成的。各個(gè)tr標(biāo)簽的內(nèi)容是由表示單元格的th或者td標(biāo)簽構(gòu)成的。th標(biāo)簽代表這個(gè)單元格的內(nèi)容是標(biāo)題。td標(biāo)簽代表這個(gè)單元格的內(nèi)容是數(shù)據(jù)
為表格添加標(biāo)題
<caption>~</caption>
<caption align=”對(duì)齊方式”>~</caption>
caption標(biāo)簽用來(lái)給表格添加標(biāo)題
該標(biāo)簽一定要放在table標(biāo)簽的緊后面。標(biāo)題的顯示位置(即對(duì)齊方式)可以指定在表格的上部,或者表格的下部
指定表格的大小
<table width=”寬度”>~</table>
寬度:針對(duì)像素或者窗口的百分比
指定單元格大小
<th width=”寬度” height=”高度”>~</th>
<td width=”寬度” height=”高度”>~</td>
合并單元格
<th rowspan=”垂直方向的合并數(shù)”>~</th>
<th colspan=”水平方向的合并數(shù)”>~</th>
<td rowspan=”垂直方向的合并數(shù)”>~</td>
<td colspan=”水平方向的合并數(shù)”>~</td>
垂直方向的合并數(shù):從當(dāng)前單元格開始向下合并的單元格數(shù)
水平方向的合并數(shù):從當(dāng)前單元格開始向右合并的單元格數(shù)
設(shè)置單元格之間的距離
<table cellspacing=”單元格的距離”>~</table>
設(shè)置單元格邊框與內(nèi)容之間的距離
<table cellpadding=”單元格邊框與內(nèi)容之間的距離”>~</table>
設(shè)置單元格中的行對(duì)齊方式和列對(duì)齊方式
align屬性用于設(shè)置單元格內(nèi)的行對(duì)齊方式,valign屬性用來(lái)設(shè)置單元格內(nèi)的列對(duì)齊方式
禁止在單元格內(nèi)換行
<th nowrap>~</th>
<td nowrap>~</td>
設(shè)置表格和單元格的背景顏色
bgcolor屬性用于指定表格和單元格中的背景顏色
設(shè)置表格和單元格的背景圖像
background屬性用于指定表格和單元格中的背景圖像
設(shè)置表格外框的寬度
<table border=”外框的寬度”>~</table>
設(shè)置表格外框的顯示形式
<table frame=”外框的顯示形式”>~</table>
設(shè)置表格內(nèi)補(bǔ)邊框線的顯示形式
<table rules=”內(nèi)部邊框線的顯示形式”>~</table>
定義表格中的橫行
<thead>~</thead>:表頭部分
<tbody>~</tbody>:表體部分
<tfoot>~</tfoot>:表底部分
thead標(biāo)簽、tbody標(biāo)簽和tfoot標(biāo)簽都是用來(lái)定義表格的橫行(tr標(biāo)簽)的
這樣組合之后,就可以針對(duì)該組合的整體來(lái)應(yīng)用屬性和樣式表。
使用這些標(biāo)簽的時(shí)候,一定要以thead標(biāo)簽、tfoot標(biāo)簽和tbody標(biāo)簽的順序進(jìn)行排列。在一個(gè)表格里,只能放置一個(gè)thead標(biāo)簽和一個(gè)tfoot標(biāo)簽,而tbody標(biāo)簽可以根據(jù)需要放置多個(gè)
利用縱列設(shè)置表格屬性和樣式表
<col span=”縱列數(shù)”>
<col span=”縱列數(shù)” width=”寬度”>
col標(biāo)簽不僅可以用來(lái)改變表格的縱列結(jié)構(gòu),還可以用來(lái)根據(jù)縱列,來(lái)綜合指定寬和行對(duì)齊方式等屬性以及樣式表
該標(biāo)簽放置的位置要在caption標(biāo)簽的緊后面(如果沒有caption標(biāo)簽,就放在table標(biāo)簽的開始標(biāo)簽的緊后面),以及thead標(biāo)簽和tr標(biāo)簽的前面
設(shè)置表格居中
<table align=”center”>~</table>
將表格嵌入到文本中
<table align=”對(duì)齊方式”>~</table>
位置:left,right
將table標(biāo)簽的align屬性指定為left或者right后,就可以將表格以居左或居右的方式嵌入到文字中間
如果想要解除嵌入狀態(tài),可以使用<br>標(biāo)簽的clear屬性
解除表格的嵌套
<br clear=”解除表格那一側(cè)的嵌套”>
left:解除左側(cè)表格的嵌套
right:解除右側(cè)表格的嵌套
all:解除兩側(cè)表格的嵌套
設(shè)置表格與嵌套文字之間的距離
<table vspace=”垂直距離” hspace=”水平距離”>~</table>
垂直距離:表格的上下框與文字間的距離
水平距離:表格的左右框與文字間的距離
9、設(shè)置圖像與多媒體
插入圖像
<img src=”URL” width=”寬度” hignt=”高度” alt=”替代文字”>
使用img標(biāo)簽,可以把圖像插入到HTML文件中
圖像的格式一般可以使用GIF格式、JPEG格式和PNG格式
不管圖像實(shí)際的大小如何,都會(huì)按照在這里所指定的寬度和高度來(lái)顯示
alt屬性是在不能顯示圖像的情況下,指定替代圖像所使用的文字
設(shè)置圖像的邊框
<img src=”URL” alt=”替代文字” border=”邊框的粗度”>
設(shè)置圖像與文字的垂直位置關(guān)系
<img src=”URL” alt=”替代文字” align=”對(duì)齊方式”>
在同一行中,如果有圖像和文字,那么就可以用align屬性來(lái)設(shè)置圖像和文字的垂直位置關(guān)系
制作圖像熱區(qū)
<img src=”URL” alt=”替代文字” usemap=”#map名”>
<map name=”map名”>~</map>
<area shape=”形狀” cords=”坐標(biāo)” href=”URL” alt=”替代文字”>
在map標(biāo)簽中,用來(lái)設(shè)置實(shí)際單擊的區(qū)域和鏈接地址的是area標(biāo)簽
在area標(biāo)簽中,一定要指定表示鏈接地址的替代文字,之后要用image標(biāo)簽的usemap屬性指定定義后的image map的名稱(名稱前面要加#),這樣圖像就可以作為image map產(chǎn)生相應(yīng)的效果
將圖像嵌套在文本中
<img src=”URL” alt=”替代文字” align=”對(duì)齊方式”>
位置:left,right
解除圖像的嵌套
<br clear=”解除哪一側(cè)圖像的嵌套”>
設(shè)置圖像與周圍文字之間的距離
<img src=”URL” alt=”替代文字” vspace=”垂直距離” hspace=”水平距離”>
放置Java小程序
<applet code=”類文件名” width=”寬度” height=”高度” >~</applet>
<param name=”參數(shù)名” value=”參數(shù)值”>
applet標(biāo)簽是嵌入Java小程序時(shí)要使用的標(biāo)簽
如果使用param標(biāo)簽,在執(zhí)行java小程序時(shí),需事先指定一些必要值。這時(shí),param標(biāo)簽要位于<applet>~</applet>范圍的開始部分
10、制作不同類型的表單
制作填寫表單
<form action=”URL” method=”發(fā)送形式” enctype=”MIME類型” target=”窗口名稱”>~</form>
URL:用來(lái)處理發(fā)送后表格的程序的URL
發(fā)送形式:get,post
MIME類型:以post方式發(fā)送內(nèi)容時(shí)的MIME類型
窗口名稱:先是發(fā)送結(jié)果的窗口或框架名
form標(biāo)簽表示在表單中填寫的內(nèi)容是可以發(fā)送的
制作發(fā)送按鈕
<input type=”submit” value=”標(biāo)簽” name=”名稱”>
標(biāo)簽:在按鈕上顯示的文字
名稱:按鈕的名稱
將input標(biāo)簽的type屬性設(shè)置為submit,再根據(jù)form標(biāo)簽的設(shè)置,可以制作發(fā)送填寫在表單中數(shù)據(jù)的按鈕
制作重置按鈕
<input type=”reset” value=”標(biāo)簽”>
制作通用按鈕
<input type=”button” name=”名稱” value=”標(biāo)簽”>
通用按鈕通常與JavaScript等腳本語(yǔ)言組合使用
利用圖像來(lái)制作發(fā)送按鈕
<input type=”image” src=”URL” name=”名稱” alt=”替代文字” align=”對(duì)齊方式”>
通常,發(fā)送按鈕都使用input type=”submit”代碼,不過圖像也可以作為發(fā)送按鈕,具有發(fā)送功能。這時(shí),圖像被單擊的位置將和表單的內(nèi)容一起被發(fā)送
制作不同功能的發(fā)送按鈕
<button type=”類型” name=”名稱” value=”發(fā)送值”>~</button>
類型:submit,reset,button
button標(biāo)簽是用來(lái)制作按鈕專用的
通過指定type屬性值,就可以產(chǎn)生具有不同功能的按鈕,包括發(fā)送按鈕、重置按鈕和通用按鈕。另外,在<button>~</button>中放置相應(yīng)的內(nèi)容,可以作為按鈕的標(biāo)簽顯示出來(lái)。在需要進(jìn)行其他處理并設(shè)置多個(gè)發(fā)送按鈕的情況下,根據(jù)name屬性和value屬性所顯示的值,接受方就可以分辨出單擊的是哪一個(gè)發(fā)送按鈕
制作單行文本框
<input type=”text” name=”名稱” value=”默認(rèn)文字” size=”寬度” maxlength=”字符的大輸入數(shù)量”>
制作多行文本框
<textarea name=”名稱” rows=”行數(shù)” cols=”寬度”>~</textarea>
制作輸入密碼的文本框
<input type=”password” name=”名稱” value=”默認(rèn)文字” size=”寬度” maxlength=”字符的大輸入數(shù)量”>
插入隱藏域
<input type=”hidden” name=”名稱” value=”發(fā)送值” >
制作單選按鈕
<input type=”radio” name=”名稱” value=”發(fā)送文字” >
<input type=”radio” name=”名稱” value=”發(fā)送文字” checked>
將input標(biāo)簽的type屬性設(shè)置為radio,可以用來(lái)制作單選按鈕。單選按鈕是多個(gè)選項(xiàng)當(dāng)中只能選擇其一的按鈕。作為公共項(xiàng)目的選項(xiàng)而使用的單選按鈕,要把它們都指定為同一名稱。另外,發(fā)送數(shù)據(jù)的時(shí)候,為了識(shí)別所選的是哪一項(xiàng),要用value屬性來(lái)指定相應(yīng)的值
制作復(fù)選框
<input type=”checkbox” name=”名稱” value=”發(fā)送文字” >
<input type=” checkbox” name=”名稱” value=”發(fā)送文字” checked>
將input標(biāo)簽的type屬性設(shè)置為checkbox,可以用來(lái)制作復(fù)選框。復(fù)選框可以在多個(gè)選項(xiàng)當(dāng)中進(jìn)行多項(xiàng)選擇。作為公共項(xiàng)目的選項(xiàng)而使用的復(fù)選框,要把它們都指定為同一名稱。另外,發(fā)送數(shù)據(jù)的時(shí)候,為了識(shí)別所選的是哪一項(xiàng),要用value屬性來(lái)指定相應(yīng)的值
制作菜單
<select name=”名稱”>~</select>:菜單整體
<option value=”發(fā)送值”>~</option>:菜單項(xiàng)
<option selected>~</option>:菜單項(xiàng)
select標(biāo)簽用來(lái)制作菜單
菜單的整體要在<select>~</select>范圍之內(nèi)顯示,然后按需要的數(shù)量在其中放置表示選項(xiàng)的<option>~</option>。<option>~</option>范圍之內(nèi)要寫上實(shí)際菜單要顯示的選項(xiàng)的名稱。另外,如果省略了value屬性,在這里記錄的文字本身就會(huì)作為所選值發(fā)送
組合菜單選項(xiàng)
<optgroup lable=”組合名稱”>~</optgroup>:制作組合菜單
<option lable=”次選項(xiàng)”>~</option>:組合內(nèi)的選項(xiàng)
組合名稱:先進(jìn)級(jí)顯示的組合標(biāo)題
次選項(xiàng):對(duì)應(yīng)組合名稱下面的在第二級(jí)顯示出來(lái)的選項(xiàng)
制作的菜單選項(xiàng)可以利用<select>~</select>標(biāo)簽組合起來(lái)
制作下拉列表
<select size=”行數(shù)” name=”名稱” multiple>~</select>:下拉列表框
<option value=”發(fā)送值”>~</option>:菜單項(xiàng)
<option selected>~</option>:菜單項(xiàng)
在用于制作菜單的select標(biāo)簽中指定了size屬性后,就可以顯示下拉列表框
添加選擇文件的功能
<input type=”file” name=”名稱”accept=”MIME”類型>
將input標(biāo)簽的type屬性設(shè)置為file,可以自動(dòng)做成能夠選擇發(fā)送表單數(shù)據(jù)的文件按鈕和文本框
綜合利用菜單選項(xiàng)
<fieldset>~</fieldset>:組合
<legend align=”對(duì)齊方式”>~</legend>:組合的標(biāo)題
field標(biāo)簽用來(lái)把填寫在表單中需要包含的輸入內(nèi)容和選項(xiàng)組合起來(lái)
在<fieldset>~</fieldset>的開始部分放置legend標(biāo)簽,并且給該組合加上標(biāo)題
將標(biāo)簽文字與項(xiàng)目一體化
<label for=”參照ID”>~</lable>
參照ID:添加了標(biāo)簽的對(duì)象的id屬性值
lable標(biāo)簽的作用是在輸入項(xiàng)和選項(xiàng)及其標(biāo)簽文字之間建立起明確的關(guān)聯(lián),并使其一體化
11、利用框架布局網(wǎng)頁(yè)
設(shè)置框架整體結(jié)構(gòu)
<frameset rows=”高度”>~</frameset>
<frameset cols=”寬度”>~</frameset>
<frame src=”URL” name=”框架名稱”>
高度:在垂直方向上分布的多個(gè)框架的高度,按從上到下的順序依次用逗號(hào)隔開來(lái)指定
寬度:在水平方向上分布的多個(gè)框架的寬度,按從左到右的順序依次用逗號(hào)隔開來(lái)指定
URL:作為框架內(nèi)容顯示的HTML文件的URL
框架名稱:在指定鏈接等顯示目標(biāo)的時(shí)候使用的名稱
使用框架功能可以把窗口橫豎切割開,然后在不同的塊區(qū)域中顯示其他的HTML文件。在指定了框架的文件中,原來(lái)body標(biāo)簽所在的位置,要放置frameset標(biāo)簽,這主要是由于在框架頁(yè)面中不能使用body標(biāo)簽
在<frameset>~</frameset>的范圍中要按照順序填入分割后框架內(nèi)要填寫的內(nèi)容。如果不需要再分割,就用frame標(biāo)簽指定要導(dǎo)入的HTML文件,如果還要繼續(xù)分割的話,就需要放置frameset標(biāo)簽(作為嵌套放置在里面,并且指定蓋框架如何分割)
設(shè)置框架的顯示方法
<frame scrolling=”滾動(dòng)控制” noresize>
<frame marginwidth=”左右縮進(jìn)” marginheight=”上下縮進(jìn)”>
設(shè)置是否顯示邊框
<frame frameborder=”顯示指定框架的邊框”>
frameborder屬性用來(lái)設(shè)置分割開相鄰框架的邊框是否顯示
去除分割框架的邊框
<frameset frameborder=”0” framespacing=”0” border=”0”>
在不支持框架的環(huán)境中顯示所需內(nèi)容
<noframes>~</noframes>
這個(gè)標(biāo)簽要在<frameset>~</frameset>范圍的開始或者后處放置一個(gè)。在<noframes>~</noframes>范圍內(nèi)要首先放置body標(biāo)簽,并在其中填寫所要顯示的內(nèi)容。
指定鏈接目標(biāo)在哪一個(gè)框架內(nèi)顯示
<a href=”URL” target=”框架名”>~</a>
如果對(duì)框架內(nèi)的文件中指定的鏈接不進(jìn)行設(shè)置的話,就會(huì)在原來(lái)的相同框架中顯示鏈接目標(biāo),如果想使這個(gè)鏈接目標(biāo)在其他框架中顯示的話,就需要指定target屬性值,用想要顯示(frame標(biāo)簽)的那個(gè)框架的name屬性來(lái)指定框架名稱
插入內(nèi)嵌框架
<iframe src=”內(nèi)容的URL” name=”框架名”>~</iframe>
iframe標(biāo)簽不僅可以放置分割窗口形式的框架,還可以在窗口中放置獨(dú)立顯示的內(nèi)嵌框架。在框架內(nèi)還可以顯示src屬性所指定的內(nèi)容
如果瀏覽器不支持這種框架,要在<iframe>~</iframe>之間指定要顯示的內(nèi)容
12、關(guān)于腳本
在HTML中插入腳本
<script type=”MME類型”>~</script>
<script type=”MME類型” language=”語(yǔ)言名稱” src=”URL”>~</script>
在HTML文件中編寫腳本的時(shí)候要用到script標(biāo)簽,腳本語(yǔ)言要寫在這個(gè)標(biāo)簽的范圍內(nèi)
這時(shí),在不支持這個(gè)標(biāo)簽的瀏覽器上會(huì)在畫面上顯示出腳本的部分,為了避免這種現(xiàn)象,通常把腳本整體作為HTML的注釋。這個(gè)標(biāo)簽可以放在<head>~</head>和<body>~</body>范圍內(nèi)的任意位置上
在不能執(zhí)行腳本的環(huán)境中添加所需的內(nèi)容
<noscript>~</noscript>
在腳本不能運(yùn)行的時(shí)候,可以使用noscript標(biāo)簽來(lái)指定替代顯示的內(nèi)容
這個(gè)標(biāo)簽要放置在<body>~</body>的范圍內(nèi)