關于HTML
百度百科里是這么說的：超文本標記語言，即HTML（Hypertext Markup Language），是用于描述網(wǎng)頁文檔的一種標記語言。
為什么叫用于“描述”網(wǎng)頁文檔的“標記”語言呢？
簡單地說，它不像Java，C++等程式語言，而是通過標記（也稱標簽）來表示一個網(wǎng)頁的結構與內(nèi)容，它的語法非常簡單，只是由各種不同的標記組合而成，因此這類語言的學習方式主要靠積累，而非程式語言般靠理解來學習。
HTML的構成
HTML文件的結構通常由以下幾個部分構成：
文檔類型聲明（doctype）
網(wǎng)頁頭部信息（head）
網(wǎng)頁主體內(nèi)容（body）
一個最簡單的網(wǎng)頁文件：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>網(wǎng)頁標題</title>
</head>
<body>
網(wǎng)頁內(nèi)容
</body>
</html>
文檔類型
如果你了解過HTML，你可能會發(fā)現(xiàn)很多網(wǎng)頁的頭部會有這么一段又臭又長的東西：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">這到底是什么呢？這就是文檔類型的聲明了。XHTML 1.0 規(guī)定了三種 XML 文檔類型：Strict、Transitional以及 Frameset，為了兼容性與開發(fā)方便，我們一般使用Transitional。
但如果你比較細心，你會發(fā)現(xiàn)上面最簡單的網(wǎng)頁文件代碼只使用了這么一小段代碼：
<!DOCTYPE html>
這段代碼是HTML5文檔類型的聲明方式，而且是向后兼容的。
元素
塊元素（block）
div , p , h1~h6 , ul , li , dt , dd , dl , form, section , article , nav , aside...
特點：在文檔流中默認占據(jù)整行的位置。
內(nèi)聯(lián)元素（inline）
span , em , strong , label , a , img , input , button , select , var , del ...
特點： 在文檔流中默認一行可以展示多個內(nèi)聯(lián)元素。
嵌套規(guī)則
塊元素可以嵌套所有內(nèi)聯(lián)元素，內(nèi)聯(lián)元素不能嵌套塊元素。
錯誤的寫法：
<span><div>內(nèi)容</div></span>
盒子模型（Box Model）
無論是塊元素，還是內(nèi)斂元素，在HTML中都是一個“盒子”，這個盒子包含了以下屬性：
外邊距（Margin）
邊框（Border）
內(nèi)邊距（Padding）
內(nèi)容（Content）
加載中...
可以看出，在W3C標準模式下的CSS盒子模型中，盒子的內(nèi)容是不包含邊框跟內(nèi)邊距的，但在IE的Quirks（怪異）模式下，盒子的內(nèi)容包含了邊框與內(nèi)邊距，因此相同的代碼在不同的瀏覽器中查看，看到的布局可能的是完全不同的，這也是造成網(wǎng)頁瀏覽器差異的一個重要原因。
一種很簡單卻實用的解決方式是，CSS中的padding及border屬性不要同width及height屬性出現(xiàn)在同一個盒子上，而是將其分解在父子兩個元素上，便可以避免實用CSS Hack而解決瀏覽器之間的差異問題。
免費學習課堂
推薦文章
Web前端——HTML文檔與盒子模型
來源：北京匯仁智杰科技有限公司 時間：2016-11-08 點擊： 次
推薦文章
- 織夢dedecms漏洞修復大全含任意文件2016-09-05
- 整頓微信公眾號過度營銷 對嚴重違2016-01-26
- SEO優(yōu)化過程要避免什么？2016-01-26
- 網(wǎng)站空間被掛馬的原因原因及解決2016-01-26
- 2016企業(yè)該如何運用互聯(lián)網(wǎng)進行營銷2016-01-26
- WEB前端項目開發(fā)中需注意的細節(jié)2016-01-26
- 低價網(wǎng)站建設的危害有哪些？2016-01-15
- 如何詳細的分析你網(wǎng)站的競爭對手2015-06-10
- 網(wǎng)站設計中四個常犯的錯誤2015-01-22
- 如何搭配網(wǎng)站設計中的色彩？2015-01-22
