HTML學習筆記（1）

、HTML5設計哲學，它并不是規范優先的設計，它是“妥協式”的規范。

2、HTML5對元素大小寫不再嚴格區分，開發者可以隨意使用大小寫字符來定義HTML元素。

3、對于一份基本的HTML5文檔而言，它總有如下結構：

<!DOCTYPE html>

<html>

<head>

<!—此處還可插入其他meta、樣式單等信息à

</head>

<body>

頁面內容部分

</body>

</html>

4、不要在<html>和<head>之前插入任何內容！不要在</head>和<body>之間插入任何內容！不要在</body>和</html>之前插入任何內容。

5、HTML5保留的基本元素有如下幾個：

:定義HTML注釋，里面的內容會被當成注釋處理。

<html>:它是HTML5文檔的根元素。但HTML5允許完全省略這個元素。

<head>:它用于定義HTML5文檔的頁面頭部分。但HTML5允許完全省略這個元素。

<title>:用于定義HTML5文檔的頁面標題。

<body>:用于定義HTML5文檔的頁面主體部分，該標簽可以指定id、class、style等核心屬性，還可以指定onload、onunload、onclick、ondblclick、onmousedown、onmouseup、onmouseover、onmousemove、onmouseout、onkeypress、onkeydown、onkeyup等事件屬性，這些屬性用于指定JavaScript腳本。

6、幾乎所有的HTML元素都可指定id、style和class屬性。其中ID屬性用于為HTML元素指定一個唯一標識，該標識是通過DOM訪問HTML元素的重要途徑。Class 和style屬性是CSS樣式相關屬性。

7、<span>and <div>這兩個標簽很相像，只是前者默認是不會自動換行。使用的屬性值基本一樣。

8、<span/>、<div/>和<p/>三個元素都可以作為其他內容的“容器”，在默認情況下，<span/>不會導致換行，<div/>會導致換行，<p/>會產生出段落，段落之間會有更大的間距。更要注意的是<span/>和<p/>只能包含文本、圖像、超鏈接、文本格式化元素和表單控件等內容，<p/>可以<span/>，但<span/>不能包含<p/>;<div/>元素除了可以包含上面的這些內容外，還可以包含更多的元素。

9、<b>定義粗體，<i>定義斜體,<em>定義強調文本,<strong>定義粗體文本，在HTML5中，使用<strong.../>包起來的文本代表首重要的文本。<small>定義小號字體文本，在HMTL5中專門用于標識所謂的“小字印刷體”，通常用來標注諸如免責聲明、注意事項、法律規定和版權相關的聲明性文字。

10、<sup>定義上標文本，<sub>定義下標文本;<bdo>定義文本顯示的方向，該標簽也可以指定dir屬性，該屬性值只能是ltr或者rtl。

11、在HTML5中，空元素標簽不允許將開始標簽和結束標簽分開定義。空標簽有如下：area base br col command embed hr img input keygen link mata param source wbr。如果這些標簽開始和結束標簽分開寫是錯誤的。

12、可以省略結束標簽的元素：colgroup dt dd li optgroup option p rt rp thead tbody tfoot tr td th <p>

13、可以省略全部標簽的元素： html head body tbody。

eta標簽用于存儲web頁面上的信息。本質上講,它是信息數據。他幫助瀏覽器和搜索引擎更好地知道、理解頁面內容。

web開發者，通過Mata標簽設置頁面描述、作者或關鍵字等等。然而，許多meta標簽功能,我們大多數人可能不知道。慧都控件網為大家整理了5個你可能從未知道的HTNL Meta標簽功能。

1、控制瀏覽器緩存

當我們訪問網頁，本地緩存可以讓我們提高訪問該頁面的速度。有時候，你可能會發現，你再次訪問的頁面沒有得到更新，這是因為瀏覽器顯示緩存頁面。如果，你想這種事情不再發生，通過使用Meta標簽禁用瀏覽器緩存，可以解決。代碼如下：

以上代碼在主流瀏覽器上都可以使用。可以使用更多的值和規范禁用緩存：

你也可以設置一個截止日期，以確保瀏覽器將顯示來自服務器的文件，而且是最新內容，而不是緩存中的。

上面的代碼意思是，指定的日期和時間文件過期時間。

2、設置cookie

和緩存相似，cookies你在瀏覽器訪問過的網站的一小塊數據存儲信息。現在很多網站都會使用cookie，最典型的例子，就是，我們在很多網站上看到不斷變換的廣告。如果你在百度上搜索了某商品，那么他就會被存儲下來，一般來說都會存儲1-7天，也有可能更長。

設置cookie，你可以使用下面的代碼：

name=data 是cookie名稱，由設置的值決定。反之，expired表示cookie到期后刪除的時間。如果把過期時間設置為空，你關掉瀏覽器，cookie就會被清空。

3、刷新網頁

你可以設置一段時間后對頁面進行刷新操作。meta http-equiv="refresh"可以指定瀏覽器延遲一段時間自動刷新頁面。下面的meta-tag指定瀏覽器每5秒自動刷新一次。

下圖為效果：

4、重定向

我們可以使用refresh meta標簽對頁面進行重定向。下面的例子將在5秒后訪問example.com

我們可以看下動畫效果：

如果是要立即生效，可以設計為0，如下：

5、網頁轉換

你可以使用meta-tag如PPT一樣轉換頁面，轉換語法如下：

注意：這只適合老IE瀏覽器。page-enter 、page-exit 是微軟專有的meta標簽規范。你可以使用duration設置時間。Transition由0-23的數字/整數組成。相反，meta http-equiv="page-enter" content="blendTrans(duration=sec)" 是另外的非轉換類型值。

還有好多iPhone 6 Plus沒送出去，快來看看，趕快把他領回家！！！

【年終大促巔峰盛"慧" 】促銷火熱進行中 iPhone 6 Plus、 iPhone 6、iPad Air等你免費拿

慧都聯合葡萄城產品年終大惠，第二套起，買一送一！11月17日-12月31日，機會不容錯過！

FastReport VCL 5新版發布會，2014-12-9 15:00網絡直播，免費參加立即報名，參加者買FastReport全線產品<6折>！

本站文章除注明轉載外，均為本站原創或翻譯