padding和margin的用法

2021-10-04 08:54:42 字數 1271 閱讀 4790

padding的用法:

​ 1: padding是長在內容和盒子之間的,在盒子內部。

​ 2:padding是為了調整 子元素 在 父元素裡面位置關係。

​ 3:padding的特點:padding值會把盒子撐大。

​ 4:如果想讓盒子保持原有大小,需要在寬高的基礎上減掉padding值。

​ 5:給單一方向設定padding值:

​ padding-left/right/top/bottom:;

​ 6: padding 設定方法:

​ padding:1個值 四周

​ padding:2個值 上下 左右

​ padding:3個值 上 左右 下

​ padding:4個值 上右下左

​ 7: padding不能設定負值

​ 8: padding不會對背景圖造成影響。

​ 9:如果乙個盒子沒有設定固定的寬和高,新增padding是不用減的。

margin:

​ 1: margin長在元素之外的。

​ 2: margin控制的是 同級元素 之間的位置關係。

​ 3: margin不會對盒子本身的寬高造成影響。

​ 4: 給單一方向新增margin值

​ margin-left/right/bottom/top:;

​ 5: margin的設定方法:

​ margin:1個值 四周

​ margin:2個值 上下 左右

​ margin:3個值 上 左右 下

​ margin:4個值 上右下左

​ 6: margin可以設定負值。

​ 7: margin常出現的bug:

​ a:當父元素和第乙個子元素都沒有設定浮動的情況下,如果給第乙個子元素新增margin-top 會錯誤的把margin-top加在父元素上面。

​ b: 上下相鄰兩個元素之間的margin值,不會疊加,按照最大值去設定。

​ 8: margin:0 auto; 讓當前元素在父元素裡面左右居中。

規劃:​ 元素命名:

​ id劃分外圍結構 -> id選用駝峰式命名法 || 語義化news/case。

​ 版心的命名 -> 連字元命名法 news-wrap

​ 內部內容塊的命名 -> 下劃線 news_left / news_right

​ css外部樣式表:

​ 1:每個頁面都需要屬於自己的樣式表。

​ 3:重置樣式的樣式表。(清除所有預設樣式)

注:如果版心兩側沒有顏色平鋪,可以直接寫版心區域。

margin和padding之我見

採用div css排版的話,如果有float屬性,在ie中選中文字的時候,經常會出現把一整個div全部選中,非常難看 而有時候又不會出現這種情況,自己是不是遇到過了?呵呵,奇怪吧,我來給你講.其實原因很簡單,主要看你做事是不是細心.這個就是margin和padding的區別了.如果你不知道margi...

margin和padding 的區別

經常會看到這樣的布局android layout margintop 1.0dip 比較迷惑。查了下資料,有篇文章講的不錯,拿來一起分享!就拿layout margintop和paddingtop為例。layout margintop是從當前設定的控制項的頭部,開始向上移動,直到碰到上乙個控制項 父...

margin和padding的區別

padding 10px 0 10px 20px,上10 右0 下10 左20 margin 10px 0 10px 20px,上10 右0 下10 左20 四個值順時針旋轉 目前web2.0已經越來被人們認可,因為喜歡搞web開發的人員不得不硬著頭皮去學習web2.0的標準,其中很重要的一條就是新...