width只是內容的寬度。
元素的總寬度=width padding*2 border*2 margin*2。
width=內容的寬度 padding*2 border*2。
元素的總寬度=width margin*2。
top 屬性規定元素的頂部邊緣。該屬性定義了乙個定位元素的上外邊距邊界與其包含塊上邊界之間的偏移。
注釋：如果 "position" 屬性的值為 "static"，那麼設定 "top" 屬性不會產生任何效果。position必須設定。
<
html
>
<
head
>
<
style
type
="text/css"
>
imgstyle
>
head
>
<
body
>
<
img
src="/i/w3school_logo_white.gif"
/>
<
h1>this is a heading
h1>
body
>
html
>
可以看出，是相對他的父元素定位的。
設定元素的上外邊距。
<
html
>
<
head
>
<
style
type
="text/css"
>
p.topmargin
p.compare
style
>
head
>
<
body
>
<
p class
="compare"
>這個段落沒有指定外邊距。
p>
<
p class
="topmargin"
>這個段落帶有指定的上外邊距。
p>
body
>
html
>
可以看出：margin-top外邊距相對的是離他最近的元素。
更多專業前端知識，請上
【猿2048】www.mk2048.com
標準盒子模型和IE盒子模型
盒子模型是css中乙個重要的概念，理解了盒子模型才能更好的排版。其實盒子模型有兩種，分別是ie 盒子模型和標準 w3c 盒子模型。他們對盒子模型的解釋各不相同，先來看看我們熟知的標準盒子模型 從上圖可以看到標準w3c 盒子模型的範圍包括 margin border padding content，並...
css 標準盒子模型和IE盒子模型
利用css來布局頁面布局div有點邏輯性 重點理解盒子模型,標準流和非標準流的區別,還有定位原理 把這3個攻破了,就非常簡單了 多實踐多參考 最後就是相容問題了,在實踐中自然就有經驗了 這些相容技巧都是經驗來的 盒子模型有兩種，分別是 ie 盒子模型和標準 w3c 盒子模型。他們對盒子模型的解釋各不...
盒子模型與怪異盒子模型
所有html元素可以看作盒子，在css中，box model 這一術語是用來設計和布局時使用。css盒模型本質上是乙個盒子，封裝周圍的html元素，它包括 邊距，邊框，填充，和實際內容。盒模型允許我們在其它元素和周圍元素邊框之間的空間放置元素。下面的說明了盒子模型 box model content...