盒子模型概念：
盒子模型用來“放”網(wǎng)頁中的各種元素
網(wǎng)頁設(shè)計(jì)中的內(nèi)容如文字佩耳，圖片等元素，都可以是盒子（div嵌套）
普通文檔流:
? ? ? ? ? ? (沒有設(shè)置? float,position,display? )
? ? ? ? ? ? 塊元素自上而下排列,內(nèi)嵌元素自左向右排列在同一行.
? ? ? ? border:? border-width （color||style）:(四個(gè)方向：上妄田，右，下渡蜻，左)
????? border:[寬度][樣式][顏色]
?????? border-left:[寬度][樣式][顏色]
? ? ? ? ? ? 寬度? width??
? ? ? ? ? ? 顏色? color????? 顏色||transparent
? ? ? ? ? ? 樣式? style??? （none,hidden）?
內(nèi)邊距屬性：設(shè)置元素的內(nèi)容與邊框之間的距離（內(nèi)邊距或填充）分四個(gè)方向（上碱璃，右，下勾效，左）
padding-top：長度值|百分比
復(fù)合寫法：padding：值1（四個(gè)方向）
???????????????? padding：值1? 值2（上下嘹悼， 左右）
????????????????? padding：值1? 值2? 值3（上，左右层宫，下）
???????????????? padding：值1 值2 值3 值4（上杨伙，右，下萌腿，左）
值不可以設(shè)置負(fù)值 不可以設(shè)置auto 設(shè)置無效??
margin-top:長度值 | 百分比 | auto
外邊距屬性:設(shè)置元素與元素之間的距離（外邊距）4個(gè)方向（上限匣，右，下毁菱，左）
????????????????? margin：值1（四個(gè)方向）
????????????????? margin：值1? 值2（上下米死， 左右）
????????????????? margin：值1? 值2? 值3（上，左右贮庞，下）
??????????? ? ? ? margin：值1 值2 值3 值4（上峦筒，右，下窗慎，左）
內(nèi)邊距會(huì)顯示背景物喷，一般常用的布局形式
padding-left設(shè)置值卤材，background-image,把背景圖片position左邊，可以作為小圖標(biāo)顯示
值可以設(shè)置負(fù)值可以用于布局， 左右值為auto尉辑，實(shí)現(xiàn)水平方向居中顯示效果
??????
? 塊元素的外邊距的傳遞:
如果某個(gè)標(biāo)簽的第一個(gè)元素設(shè)置margin-top或者margin-bottom晕拆，margin屬性會(huì)向父級(jí)向上或者向下傳遞，如果父級(jí)元素還是它的父級(jí)元素的第一個(gè)標(biāo)簽材蹬，則會(huì)繼續(xù)向上或向下傳遞实幕，這是布局時(shí)需要注意的地方，一般使用padding內(nèi)邊距來達(dá)到需要布局的效果堤器，不過也是有解決方法
1昆庇，在父級(jí)元素設(shè)置 overflow：hidden；
2闸溃，padding-top：1px整吆；
?border-top:1px solid #f00;
注意只是在塊級(jí)元素中起作用
塊元素的疊加
垂直方向，兩個(gè)相鄰元素都設(shè)置外邊距辉川，外邊距會(huì)發(fā)生合并表蝙，合并后的外邊距高度=兩個(gè)發(fā)生合并外邊距的高度重的最大值
display:顯示屬性
? ? ? ? ? ? ? ? inline:元素顯示為內(nèi)聯(lián)元素，元素前后沒有換行符
? ? ? ? ? ? ? ? block:元素顯示為塊元素乓旗，元素前后帶有換行符
? ? ? ? ? ? ? ? inline-block:內(nèi)聯(lián)塊元素府蛇，元素呈現(xiàn)為inline，具有block相應(yīng)特性
??????????????? none ：此元素不會(huì)被顯示
? ? ? ? ? ? 普通文檔流,塊元素垂直方向的外邊距相遇會(huì)融合取大值
- 文/潘曉璐 我一進(jìn)店門中剩，熙熙樓的掌柜王于貴愁眉苦臉地迎上來忌穿，“玉大人，你說我怎么就攤上這事咽安“橥” “怎么了蓬推？”我有些...
- 文/不壞的土叔 我叫張陵妆棒，是天一觀的道長。 經(jīng)常有香客問我，道長糕珊，這世上最難降的妖魔是什么动分？ 我笑而不...
- 正文 為了忘掉前任，我火速辦了婚禮红选，結(jié)果婚禮上澜公，老公的妹妹穿的比我還像新娘。我一直安慰自己喇肋，他們只是感情好坟乾，可當(dāng)我...
- 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著蝶防，像睡著了一般甚侣。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上间学，一...
- 文/蒼蘭香墨 我猛地睜開眼，長吁一口氣：“原來是場噩夢(mèng)啊……” “哼善涨！你這毒婦竟也來了主到？” 一聲冷哼從身側(cè)響起，我...
- 序言：老撾萬榮一對(duì)情侶失蹤躯概，失蹤者是張志新（化名）和其女友劉穎登钥，沒想到半個(gè)月后，有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體娶靡，經(jīng)...
- 正文 獨(dú)居荒郊野嶺守林人離奇死亡牧牢，尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
- 正文 我和宋清朗相戀三年，在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了姿锭。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片塔鳍。...
- 正文 年R本政府宣布掌唾，位于F島的核電站放前，受9級(jí)特大地震影響，放射性物質(zhì)發(fā)生泄漏糯彬。R本人自食惡果不足惜凭语，卻給世界環(huán)境...
- 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望撩扒。 院中可真熱鬧似扔，春花似錦太防、人聲如沸所袁。這莊子的主人今日做“春日...
- 文/蒼蘭香墨 我抬頭看了看天上的太陽钝鸽。三九已至矛纹，卻和暖如春话原，著一層夾襖步出監(jiān)牢的瞬間蕾管，已是汗流浹背螃诅。 一陣腳步聲響...
- 正文 我出身青樓倘是，卻偏偏與公主長得像，于是被迫代替她去往敵國和親袭艺。 傳聞我的和親對(duì)象是個(gè)殘疾皇子搀崭，可洞房花燭夜當(dāng)晚...
推薦閱讀更多精彩內(nèi)容
- 問答題47 /72 常見瀏覽器兼容性問題與解決方案？ 參考答案 (1)瀏覽器兼容問題一：不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
- 前言 總括： 對(duì)于盒子模型猾编，BFC瘤睹，IFC和外邊距合并等概念和問題的總結(jié) 原文地址：從CSS盒子模型說起 知乎專欄...
