- Dreamweaver CS3網頁制作
- 楊杰 段欣主編
- 1058字
- 2019-01-01 06:23:39
1.3 HTML語言的基礎知識
1．HTML語言概述
HTML是Hypertext Marked Language的縮寫，即超文本標記語言，是目前網絡上應用最為廣泛的語言，也是構成網頁文檔的主要語言。只有采用HTML制作的網頁，瀏覽器才能正確地閱讀和運行。
用HTML語言制作網頁，一般有兩種方法：一種是使用記事本之類的工具，輸入HTML的源代碼，然后保存為以.html或.htm為擴展名的網頁文件；另一種是使用可視化的網頁制作工具，根據用戶的可視化操作自動生成HTML代碼，如Dreamweaver、FrontPage等軟件。
2．HTML文檔基本結構
一個HTML文檔是由一系列的元素和標記組成的，HTML用標記來規定元素的屬性和它在文件中的位置。HTML文檔的結構包括頭部分（head）和正文主體部分（body）兩大部分，其中頭部分描述瀏覽器所需的信息，而主體部分則包含所要說明的具體內容。具體結構如下。
<html>
<head>
頭部信息
</head>
<body>
正文主體部分
</body>
</html>
<html>標記用于HTML文檔的最前面，用來標識HTML文檔的開始，而</html>標記恰恰相反，它放在HTML文檔的最后面，用來標識HTML文檔的結束，這兩個標記必須一起使用。
<head>和</head>標記構成HTML文檔的開頭部分，可以包含<title></title>、<script></script>等標記，這些標記都是描述HTML文檔相關信息的標記。
<body></body>是HTML文檔的主體部分，可包含<p></p>、<img>、<br>、<a></a>等標記，其內容將在瀏覽器窗口中顯示出來。
提示
● 在HTML文檔中，所有的標記都要用括號<>括起來，如<p>、<hr>。
● HTML標記不區分大小寫。
● 標記中如果包含多個參數，各參數之間用空格分隔，參數位置不受限制。
3．HTML常用標記
（1）標題標記
格式：<title>網頁的標題</title>
說明：該標記在<head></head>標記中，所包含的文字將出現在瀏覽器的標題欄上。
（2）主體標記
格式：<body bgcolor="頁面背景顏色" background="背景圖像" text="文本顏色">
主體內容
</body>
說明：包括所有主體內容，可以設置頁面的背景顏色、背景圖像、文字顏色等屬性。
例如，將圖像tx.jpg設置為網頁背景圖像，網頁文字顏色為黑色。
<body background="tx.jpg" text="#000000">
主體內容
</body>
（3）段落標記
格式：<p align="對齊方式">段落文本</p>
說明：用來劃分段落，在該標記中可以輸入一段文字。
例如，將標題“倡議書”居中顯示。
<p align="center">倡議書</p>
（4）換行標記
格式：<br>
說明：用來標記一個換行動作，換行后的內容與原內容仍屬于同一段落。
（5）水平線標記
格式：<hr align="對齊方式" color="顏色" width="寬度" size="高度">
說明：在頁面中插入一條水平線，通常用于分割文檔。
例如，插入一條紅色水平線，并居中顯示。
<hr align="center" color="#ff0000">
（6）圖像標記
格式：<img src="圖像的URL" align="對齊方式" width="寬度" height="寬度" alt="替換文字">
說明：在頁面中插入一幅圖像。
例如，插入圖像images文件夾中的tx.jpg，寬度和高度均為300像素，鼠標指向圖像或圖像不能正常瀏覽時提示“風景圖片”。
<img src="images/tx.jpg" width="300" height="300" alt="風景圖片">
（7）超鏈接標記
格式：<a href="目標文件的URL" target="目標屬性">文本或圖像</a>
說明：為標記中的文本或圖像添加超鏈接目標，瀏覽網頁時單擊可打開指定的目標文件。
例如，為文本“新浪網”創建超鏈接到http://www.sina.com。
<a >新浪網</a>
（8）表格標記
表格標記由表格標記、行標記和單元格標記3部分組成。
● 表格標記
<table width="寬度" height="高度" align="對齊方式" border="邊框寬度" cellpadding="單元格邊距" cellspacing ="單元格間距">…</table>
● 行標記
<tr>…</tr>
● 單元格標記
<td rowspan="跨越行數" colspan ="跨越列數">…</td>
例如，創建一個如圖1-26所示的表格，對應的源代碼如下。
圖1-26 表格
<table width="300" height="95" border="1" cellpadding="0" cellspacing="0">
<tr align="center">
<td >新聞</td> <td >體育</td> <td>音樂</td>
</tr>
<tr>
<td colspan="3" bgcolor="#FFCCFF"> </td>
</tr>
</table>