第一節(jié).基本的html文檔

1.一個html文檔由4個 基本部分組成:

(1).一個文檔類型聲明,表明這個文檔是html文檔

(2).html標(biāo)簽對,用于表明html文檔的開始和結(jié)束

(3).head標(biāo)簽對彬犯,其內(nèi)容構(gòu)成html的開頭部分进苍,包含一些輔助元素

(4).body標(biāo)簽對蓖乘,其內(nèi)容構(gòu)成html的主體部分

2.html文檔的基本結(jié)構(gòu)

2.1.文檔類型的說明

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org//TR html4/loose.dtd">

所有的html文檔必須要以文檔類型說明(DTD)開頭飘言,它說明了文檔類型和所遵守的標(biāo)準(zhǔn)規(guī)則只盹。大多數(shù)現(xiàn)代瀏覽器在實

際顯示網(wǎng)頁會根據(jù)聲明的DTD不同而有區(qū)別辣往。

(1).html 4.01 Strict DTD

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org//TR html4/strict.dtd">

這類文檔類型很嚴(yán)格,其定義中不包含那些已經(jīng)不推薦使用的元素和屬性殖卑,也不包含出現(xiàn)在框架集中的元素和屬性站削。

(2).html 4.01 Transitional DTD

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org//TR html4/loose.dtd">

這類文檔比較廣泛,包含不推薦使用的元素和屬性。

(3).html 4.01 Frameset DTD

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org//TR html4/frameset.dtd">

這類最廣泛懦鼠,不僅包含Transitional DTD所包含的元素和屬性钻哩,還包含框架集中的元素和屬性。

2.2.<html>標(biāo)簽對和屬性

1.dir屬性

該標(biāo)簽有兩個基本屬性--dir屬性和lang屬性肛冶,其中dir屬性決定了瀏覽器該用什么方向來顯示包含在元素中的文本街氢。其

中dir元素屬性用于<html>時,決定整個文本在整個文檔將以什么方向顯示睦袖;但用在其它標(biāo)簽的時候珊肃,只決定那個標(biāo)簽內(nèi)

容的文本的顯示方向。dir又有itr和rtl兩個屬性值,分別意味著文本從左到右顯示和從右到左顯示伦乔。見(顯示.html)

2.lang屬性

lang屬性來指明文檔內(nèi)容或某個元素內(nèi)容使用的語言厉亏。如果包含在<html>標(biāo)簽中,那么lang屬性可以用來指定整個文檔使用的語言烈和。

如果在其它標(biāo)簽中爱只,則此屬性將指出那個標(biāo)簽中內(nèi)容所使用的語言

2.3<head>標(biāo)簽對和屬性

1.<head>標(biāo)簽對

包含有關(guān)html文檔的信息,可以包含一些輔助性標(biāo)簽招刹,<title>,<base>,<link>,<meta>,<style>,<script>等

注意:除了標(biāo)題欄會顯示<title>元素外恬试,瀏覽器不會向用戶顯示head元素內(nèi)容的任何內(nèi)容

2.<head>屬性

head元素中有profile屬性,該屬性提供了于當(dāng)前文檔相關(guān)的配置文件的URL疯暑。

2.4<body>標(biāo)簽對和屬性

1.<body>標(biāo)簽對

包含許多其它標(biāo)簽训柴,比如:<p>,<h1>,<br>等眾多標(biāo)簽

2.<body>屬性

body有許多屬性,可以用于設(shè)置文檔的背景妇拯,文本顏色幻馁,鏈接顏色,邊距等

3.HTML標(biāo)簽越锈,元素仗嗦,屬性

介紹:一個html文檔是由元素構(gòu)成。元素由開始標(biāo)簽瞪浸,結(jié)束標(biāo)簽儒将,屬性,元素的內(nèi)容4部分構(gòu)成对蒲。

3.1.什么是標(biāo)簽

元素是由標(biāo)簽組成钩蚊,用來標(biāo)記內(nèi)容塊,也用來標(biāo)記元素內(nèi)容的意義蹈矮。標(biāo)簽使用尖括號包圍

3.1.1

1.成對出現(xiàn)的標(biāo)簽

2.單獨出現(xiàn)的標(biāo)簽

如:<br>換行標(biāo)簽

沒有相應(yīng)的結(jié)束標(biāo)簽還有:<area>,<base>,<basefont>,<br>,<col>,<frame>,<hr>,<img>,<input>,<param>,<link>

3.標(biāo)簽的嵌套

標(biāo)簽可以放在另一個標(biāo)簽所影響的片段中砰逻,以實現(xiàn)某一段文檔的多重標(biāo)簽效果

3.2.元素

網(wǎng)頁內(nèi)容由元素構(gòu)成

例如:<html></html>標(biāo)簽之間都是元素內(nèi)容

3.3.屬性定義

