CSS margin 外緣及邊界樣式範例 | css margin
margin屬性於CSS中使用margin屬性定義元素的外邊距,設定元件矩框的top,right,bottom,left之外緣寬度。外緣是指元件的邊線與外界內容的距離,區間為空白的透明狀態。margin屬性使用長度單位為像素、英寸、毫米或百分比值及可用負值(負值會被移到視區之外)。padding屬性於CSS中使用padding屬性定義元素的內邊距,設定元件矩框的top,right,bottom,left之內緣寬度。內緣是指元素的邊線內徑與內容的距離,區間為空白的透明狀態。padding屬性使用長度值或百分比值,但不允許使用負值。margin-top:15px;margin-right:10px;margin-bottom:15p...
margin 屬性於 CSS 中使用 margin 屬性定義元素的外邊距,設定元件矩框的 top, right, bottom, left 之外緣寬度。外緣是指元件的邊線與外界內容的距離,區間為空白的透明狀態。margin 屬性使用長度單位為像素、英寸、毫米或百分比值及可用負值(負值會被移到視區之外)。
padding 屬性於 CSS 中使用 padding 屬性定義元素的內邊距,設定元件矩框的 top, right, bottom, left 之內緣寬度。內緣是指元素的邊線內徑與內容的距離,區間為空白的透明狀態。padding 屬性使用長度值或百分比值,但不允許使用負值。
margin-top: 15px; margin-right:10px; margin-bottom:15px; margin-left:10px; margin:15px 10px 15px 10px; /*縮寫語法 = 順序為上右下左*/ margin:15px 10px; /*縮寫語法 = 前面為上下, 後面為右左*/CSS border, padding, and margin concepts div-A {border: 3px solid #1f3d35;margin:8px;} div-B {padding: 10px;} 框線 border框線 border 為矩框外圍的邊距屬性,如單位為 3px 元件實際寬高亦會增加,會佔有空間計算版面寬高時需注意到。使用框線的樣式及顏色是網頁排版上常會用到的。可以參考 box-sizing:border-box 計算寬度及高度時,為內含還是外加。
內邊距 padding內邊距 padding 會在元素內容的周圍增加指定的空間;在未指定元素寬高時該元素的內容就會受到 padding 所擠壓。
外邊距 margin外邊距 margin 的意義就是元素與元素之間的距離。
取得本站獨家住宿推薦 15%OFF 訂房優惠
CSS∥排版觀念
主要也是研究Margin、Padding、Border和每一塊區塊的長寬間的關係。 只要位置抓對了,版面的編排千變萬化呢。 CSS 排版有一個很重要的觀念: ...