HTML編程基礎
來源：尚品中國|
類型：網站百科
|時間：2014-06-16
通常情況下，人們應用Dreemwcave以可視化的方式設計網頁。而直接用HTML標記符設計網頁的情況則較少，對HTML標記符也了解不多，但在動態網頁設計中，常常需要利用ASP代碼摘出網頁的部分HTM L代碼，此時必須熟悉HTML標記符，因此，本章將對常用的HTMI標記符進行介紹。
1. 1. 1什么是HTML
HTML(街pertext Markup Language)即超文本標記語育，是一種用來在WWW (World Wide Web) L表示信息的描述性的標記語言。
HTML文本是由HTML標記組成的描述性文本。HTML標記可以描述文字、圖形、動網、聲音、表格、鏈接等。生成一個HTMI文本述常可以通過以下四種方法:
I)利用各種文本編輯器(如Windows記事本)i is接使用HTML語言編寫。
2)借助一錢HTMI.的編輯工其，如FroniPage、HotDog等。
3)其他格式的文檔(如Word文檔)轉換成HTML文本。
4)山Web服務器端實時動態地生成。
下面應用第一種方法完成一個簡單的實例
1. 1.2一個簡單的HTM 1.實例
I例1-1)創建一個簡單的網貞，步驟如下:
1)選擇“開始”一“程序”，“附件”一“記事本”命令，打開記事本程序。翰人以
下HTML代碼
<HTMI)
<HEAD>
< TITLE > I ITM L實例</TITLE>
</HEAD)
< BODY Bgcolor = "#FFFFFF">
<P》這是一個簡單的HTML實例</P>
</BODY>
</HTMI>
2)選擇“文件.菜單下的“保存，命令.打開“保存”對話框，在輸人文件名和文件擴展名(1-1. him),選擇合適的目錄.然后單擊“保存”
3)在瀏覽器中打開運行該文件(1-1. him)，運行結果如圖1-1所示。
從以上過程可以看出，使用HTML語言確實能夠很容易地制作網頁，但是這樣的網頁距離關觀實用的要求顯然還有一定差距。因此后面的章節將會詳細地介紹如何利用HTML諸言的其他標記符來修飾文字和圖像等頁面元素。
1.2 HTML常用標記
標記符是HTML語言中定義網頁內容格式和顯示的指令.制網貞內容的顯示效果。
1.2.1頁面基本屬性標記
而標記符的屬性用于進一步控制網頁的內容多么豐富、版式多么復雜，網頁的基本結構卻都是一樣的。
1.網頁的基本結構
如下所示:
<HTML>
<HEAD)
< TITLE>文檔標題<,TITLE》
</HEAD>
< BODY>
這是HTMI文檔的主要部分
</BODY>
</HTML>
HTML的結構包括頭部(HEAD)、主體(BODY)兩大部分.其中頭部描述瀏覽器所需的信息，而主體則包含頁面的具體內容及格式說明。
2.語官字符維，(Charsets)的信息
<META HTTP-EQUIV ="CONTENT-TYPE" CONTENT="TEXT/HTML;CHARSET=#">
#=US-ASCII,ISO-8859-I,X-MAC-ROMAN, 150-8859-2, X-MAC-CE, ISO-2022-JP, X-SJIS,X-EUC-JP, EUC-KR, ISO-2022-KR, GB2312, GB_ 2312-80, X-EUC-TW, X-CNS11643-1，X-CNSI 1643-2, BIG5
可在HTML文件中設置MIME字符集(i息。您在瀏覽主頁時.最好自己在瀏覽器的選項菜單內選擇相應的語言(language encoding),但是如果HTML文件里寫明了設置，瀏覽器就會自動設置語言選項。如果主頁里用到了字符實體(entities),則該主頁就應該寫明字符集信息，否則，您在瀏覽該主頁時，若未正確設置語言選項，顯示將可能混亂。
3.背.色彩和文字色影
設置網貞的背景色彩和文字色彩可通過設置BODY標記的屬性來實現，具體格式如下:
<BODY Rgcolor=# Text=#Link# Alink=# Vlink=#>
BODY標記各參數的含義見表1-l
4.添加注釋
由于Web站點需要經常更新，而且制作時往往是幾個人合作，所以創建的頁面必須易于維護，而添加增強文件可讀性的重要手段。
HTML中的注釋是由<!一(開始標記符)和一>(結束標記符)組成的。這兩個標記符中間的內容就是注釋的內容，它們不會在瀏覽器中顯示。
5.畫線
在網頁中產生分隔線可用<HR>標記來實現，其用法為:
<HR Width=寬度值Size=線的高度Align，=對齊方式Noshade>
屬性說明:
I) Width用于指定分隔線的寬度.寬度優的指定方式有兩種.一是用像素點來指定，
例如.若要產生寬度為500像素的直線，則實現代碼為:
<HR Width=500>
另一種方法是用百分比表達，例如，若要產生寬度是網頁寬度的75%分隔線，則實現代碼如下:
<HR Width二.75%.>
2) Si，用于指定直線的高度。例如.要繪制寬度為80%,高度為l的直線，則實現代
碼如下:
<HR Width ="80%" Size=1>
3) Align指定直線的對齊方式，取值有left、Center、Right。
4) Noahade指定直線是否有陰形。如果帶有該參數，則直線無陰影。
<HR>標記一般用于產生水平分隔線，若要產生豎直線，可將Width設置為1, Size設置為豎直線的高度誼。例如:< HR Width= I Size= 500 Noshade >
1.2.2文字屬性標記
文字是網頁中最主要的頁面元素，HTML語言提供了一些用來修飾文字的標記符，可以川它們來設置文字的字體、顏色、大小和樣式等屬性。
1.字體控制
<FONT >標記符是用來控制文字的字體、大小和顏色的。其語法格式為:
<FONT Face=“fonlname" Size=“fontaize" Color="#RRGCBB">文本</FONT>
屬性說明:
Face屬性用于指定字體;Size用于指定字體的大小;Color用于設置字體的顏色。字體大小的表達方法有兩種，一是設置為絕對字號，此時的設置優可以是1~7, 1號最小，7號最大，默認字號為3，可利用< BASEFONT Size=字號>設置或更改默認字號。例如，若要以綠色，宋體4號字輸出“HTML實例”，則實現代碼為:
< FONT Face=“宋體”Size=4 Color=“#008000">HTML實例</FONT >
另一種設置為相對字號大小，此時的用法為<FONT Size=±n>，其中n代表字號改變的量，+表示字體在默認字號的基礎上增大字號，- 表示在默認字號的基礎上遞減字號。例如:
< BASEFONT Size=3)
<FONT Size= +2>HTML實例</FONT >
2.標題的字號
語法格式為:
< Hn)</Hn>
說明:n是1 -6的數字，<HI>表示最大的標題，<H6>表示最小的標題。在默認狀態下，<Hn>標記符中的文字在瀏覽器中顯示時都是黑體，而且文字將自動在</Hn>標記符后換行。
【例1-2】在網頁中分別用六級標題標記符拍出一個側試效果的文本。
<HTML >
<HEAD >
<TITLE>標越字體演示</TITLE》
</HEAD >
<BODY Bgcolor = " #FFFFFF" Text=“#000000”>
<Hl>這是第一級標題</H1>
<H2》這是第二級標腸</H2>
<H3>這足第三級標題</H3>
<H4>這是第四級標腸</H4 >
<115》這是第五級標題</HS>
<H6>這是第六級標題</H6>
</BODY)
</HTML>
運行結果如圖，1-2所示。
HTML(街pertext Markup Language)即超文本標記語育，是一種用來在WWW (World Wide Web) L表示信息的描述性的標記語言。
HTML文本是由HTML標記組成的描述性文本。HTML標記可以描述文字、圖形、動網、聲音、表格、鏈接等。生成一個HTMI文本述常可以通過以下四種方法:
I)利用各種文本編輯器(如Windows記事本)i is接使用HTML語言編寫。
2)借助一錢HTMI.的編輯工其，如FroniPage、HotDog等。
3)其他格式的文檔(如Word文檔)轉換成HTML文本。
4)山Web服務器端實時動態地生成。
下面應用第一種方法完成一個簡單的實例
1. 1.2一個簡單的HTM 1.實例
I例1-1)創建一個簡單的網貞，步驟如下:
1)選擇“開始”一“程序”，“附件”一“記事本”命令，打開記事本程序。翰人以
下HTML代碼
<HTMI)
<HEAD>
< TITLE > I ITM L實例</TITLE>
</HEAD)
< BODY Bgcolor = "#FFFFFF">
<P》這是一個簡單的HTML實例</P>
</BODY>
</HTMI>
2)選擇“文件.菜單下的“保存，命令.打開“保存”對話框，在輸人文件名和文件擴展名(1-1. him),選擇合適的目錄.然后單擊“保存”
3)在瀏覽器中打開運行該文件(1-1. him)，運行結果如圖1-1所示。
從以上過程可以看出，使用HTML語言確實能夠很容易地制作網頁，但是這樣的網頁距離關觀實用的要求顯然還有一定差距。因此后面的章節將會詳細地介紹如何利用HTML諸言的其他標記符來修飾文字和圖像等頁面元素。
1.2 HTML常用標記
標記符是HTML語言中定義網頁內容格式和顯示的指令.制網貞內容的顯示效果。
1.2.1頁面基本屬性標記
而標記符的屬性用于進一步控制網頁的內容多么豐富、版式多么復雜，網頁的基本結構卻都是一樣的。
1.網頁的基本結構
如下所示:
<HTML>
<HEAD)
< TITLE>文檔標題<,TITLE》
</HEAD>
< BODY>
這是HTMI文檔的主要部分
</BODY>
</HTML>
HTML的結構包括頭部(HEAD)、主體(BODY)兩大部分.其中頭部描述瀏覽器所需的信息，而主體則包含頁面的具體內容及格式說明。
2.語官字符維，(Charsets)的信息
<META HTTP-EQUIV ="CONTENT-TYPE" CONTENT="TEXT/HTML;CHARSET=#">
#=US-ASCII,ISO-8859-I,X-MAC-ROMAN, 150-8859-2, X-MAC-CE, ISO-2022-JP, X-SJIS,X-EUC-JP, EUC-KR, ISO-2022-KR, GB2312, GB_ 2312-80, X-EUC-TW, X-CNS11643-1，X-CNSI 1643-2, BIG5
可在HTML文件中設置MIME字符集(i息。您在瀏覽主頁時.最好自己在瀏覽器的選項菜單內選擇相應的語言(language encoding),但是如果HTML文件里寫明了設置，瀏覽器就會自動設置語言選項。如果主頁里用到了字符實體(entities),則該主頁就應該寫明字符集信息，否則，您在瀏覽該主頁時，若未正確設置語言選項，顯示將可能混亂。
3.背.色彩和文字色影
設置網貞的背景色彩和文字色彩可通過設置BODY標記的屬性來實現，具體格式如下:
<BODY Rgcolor=# Text=#Link# Alink=# Vlink=#>
BODY標記各參數的含義見表1-l
由于Web站點需要經常更新，而且制作時往往是幾個人合作，所以創建的頁面必須易于維護，而添加增強文件可讀性的重要手段。
HTML中的注釋是由<!一(開始標記符)和一>(結束標記符)組成的。這兩個標記符中間的內容就是注釋的內容，它們不會在瀏覽器中顯示。
5.畫線
在網頁中產生分隔線可用<HR>標記來實現，其用法為:
<HR Width=寬度值Size=線的高度Align，=對齊方式Noshade>
屬性說明:
I) Width用于指定分隔線的寬度.寬度優的指定方式有兩種.一是用像素點來指定，
例如.若要產生寬度為500像素的直線，則實現代碼為:
<HR Width=500>
另一種方法是用百分比表達，例如，若要產生寬度是網頁寬度的75%分隔線，則實現代碼如下:
<HR Width二.75%.>
2) Si，用于指定直線的高度。例如.要繪制寬度為80%,高度為l的直線，則實現代
碼如下:
<HR Width ="80%" Size=1>
3) Align指定直線的對齊方式，取值有left、Center、Right。
4) Noahade指定直線是否有陰形。如果帶有該參數，則直線無陰影。
<HR>標記一般用于產生水平分隔線，若要產生豎直線，可將Width設置為1, Size設置為豎直線的高度誼。例如:< HR Width= I Size= 500 Noshade >
1.2.2文字屬性標記
文字是網頁中最主要的頁面元素，HTML語言提供了一些用來修飾文字的標記符，可以川它們來設置文字的字體、顏色、大小和樣式等屬性。
1.字體控制
<FONT >標記符是用來控制文字的字體、大小和顏色的。其語法格式為:
<FONT Face=“fonlname" Size=“fontaize" Color="#RRGCBB">文本</FONT>
屬性說明:
Face屬性用于指定字體;Size用于指定字體的大小;Color用于設置字體的顏色。字體大小的表達方法有兩種，一是設置為絕對字號，此時的設置優可以是1~7, 1號最小，7號最大，默認字號為3，可利用< BASEFONT Size=字號>設置或更改默認字號。例如，若要以綠色，宋體4號字輸出“HTML實例”，則實現代碼為:
< FONT Face=“宋體”Size=4 Color=“#008000">HTML實例</FONT >
另一種設置為相對字號大小，此時的用法為<FONT Size=±n>，其中n代表字號改變的量，+表示字體在默認字號的基礎上增大字號，- 表示在默認字號的基礎上遞減字號。例如:
< BASEFONT Size=3)
<FONT Size= +2>HTML實例</FONT >
2.標題的字號
語法格式為:
< Hn)</Hn>
說明:n是1 -6的數字，<HI>表示最大的標題，<H6>表示最小的標題。在默認狀態下，<Hn>標記符中的文字在瀏覽器中顯示時都是黑體，而且文字將自動在</Hn>標記符后換行。
【例1-2】在網頁中分別用六級標題標記符拍出一個側試效果的文本。
<HTML >
<HEAD >
<TITLE>標越字體演示</TITLE》
</HEAD >
<BODY Bgcolor = " #FFFFFF" Text=“#000000”>
<Hl>這是第一級標題</H1>
<H2》這是第二級標腸</H2>
<H3>這足第三級標題</H3>
<H4>這是第四級標腸</H4 >
<115》這是第五級標題</HS>
<H6>這是第六級標題</H6>
</BODY)
</HTML>
運行結果如圖，1-2所示。
來源聲明：本文章系尚品中國編輯原創或采編整理，如需轉載請注明來自尚品中國。以上內容部分(包含圖片、文字)來源于網絡，如有侵權，請及時與本站聯系（010-60259772）。
推薦新聞
更多行業-
面向客戶的網絡銀行戰略
網絡銀行的出現進一步強化了商業銀行面向客戶設計服務品種和業務流程的趨勢...
2014-09-03 -
網站制作完成后改域名和程序如何不被降職？
長期工作的站長都知道，改域名和改程序是SEO優化整體上最忌諱的事情。但...
2022-07-13 -
高端網站建設—設計師如何尋找設計靈感
成功，是百分之一是靈感加上百分之九十九是汗水.但那百分之一的靈感是最重...
2019-03-11 -
網站營銷策略有哪些？
網站營銷策略有哪些？企業營銷型網站建設完成之后下一步就是營銷了，下面由...
2015-08-10 -
網站建設失敗一般有哪些原因？
如今網站建設是大勢所趨，很多企業為了追趕潮流而進行網站建設，但網站建設...
2021-01-21 -
新建設的網站如何做長尾關鍵詞排名？
只要做過優化的人都知道，如果用戶通過長尾關鍵詞進入網站，咨詢的轉化率很...
2020-04-06
如果您的網站可以增加轉化次數并提高客戶滿意度，該怎么辦？
預約專業咨詢顧問溝通！
Copyright ? 2025 恒久尚品 版權所有 | 京ICP備09066521號
| 公安機關備案號:11011502003910
免責聲明
誠信企業
尚品專注高端網站建設，系統平臺開發，微信小程序及APP開發服務
尚品專注高端網站建設，系統平臺開發，微信小程序及APP開發服務
免責聲明
非常感謝您訪問我們的網站。在您使用本網站之前，請您仔細閱讀本聲明的所有條款。
1、本站部分內容來源自網絡，涉及到的部分文章和圖片版權屬于原作者，本站轉載僅供大家學習和交流，切勿用于任何商業活動。
2、本站不承擔用戶因使用這些資源對自己和他人造成任何形式的損失或傷害。
3、本聲明未涉及的問題參見國家有關法律法規，當本聲明與國家法律法規沖突時，以國家法律法規為準。
4、如果侵害了您的合法權益，請您及時與我們,我們會在第一時間刪除相關內容!
聯系方式：010-60259772
電子郵件：394588593@qq.com