與元素相關(guān)的特性成為屬性,可以為屬性賦值(每一個屬性總是對應(yīng)一個屬性值泛鸟,因此也稱為“屬性蝠咆、值”對,并且屬性名

不區(qū)分大小寫)北滥「詹伲“屬性/值”對出現(xiàn)在元素開始標(biāo)簽的最后一個“>”之前,通過空格分開再芋。

3.4.屬性值的定義

注意:屬性值是不區(qū)分大小寫的

1.不定義屬性值

html規(guī)定可以沒有值菊霜。下面定義是合法的。

<dl compact>

2.屬性值的空白

html規(guī)定屬性只可以空白济赎,但這種情況要用引號鉴逞,因為屬性之間使用空白分隔的记某。

<img src="c://Document and Setting/test.jpg" width=1024 height=768 />

不使用引號會出錯

<img src=c://Document and Setting/test.jpg width=1024 height=768 />

這樣說屬性值必須是連續(xù)的字符串,如果將空白替換為“%20”构捡,那么也可以不使用引號液南。

<img src=c://Document%20and%20Setting/test.jpg width=1024 height=768 />

而屬性值開頭以及結(jié)尾的空白處,用戶瀏覽器會將它們刪除

3.屬性使用單引號以及雙引號

單引號可以作為屬性值勾徽,但單引號作為屬性值的時候不能用用單引號去包括屬性值滑凉。但單引號作為屬性值的時候,也可以

