HTML編程基礎(chǔ)
來源：尚品中國|
類型：網(wǎng)站百科
|時(shí)間：2014-06-16
通常情況下，人們應(yīng)用Dreemwcave以可視化的方式設(shè)計(jì)網(wǎng)頁。而直接用HTML標(biāo)記符設(shè)計(jì)網(wǎng)頁的情況則較少，對HTML標(biāo)記符也了解不多，但在動(dòng)態(tài)網(wǎng)頁設(shè)計(jì)中，常常需要利用ASP代碼摘出網(wǎng)頁的部分HTM L代碼，此時(shí)必須熟悉HTML標(biāo)記符，因此，本章將對常用的HTMI標(biāo)記符進(jìn)行介紹。
1. 1. 1什么是HTML
HTML(街pertext Markup Language)即超文本標(biāo)記語育，是一種用來在WWW (World Wide Web) L表示信息的描述性的標(biāo)記語言。
HTML文本是由HTML標(biāo)記組成的描述性文本。HTML標(biāo)記可以描述文字、圖形、動(dòng)網(wǎng)、聲音、表格、鏈接等。生成一個(gè)HTMI文本述?？梢酝ㄟ^以下四種方法:
I)利用各種文本編輯器(如Windows記事本)i is接使用HTML語言編寫。
2)借助一錢HTMI.的編輯工其，如FroniPage、HotDog等。
3)其他格式的文檔(如Word文檔)轉(zhuǎn)換成HTML文本。
4)山Web服務(wù)器端實(shí)時(shí)動(dòng)態(tài)地生成。
下面應(yīng)用第一種方法完成一個(gè)簡單的實(shí)例
1. 1.2一個(gè)簡單的HTM 1.實(shí)例
I例1-1)創(chuàng)建一個(gè)簡單的網(wǎng)貞，步驟如下:
1)選擇“開始”一“程序”，“附件”一“記事本”命令，打開記事本程序。翰人以
下HTML代碼
<HTMI)
<HEAD>
< TITLE > I ITM L實(shí)例</TITLE>
</HEAD)
< BODY Bgcolor = "#FFFFFF">
<P》這是一個(gè)簡單的HTML實(shí)例</P>
</BODY>
</HTMI>
2)選擇“文件.菜單下的“保存，命令.打開“保存”對話框，在輸人文件名和文件擴(kuò)展名(1-1. him),選擇合適的目錄.然后單擊“保存”
3)在瀏覽器中打開運(yùn)行該文件(1-1. him)，運(yùn)行結(jié)果如圖1-1所示。
從以上過程可以看出，使用HTML語言確實(shí)能夠很容易地制作網(wǎng)頁，但是這樣的網(wǎng)頁距離關(guān)觀實(shí)用的要求顯然還有一定差距。因此后面的章節(jié)將會詳細(xì)地介紹如何利用HTML諸言的其他標(biāo)記符來修飾文字和圖像等頁面元素。
1.2 HTML常用標(biāo)記
標(biāo)記符是HTML語言中定義網(wǎng)頁內(nèi)容格式和顯示的指令.制網(wǎng)貞內(nèi)容的顯示效果。
1.2.1頁面基本屬性標(biāo)記
而標(biāo)記符的屬性用于進(jìn)一步控制網(wǎng)頁的內(nèi)容多么豐富、版式多么復(fù)雜，網(wǎng)頁的基本結(jié)構(gòu)卻都是一樣的。
1.網(wǎng)頁的基本結(jié)構(gòu)
如下所示:
<HTML>
<HEAD)
< TITLE>文檔標(biāo)題<,TITLE》
</HEAD>
< BODY>
這是HTMI文檔的主要部分
</BODY>
</HTML>
HTML的結(jié)構(gòu)包括頭部(HEAD)、主體(BODY)兩大部分.其中頭部描述瀏覽器所需的信息，而主體則包含頁面的具體內(nèi)容及格式說明。
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文件中設(shè)置MIME字符集(i息。您在瀏覽主頁時(shí).最好自己在瀏覽器的選項(xiàng)菜單內(nèi)選擇相應(yīng)的語言(language encoding),但是如果HTML文件里寫明了設(shè)置，瀏覽器就會自動(dòng)設(shè)置語言選項(xiàng)。如果主頁里用到了字符實(shí)體(entities),則該主頁就應(yīng)該寫明字符集信息，否則，您在瀏覽該主頁時(shí)，若未正確設(shè)置語言選項(xiàng)，顯示將可能混亂。
3.背.色彩和文字色影
設(shè)置網(wǎng)貞的背景色彩和文字色彩可通過設(shè)置BODY標(biāo)記的屬性來實(shí)現(xiàn)，具體格式如下:
<BODY Rgcolor=# Text=#Link# Alink=# Vlink=#>
BODY標(biāo)記各參數(shù)的含義見表1-l
4.添加注釋
由于Web站點(diǎn)需要經(jīng)常更新，而且制作時(shí)往往是幾個(gè)人合作，所以創(chuàng)建的頁面必須易于維護(hù)，而添加增強(qiáng)文件可讀性的重要手段。
HTML中的注釋是由<!一(開始標(biāo)記符)和一>(結(jié)束標(biāo)記符)組成的。這兩個(gè)標(biāo)記符中間的內(nèi)容就是注釋的內(nèi)容，它們不會在瀏覽器中顯示。
5.畫線
在網(wǎng)頁中產(chǎn)生分隔線可用<HR>標(biāo)記來實(shí)現(xiàn)，其用法為:
<HR Width=寬度值Size=線的高度Align，=對齊方式Noshade>
屬性說明:
I) Width用于指定分隔線的寬度.寬度優(yōu)的指定方式有兩種.一是用像素點(diǎn)來指定，
例如.若要產(chǎn)生寬度為500像素的直線，則實(shí)現(xiàn)代碼為:
<HR Width=500>
另一種方法是用百分比表達(dá)，例如，若要產(chǎn)生寬度是網(wǎng)頁寬度的75%分隔線，則實(shí)現(xiàn)代碼如下:
<HR Width二.75%.>
2) Si，用于指定直線的高度。例如.要繪制寬度為80%,高度為l的直線，則實(shí)現(xiàn)代
碼如下:
<HR Width ="80%" Size=1>
3) Align指定直線的對齊方式，取值有l(wèi)eft、Center、Right。
4) Noahade指定直線是否有陰形。如果帶有該參數(shù)，則直線無陰影。
<HR>標(biāo)記一般用于產(chǎn)生水平分隔線，若要產(chǎn)生豎直線，可將Width設(shè)置為1, Size設(shè)置為豎直線的高度誼。例如:< HR Width= I Size= 500 Noshade >
1.2.2文字屬性標(biāo)記
文字是網(wǎng)頁中最主要的頁面元素，HTML語言提供了一些用來修飾文字的標(biāo)記符，可以川它們來設(shè)置文字的字體、顏色、大小和樣式等屬性。
1.字體控制
<FONT >標(biāo)記符是用來控制文字的字體、大小和顏色的。其語法格式為:
<FONT Face=“fonlname" Size=“fontaize" Color="#RRGCBB">文本</FONT>
屬性說明:
Face屬性用于指定字體;Size用于指定字體的大小;Color用于設(shè)置字體的顏色。字體大小的表達(dá)方法有兩種，一是設(shè)置為絕對字號，此時(shí)的設(shè)置優(yōu)可以是1~7, 1號最小，7號最大，默認(rèn)字號為3，可利用< BASEFONT Size=字號>設(shè)置或更改默認(rèn)字號。例如，若要以綠色，宋體4號字輸出“HTML實(shí)例”，則實(shí)現(xiàn)代碼為:
< FONT Face=“宋體”Size=4 Color=“#008000">HTML實(shí)例</FONT >
另一種設(shè)置為相對字號大小，此時(shí)的用法為<FONT Size=±n>，其中n代表字號改變的量，+表示字體在默認(rèn)字號的基礎(chǔ)上增大字號，- 表示在默認(rèn)字號的基礎(chǔ)上遞減字號。例如:
< BASEFONT Size=3)
<FONT Size= +2>HTML實(shí)例</FONT >
2.標(biāo)題的字號
語法格式為:
< Hn)</Hn>
說明:n是1 -6的數(shù)字，<HI>表示最大的標(biāo)題，<H6>表示最小的標(biāo)題。在默認(rèn)狀態(tài)下，<Hn>標(biāo)記符中的文字在瀏覽器中顯示時(shí)都是黑體，而且文字將自動(dòng)在</Hn>標(biāo)記符后換行。
【例1-2】在網(wǎng)頁中分別用六級標(biāo)題標(biāo)記符拍出一個(gè)側(cè)試效果的文本。
<HTML >
<HEAD >
<TITLE>標(biāo)越字體演示</TITLE》
</HEAD >
<BODY Bgcolor = " #FFFFFF" Text=“#000000”>
<Hl>這是第一級標(biāo)題</H1>
<H2》這是第二級標(biāo)腸</H2>
<H3>這足第三級標(biāo)題</H3>
<H4>這是第四級標(biāo)腸</H4 >
<115》這是第五級標(biāo)題</HS>
<H6>這是第六級標(biāo)題</H6>
</BODY)
</HTML>
運(yùn)行結(jié)果如圖，1-2所示。
HTML(街pertext Markup Language)即超文本標(biāo)記語育，是一種用來在WWW (World Wide Web) L表示信息的描述性的標(biāo)記語言。
HTML文本是由HTML標(biāo)記組成的描述性文本。HTML標(biāo)記可以描述文字、圖形、動(dòng)網(wǎng)、聲音、表格、鏈接等。生成一個(gè)HTMI文本述?？梢酝ㄟ^以下四種方法:
I)利用各種文本編輯器(如Windows記事本)i is接使用HTML語言編寫。
2)借助一錢HTMI.的編輯工其，如FroniPage、HotDog等。
3)其他格式的文檔(如Word文檔)轉(zhuǎn)換成HTML文本。
4)山Web服務(wù)器端實(shí)時(shí)動(dòng)態(tài)地生成。
下面應(yīng)用第一種方法完成一個(gè)簡單的實(shí)例
1. 1.2一個(gè)簡單的HTM 1.實(shí)例
I例1-1)創(chuàng)建一個(gè)簡單的網(wǎng)貞，步驟如下:
1)選擇“開始”一“程序”，“附件”一“記事本”命令，打開記事本程序。翰人以
下HTML代碼
<HTMI)
<HEAD>
< TITLE > I ITM L實(shí)例</TITLE>
</HEAD)
< BODY Bgcolor = "#FFFFFF">
<P》這是一個(gè)簡單的HTML實(shí)例</P>
</BODY>
</HTMI>
2)選擇“文件.菜單下的“保存，命令.打開“保存”對話框，在輸人文件名和文件擴(kuò)展名(1-1. him),選擇合適的目錄.然后單擊“保存”
3)在瀏覽器中打開運(yùn)行該文件(1-1. him)，運(yùn)行結(jié)果如圖1-1所示。
從以上過程可以看出，使用HTML語言確實(shí)能夠很容易地制作網(wǎng)頁，但是這樣的網(wǎng)頁距離關(guān)觀實(shí)用的要求顯然還有一定差距。因此后面的章節(jié)將會詳細(xì)地介紹如何利用HTML諸言的其他標(biāo)記符來修飾文字和圖像等頁面元素。
1.2 HTML常用標(biāo)記
標(biāo)記符是HTML語言中定義網(wǎng)頁內(nèi)容格式和顯示的指令.制網(wǎng)貞內(nèi)容的顯示效果。
1.2.1頁面基本屬性標(biāo)記
而標(biāo)記符的屬性用于進(jìn)一步控制網(wǎng)頁的內(nèi)容多么豐富、版式多么復(fù)雜，網(wǎng)頁的基本結(jié)構(gòu)卻都是一樣的。
1.網(wǎng)頁的基本結(jié)構(gòu)
如下所示:
<HTML>
<HEAD)
< TITLE>文檔標(biāo)題<,TITLE》
</HEAD>
< BODY>
這是HTMI文檔的主要部分
</BODY>
</HTML>
HTML的結(jié)構(gòu)包括頭部(HEAD)、主體(BODY)兩大部分.其中頭部描述瀏覽器所需的信息，而主體則包含頁面的具體內(nèi)容及格式說明。
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文件中設(shè)置MIME字符集(i息。您在瀏覽主頁時(shí).最好自己在瀏覽器的選項(xiàng)菜單內(nèi)選擇相應(yīng)的語言(language encoding),但是如果HTML文件里寫明了設(shè)置，瀏覽器就會自動(dòng)設(shè)置語言選項(xiàng)。如果主頁里用到了字符實(shí)體(entities),則該主頁就應(yīng)該寫明字符集信息，否則，您在瀏覽該主頁時(shí)，若未正確設(shè)置語言選項(xiàng)，顯示將可能混亂。
3.背.色彩和文字色影
設(shè)置網(wǎng)貞的背景色彩和文字色彩可通過設(shè)置BODY標(biāo)記的屬性來實(shí)現(xiàn)，具體格式如下:
<BODY Rgcolor=# Text=#Link# Alink=# Vlink=#>
BODY標(biāo)記各參數(shù)的含義見表1-l
由于Web站點(diǎn)需要經(jīng)常更新，而且制作時(shí)往往是幾個(gè)人合作，所以創(chuàng)建的頁面必須易于維護(hù)，而添加增強(qiáng)文件可讀性的重要手段。
HTML中的注釋是由<!一(開始標(biāo)記符)和一>(結(jié)束標(biāo)記符)組成的。這兩個(gè)標(biāo)記符中間的內(nèi)容就是注釋的內(nèi)容，它們不會在瀏覽器中顯示。
5.畫線
在網(wǎng)頁中產(chǎn)生分隔線可用<HR>標(biāo)記來實(shí)現(xiàn)，其用法為:
<HR Width=寬度值Size=線的高度Align，=對齊方式Noshade>
屬性說明:
I) Width用于指定分隔線的寬度.寬度優(yōu)的指定方式有兩種.一是用像素點(diǎn)來指定，
例如.若要產(chǎn)生寬度為500像素的直線，則實(shí)現(xiàn)代碼為:
<HR Width=500>
另一種方法是用百分比表達(dá)，例如，若要產(chǎn)生寬度是網(wǎng)頁寬度的75%分隔線，則實(shí)現(xiàn)代碼如下:
<HR Width二.75%.>
2) Si，用于指定直線的高度。例如.要繪制寬度為80%,高度為l的直線，則實(shí)現(xiàn)代
碼如下:
<HR Width ="80%" Size=1>
3) Align指定直線的對齊方式，取值有l(wèi)eft、Center、Right。
4) Noahade指定直線是否有陰形。如果帶有該參數(shù)，則直線無陰影。
<HR>標(biāo)記一般用于產(chǎn)生水平分隔線，若要產(chǎn)生豎直線，可將Width設(shè)置為1, Size設(shè)置為豎直線的高度誼。例如:< HR Width= I Size= 500 Noshade >
1.2.2文字屬性標(biāo)記
文字是網(wǎng)頁中最主要的頁面元素，HTML語言提供了一些用來修飾文字的標(biāo)記符，可以川它們來設(shè)置文字的字體、顏色、大小和樣式等屬性。
1.字體控制
<FONT >標(biāo)記符是用來控制文字的字體、大小和顏色的。其語法格式為:
<FONT Face=“fonlname" Size=“fontaize" Color="#RRGCBB">文本</FONT>
屬性說明:
Face屬性用于指定字體;Size用于指定字體的大小;Color用于設(shè)置字體的顏色。字體大小的表達(dá)方法有兩種，一是設(shè)置為絕對字號，此時(shí)的設(shè)置優(yōu)可以是1~7, 1號最小，7號最大，默認(rèn)字號為3，可利用< BASEFONT Size=字號>設(shè)置或更改默認(rèn)字號。例如，若要以綠色，宋體4號字輸出“HTML實(shí)例”，則實(shí)現(xiàn)代碼為:
< FONT Face=“宋體”Size=4 Color=“#008000">HTML實(shí)例</FONT >
另一種設(shè)置為相對字號大小，此時(shí)的用法為<FONT Size=±n>，其中n代表字號改變的量，+表示字體在默認(rèn)字號的基礎(chǔ)上增大字號，- 表示在默認(rèn)字號的基礎(chǔ)上遞減字號。例如:
< BASEFONT Size=3)
<FONT Size= +2>HTML實(shí)例</FONT >
2.標(biāo)題的字號
語法格式為:
< Hn)</Hn>
說明:n是1 -6的數(shù)字，<HI>表示最大的標(biāo)題，<H6>表示最小的標(biāo)題。在默認(rèn)狀態(tài)下，<Hn>標(biāo)記符中的文字在瀏覽器中顯示時(shí)都是黑體，而且文字將自動(dòng)在</Hn>標(biāo)記符后換行。
【例1-2】在網(wǎng)頁中分別用六級標(biāo)題標(biāo)記符拍出一個(gè)側(cè)試效果的文本。
<HTML >
<HEAD >
<TITLE>標(biāo)越字體演示</TITLE》
</HEAD >
<BODY Bgcolor = " #FFFFFF" Text=“#000000”>
<Hl>這是第一級標(biāo)題</H1>
<H2》這是第二級標(biāo)腸</H2>
<H3>這足第三級標(biāo)題</H3>
<H4>這是第四級標(biāo)腸</H4 >
<115》這是第五級標(biāo)題</HS>
<H6>這是第六級標(biāo)題</H6>
</BODY)
</HTML>
運(yùn)行結(jié)果如圖，1-2所示。
來源聲明：本文章系尚品中國編輯原創(chuàng)或采編整理，如需轉(zhuǎn)載請注明來自尚品中國。以上內(nèi)容部分(包含圖片、文字)來源于網(wǎng)絡(luò)，如有侵權(quán)，請及時(shí)與本站聯(lián)系（010-60259772）。
建站流程
-
網(wǎng)站需求
-
網(wǎng)站策劃方案
-
頁面設(shè)計(jì)風(fēng)格
-
確認(rèn)交付使用
-
資料錄入優(yōu)化
-
程序設(shè)計(jì)開發(fā)
-
后續(xù)跟蹤服務(wù)
-
聯(lián)系電話
010-60259772
熱門標(biāo)簽
- 網(wǎng)站建設(shè)
- 食品網(wǎng)站建設(shè)
- 微信小程序開發(fā)
- 小程序開發(fā)
- 無錫網(wǎng)站建設(shè)
- 研究所網(wǎng)站建設(shè)
- 沈陽網(wǎng)站建設(shè)
- 廊坊網(wǎng)站建設(shè)
- 鄭州網(wǎng)站建設(shè)
- 婚紗攝影網(wǎng)站建設(shè)
- 手機(jī)端網(wǎng)站建設(shè)
- 高校網(wǎng)站制作
- 天津網(wǎng)站建設(shè)
- 教育網(wǎng)站建設(shè)
- 品牌網(wǎng)站建設(shè)
- 政府網(wǎng)站建設(shè)
- 北京網(wǎng)站建設(shè)
- 網(wǎng)站設(shè)計(jì)
- 網(wǎng)站制作
最新文章
推薦新聞
更多行業(yè)-
[北京網(wǎng)站制作]網(wǎng)站診斷之百度快照出現(xiàn)的異常反照
網(wǎng)站診斷之百度快照出現(xiàn)的異常反照昨天朋友問我一個(gè)問題，他的博客百度快照...
2011-10-26 -
網(wǎng)頁設(shè)計(jì)制作需要注意的細(xì)節(jié)有哪些？
了解您的目標(biāo)受眾是誰，他們的需求和偏好是什么，以便設(shè)計(jì)一個(gè)符合他們期望...
2023-06-29 -
ThinkPHP3.2網(wǎng)站制作免費(fèi)視頻教程
什么是ThinkPHP?ThinkPHP是為了簡化企業(yè)級應(yīng)用開發(fā)和敏捷...
2017-05-10 -
客戶需求調(diào)查及資料如何整理
在網(wǎng)站設(shè)計(jì)工作開始時(shí)，首先要和客戶很好的溝通，完整的、全面的收集和...
2015-02-06 -
如何選擇專業(yè)可靠的網(wǎng)站建設(shè)公司？
網(wǎng)站建設(shè)可以吸引更多的潛在客戶，幫助企業(yè)提高知名度。在互聯(lián)網(wǎng)時(shí)代，網(wǎng)站...
2022-11-08 -
TCP/IP各層協(xié)議通信流程
1.服務(wù)訪問點(diǎn) 服務(wù)訪問點(diǎn)SAP(Service Access ...
2014-06-27
如果您的網(wǎng)站可以增加轉(zhuǎn)化次數(shù)并提高客戶滿意度，該怎么辦？
預(yù)約專業(yè)咨詢顧問溝通！
Copyright ? 2025 恒久尚品 版權(quán)所有 | 京ICP備09066521號
| 公安機(jī)關(guān)備案號:11011502003910
免責(zé)聲明
誠信企業(yè)
尚品專注高端網(wǎng)站建設(shè)，系統(tǒng)平臺開發(fā)，微信小程序及APP開發(fā)服務(wù)
尚品專注高端網(wǎng)站建設(shè)，系統(tǒng)平臺開發(fā)，微信小程序及APP開發(fā)服務(wù)
免責(zé)聲明
非常感謝您訪問我們的網(wǎng)站。在您使用本網(wǎng)站之前，請您仔細(xì)閱讀本聲明的所有條款。
1、本站部分內(nèi)容來源自網(wǎng)絡(luò)，涉及到的部分文章和圖片版權(quán)屬于原作者，本站轉(zhuǎn)載僅供大家學(xué)習(xí)和交流，切勿用于任何商業(yè)活動(dòng)。
2、本站不承擔(dān)用戶因使用這些資源對自己和他人造成任何形式的損失或傷害。
3、本聲明未涉及的問題參見國家有關(guān)法律法規(guī)，當(dāng)本聲明與國家法律法規(guī)沖突時(shí)，以國家法律法規(guī)為準(zhǔn)。
4、如果侵害了您的合法權(quán)益，請您及時(shí)與我們,我們會在第一時(shí)間刪除相關(guān)內(nèi)容!
聯(lián)系方式：010-60259772
電子郵件：394588593@qq.com
