???????做完HTML的相關(guān)任務(wù),覺得自己得好好總結(jié)一下,總結(jié)一下一些標(biāo)簽的用法。
HTML結(jié)構(gòu)
???????一個完整的 HTML 文檔的結(jié)構(gòu)如下所示,主要由兩大部分組成:<head></head>標(biāo)簽組成的頭部和<body></body>標(biāo)簽組成的主體。
<html >
<head >
<title></title>
</head>
<body>
</body>
</html>
文字
標(biāo)題
| 標(biāo)題 | 標(biāo)簽 |
|---|---|
| 一級標(biāo)題 | <h1></h1> |
| 二級標(biāo)題 | <h2></h2> |
| 三級標(biāo)題 | <h3></h3> |
| 四級標(biāo)題 | <h4></h4> |
| 五級標(biāo)題 | <h5></h5> |
| 六級標(biāo)題 | <h6></h6> |
加粗和斜體
通過<b></b>標(biāo)簽實(shí)現(xiàn)字體的加粗,<i></i>或<em></em>或<cite></cite>標(biāo)簽實(shí)現(xiàn)斜體。下面舉個例子
<html>
<head>
<title></title>
</head>
<body>
<b>我是粗體</b>
<br />
<i>我是斜體1號</i>
<br />
<cite>我是斜體2號</cite>
<br />
<em>我是斜體3號</em>
</body>
</html>
看一下效果:

列表
???????列表主要分為兩種有序列表和無序列表。有序列表使用一對<ol></ol>標(biāo)簽,無序列表使用一對<ul></ul>標(biāo)簽,不管是有序列表還是無序列表列表的每一項(xiàng)都要使用<li></li>標(biāo)簽。主要語法如下:
<ul>
<li>無序列表第一項(xiàng)</li>
<li>無序列表第二項(xiàng)</li>
</ul>
<ol>
<li>有序列表第一項(xiàng)</li>
<li>有序列表第二項(xiàng)</li>
</ol>
文章HTML之列表生成就是對使用HTML生成列表的一個運(yùn)用。
鏈接、圖片和多媒體
鏈接
??????? 鏈接使用<a></a>標(biāo)簽定義,鏈接地址在href屬性中指定?;菊Z法為:
??????? <a href=‘URL’>鏈接文字</a>
???????<a></a>標(biāo)簽中有一個target屬性,用來設(shè)定鏈接的窗口:
target值 |
含義 |
|---|---|
_parent |
在上一級窗口中打開 |
_blank |
在新窗口中打開 |
_self |
在同一窗口中打開。(默認(rèn)) |
_top |
在瀏覽器的整個窗口中打開 |
圖片
???????html 中插入圖片使用<img>標(biāo)簽,舉例子說明:
<html>
<body>
<img src="picture/123.jpeg" alt=""/>
</body>
</html>
???????效果如下:

???????我們可以把鏈接和圖片進(jìn)行結(jié)合,設(shè)置圖片的鏈接,基本語法:
???????<a href=”目標(biāo)地址”><img src=”圖片路徑” /> </a>
多媒體
???????通過<embed ></embed>標(biāo)簽可以在網(wǎng)頁中可播放MP3音樂、電影、flash動畫等多媒體內(nèi)容。<embed >是 html5 中的新標(biāo)簽,還是通過例子來說明:
<html >
<body>
<embed src="Video/smallVideo.avi"></embed>
</body>
</html>
???????看一下效果:

表格
???????HTML中創(chuàng)建表格由<table></table> <tr></tr> <td></td>這三對標(biāo)簽組成, <tr></tr>為行標(biāo)簽,<td></td>為單元格標(biāo)簽。
<html>
<body>
<table border="1">
<tr>
<td>第一行第一列</td>
<td>第一行第二列</td>
</tr>
<tr>
<td>第二行第一列</td>
<td>第二行第二列</td>
</tr>
</table>
</body>
</html>
看一下效果:

???????還可以合并表格中的行或列,可以查看文章HTML之創(chuàng)建表格
input標(biāo)簽
???????input標(biāo)簽功能比較強(qiáng)大,既可以生成文本框又可以生成按鈕等,基本的語法結(jié)構(gòu)為:<input type=“…” name=“…” value=“…” > 不同的type的值代表不同的含義。
| type值 | 含義 |
|---|---|
text |
文本框 |
password |
密碼框 |
file |
文件輸入框 |
button |
普通按鈕 |
submit |
提交按鈕 |
reset |
重置按鈕 |
image |
使用圖片顯示按鈕 |
radio |
單選框 |
checkbox |
多選框 |
button標(biāo)簽
???????除了上述所說的通過<input />標(biāo)簽創(chuàng)建按鈕外,還可以通過<button></button>標(biāo)簽來創(chuàng)建?;菊Z法:<button type=" "> </button>,type值可以為button 、reset 、submit,分別代表普通按鈕、重置按鈕、提交按鈕。由于<button></button>標(biāo)簽含有關(guān)閉標(biāo)簽,因此可以對其進(jìn)行樣式化,使用它創(chuàng)建的按鈕具有更豐富的表現(xiàn)功能。
div 和 span 標(biāo)簽
???????還是先通過例子來感受一下 div 標(biāo)簽和 span 標(biāo)簽
<html >
<body>
<div>我是div 1號</div>
<div>我是div 2號</div>
<span>我是span 1號</span>
<span>我是span 2號</span>
</body>
</html>
效果:

???????通過上面的例子,我們可以看到
<div>標(biāo)簽占一行,而<span>標(biāo)簽則為文字內(nèi)容有多少,就占多少空間。所以<div>一般用于排版,<span>一般用于局部文字的樣式。