用數(shù)字字符引用(&#39捂蕴;)來代替單引號譬涡。

當(dāng)為雙引號時,必須用數(shù)字字符引用(&#39啥辨;)或字符實體(&quot;)來代替雙引號

4.標(biāo)準(zhǔn)屬性

html標(biāo)簽擁有屬性盯腌。但有些屬性通用于每個標(biāo)簽溉知,我們稱作標(biāo)準(zhǔn)屬性。

4.1.核心屬性

這類屬性包含關(guān)于元素的一般性信息腕够〖墩В可以幾乎在任何元素的開始標(biāo)簽內(nèi)。

4.1.1.class

表示特定元素所屬的一個類或一組帚湘。同屬一類的元素使用相同的css樣式規(guī)則玫荣。類名幾乎可以是任何文字。但只能由字母大诸,

數(shù)字捅厂,連字符(-),下劃線(_)組成资柔”捍可以多個元素構(gòu)成一類。此外贿堰,一個元素不止一個類辙芍,此時屬性值中的多個類名用空格分隔。

4.1.2.id

為元素指定一個唯一性的標(biāo)識符羹与。id可以是幾乎任何簡短文字故硅。但它在文檔中是唯一的,不能多個元素使用一個標(biāo)識符纵搁。id屬性不能

包含除了連字符(-)和下劃線以外(_)的任何標(biāo)點符號和特殊符號吃衅。其中,第一個必須是字母诡渴,而不能是數(shù)字或其他字符捐晶。

4.1.3.style

為元素指定css屬性菲语,則成為內(nèi)聯(lián)樣式定義。但應(yīng)該避免使用惑灵,因為它將內(nèi)容和表現(xiàn)混合在一起山上。

4.1.4.title

為元素指定一個文本標(biāo)題。許多圖形化瀏覽器將title屬性的值顯示在“工具提示”(即但用戶的鼠標(biāo)指針停留在所呈現(xiàn)的元素上方時出

現(xiàn)的那個小小的浮動窗口)中英支。

4.2.語言屬性

他們幾乎包含在任何元素內(nèi)容中

4.2.1.dir屬性

4.2.2.lang屬性

4.3.鍵盤屬性

當(dāng)某些元素--尤其是鏈接和表單控件--處于預(yù)激活狀態(tài)中時佩憾,稱為擁有焦點,因為瀏覽器的“注意力”放在集中該元素中干花,準(zhǔn)備激活它妄帘。

為一些元素設(shè)置焦點元素,以增強網(wǎng)頁瀏覽者使用鍵盤在網(wǎng)頁導(dǎo)航時的可用性池凄。

4.3.1.accesskey屬性

為元素分配一個鍵盤快捷鍵抡驼,以便在使用鍵盤導(dǎo)航時時能更方便,更快捷地訪問它肿仑。該屬性的值時應(yīng)于訪問鍵的值致盟。

4.3.2.tabindex屬性

指定元素在使用制表鍵遍歷鏈接和表單控件時所形成的訪問順序的位置

5.html字符實體

一些字符在html中擁有的特殊含義,例如小于號(<)用于定義html標(biāo)簽的開始尤慰,不可以直接在網(wǎng)頁中輸出馏锡。如果我們希望瀏覽器能正確

地顯示這些含有這些特殊含義的字符。我們必須在html源碼中插入字符實體伟端。

實體名稱對于大小寫敏感杯道。

6.空白和空白字符

在html文檔中包含空白,每個空白對應(yīng)一個空白字符责蝠。

在html文檔中党巾,空白分兩類:

(1).有意義的空白

(2).無意義的空白:瀏覽器一般不給予保留

6.1.斷行符

斷行符表示一行的結(jié)束,它是空白字符玛歌。雖然在html源文檔中看不到這個字符昧港,但每一個換行處都有一個換行符的。

sgml規(guī)定支子,緊跟開始標(biāo)簽的之后斷行符應(yīng)該被忽略创肥,在一個結(jié)束標(biāo)簽之前斷行符應(yīng)該被忽略。

<p>

注意開始標(biāo)簽前面和結(jié)束標(biāo)簽后面

</p>

相當(dāng)于<p>注意開始標(biāo)簽前面和結(jié)束標(biāo)簽后面</p>

6.2.空白字符

在html文檔中值朋,將一下字符歸為空白字符:

(1)ascii空白(&#x0020叹侄;)

(2)ascii制表符(&#x0009;)

(3)ascii換頁(&#x000C昨登;)

(4)零寬空白(&#x200B趾代;)

注意:不同文字語言在空白區(qū)域的處理是不一樣的

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市丰辣,隨后出現(xiàn)的幾起案子撒强,更是在濱河造成了極大的恐慌禽捆,老刑警劉巖,帶你破解...
    沈念sama閱讀 212,383評論 6 493
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件飘哨,死亡現(xiàn)場離奇詭異胚想,居然都是意外死亡,警方通過查閱死者的電腦和手機芽隆,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,522評論 3 385
  • 文/潘曉璐 我一進(jìn)店門浊服,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人胚吁,你說我怎么就攤上這事牙躺。” “怎么了腕扶?”我有些...
    開封第一講書人閱讀 157,852評論 0 348
  • 文/不壞的土叔 我叫張陵孽拷,是天一觀的道長。 經(jīng)常有香客問我半抱,道長乓搬,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,621評論 1 284
  • 正文 為了忘掉前任代虾,我火速辦了婚禮,結(jié)果婚禮上激蹲,老公的妹妹穿的比我還像新娘棉磨。我一直安慰自己,他們只是感情好学辱,可當(dāng)我...
    茶點故事閱讀 65,741評論 6 386
  • 文/花漫 我一把揭開白布乘瓤。 她就那樣靜靜地躺著,像睡著了一般策泣。 火紅的嫁衣襯著肌膚如雪衙傀。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,929評論 1 290
  • 那天萨咕,我揣著相機與錄音统抬,去河邊找鬼。 笑死危队,一個胖子當(dāng)著我的面吹牛聪建,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播茫陆,決...
    沈念sama閱讀 39,076評論 3 410
  • 文/蒼蘭香墨 我猛地睜開眼金麸,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了簿盅?” 一聲冷哼從身側(cè)響起挥下,我...
    開封第一講書人閱讀 37,803評論 0 268
  • 序言:老撾萬榮一對情侶失蹤揍魂,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后棚瘟,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體现斋,經(jīng)...
    沈念sama閱讀 44,265評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,582評論 2 327
  • 正文 我和宋清朗相戀三年解取,在試婚紗的時候發(fā)現(xiàn)自己被綠了步责。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,716評論 1 341
  • 序言:一個原本活蹦亂跳的男人離奇死亡禀苦,死狀恐怖蔓肯,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情振乏,我是刑警寧澤蔗包,帶...
    沈念sama閱讀 34,395評論 4 333
  • 正文 年R本政府宣布,位于F島的核電站慧邮,受9級特大地震影響调限,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜误澳,卻給世界環(huán)境...
    茶點故事閱讀 40,039評論 3 316
  • 文/蒙蒙 一耻矮、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧忆谓,春花似錦裆装、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,798評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至昙沦,卻和暖如春琢唾,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背盾饮。 一陣腳步聲響...
    開封第一講書人閱讀 32,027評論 1 266
  • 我被黑心中介騙來泰國打工采桃, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人丐谋。 一個月前我還...
    沈念sama閱讀 46,488評論 2 361
  • 正文 我出身青樓芍碧,卻偏偏與公主長得像,于是被迫代替她去往敵國和親号俐。 傳聞我的和親對象是個殘疾皇子泌豆,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 43,612評論 2 350

推薦閱讀更多精彩內(nèi)容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML標(biāo)準(zhǔn)吏饿。 注意:講述HT...
    kismetajun閱讀 27,450評論 1 45
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案踪危? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補...
    _Yfling閱讀 13,737評論 1 92
  • HTML蔬浙、XML、XHTML 有什么區(qū)別 1.HTML 是用來描述網(wǎng)頁的一種語言贞远,指的是超文本標(biāo)記語言 (Hype...
    饑人谷_牛牛閱讀 687評論 0 2
  • 關(guān)于HTML 超文本標(biāo)記語言(HyperText Markup Language畴博,簡稱:HTML)是一種用于創(chuàng)建網(wǎng)...
    YQY_苑閱讀 671評論 0 1
  • 1.meta標(biāo)簽 元素可提供有關(guān)頁面的元信息(meta-information),比如針對搜索引擎和更新頻度的描述...
    姚小帥閱讀 333評論 0 1