天天看點

HTML文檔基本格式

一、HTML文檔基本格式:

1

2

3

4

5

6

7

8

9

10

<code>&lt;!DOCTYPE html&gt;  //文檔類型聲明</code>

<code>&lt;</code><code>html</code> <code>lang</code><code>=</code><code>'zh-cn'</code><code>&gt;                  //表示HTML文檔開始</code>

<code>&lt;</code><code>head</code><code>&gt;              //包含文檔中繼資料開始</code>

<code>&lt;</code><code>meta</code> <code>charset</code><code>=</code><code>'utf8'</code><code>&gt;           //聲明字元編碼</code>

<code>&lt;</code><code>title</code><code>&gt;基本&lt;/</code><code>title</code><code>&gt;     //設定文檔标題</code>

<code>&lt;/</code><code>head</code><code>&gt;     //包含文檔中繼資料結束</code>

<code>&lt;</code><code>body</code><code>&gt;     //表示HTML文檔内容</code>

<code>&lt;/</code><code>body</code><code>&gt;     //表示HTML</code>

<code>&lt;</code><code>a</code> <code>href</code><code>=</code><code>"http://wwww.baidu.com"</code><code>&gt;百度&lt;/</code><code>a</code><code>&gt;</code>

<code>&lt;/</code><code>html</code><code>&gt;      //表示HTML文檔結束</code>

二、文檔結構解析:

1、Doctype

文檔類型聲明(Document Type Declaration,也稱Doctype),它主要告訴浏覽器所檢視的文檔類型。

<code>&lt;!DOCTYPE html&gt;  不區分大小寫</code>

2、html元素

首先,元素就是标簽的意思,html元素即html标簽。html元素是文檔開始和文檔結尾的元素。它是一個首尾呼應的雙标簽,html元素有一個屬性和值

lang='zh-cn',表示文檔語言為簡體中文

<code>&lt;</code><code>html</code> <code>lang</code><code>=</code><code>"zh-cn"</code><code>&gt;   如果為英文則,lang="en"</code>

3、head元素

用來包含中繼資料内容,中繼資料包括:&lt;link&gt;、&lt;meta&gt;、&lt;moscript&gt;、&lt;script&gt;、&lt;style&gt;、&lt;title&gt;。這些内容用來浏覽器提供資訊,比如link提供CSS資訊。script提供JavaScript資訊,title提供頁面标題等。

<code>&lt;</code><code>head</code><code>&gt;...&lt;/</code><code>head</code><code>&gt;   //這些資訊在頁面不可見</code>

4、meta元素

這個元素用來提供關于文檔的資訊,其實結構有一個屬性為:charset='utf8'。表示告訴浏覽器頁面采用的編碼為什麼格式。一般情況下,就用utf8.當然,檔案儲存的時候也是utf8,而浏覽器也設定utf8既可正确顯示中文。

<code>&lt;</code><code>meta</code> <code>charset</code><code>=</code><code>'utf-8'</code><code>&gt;</code>

5、title元素

這個元素很簡單,顧名思義:設定浏覽器左上角的标題

<code>&lt;</code><code>title</code><code>&gt;标題&lt;/</code><code>title</code><code>&gt;</code>

6、body元素

用來包含文檔内容的元素,也就是浏覽器可見區域部分。所有的可見内容都應該在這裡面添加。

<code>&lt;</code><code>body</code><code>&gt;...&lt;/</code><code>body</code><code>&gt;</code>

7、a元素

一個超連結,後面會詳細讨論。

<code>&lt;</code><code>a</code> <code>href</code><code>=</code><code>'http://www.baidu.com'</code><code>&gt;百度&lt;/</code><code>a</code><code>&gt;</code>

<a href="http://blog.51cto.com/zengestudy/1896988"></a>

三、元素标簽探讨:

HTML是一種标記語言,剛才的結構我們已經詳細探讨過,這裡,我們再剖析以下這些“标記”,或者叫标簽是怎麼構成的。

1、元素

   元素是一組告訴浏覽器如何處理一些内容的标簽。每個元素都有一個關鍵字,比如:&lt;body&gt;、&lt;title&gt;、&lt;meta&gt;都是元素。不同的标簽名稱代表不同的意義。後面将會涉及到段落标簽,文本标簽、連結标簽、圖檔标簽等。

   元素

一般分為兩種:單标簽(空元素)和雙标簽。但标簽通常用于聲明或者插入某個元素。比如聲明字元編碼用&lt;meta&gt;.插入圖檔用&lt;imag&gt;,雙标簽一般用于設定一段區域的内容,将其包含起來。比如段落:

&lt;p&gt;...&lt;/p&gt;

2、屬性和值

元素除了有單雙之分,元素的内容還可以設定屬性和值。這些屬性值用來改變元素某些方面的行為。比如超連結:&lt;a&gt;中的href屬性。裡面替換網址即可連結到不同的網站當然一個元素裡面可以設定多個屬性,甚至自定義屬性。

本文轉自 曾哥最愛 51CTO部落格,原文連結:http://blog.51cto.com/zengestudy/1896988,如需轉載請自行聯系原作者

繼續閱讀