[CSS布局基礎(chǔ)]

CSS三種定位機制: 標準文檔流柱搜、浮動定位和絕對定位

盒子模型的3D立體圖

盒子模型是網(wǎng)頁布局的基石

Paste_Image.png

從上到下依次是:border逞度、content+padding氛谜、background-image(背景圖片)轻庆、background-color(背景顏色)氮双、margin
盒子模型的3D立體圖很重要昭伸,是布局的基礎(chǔ)

一列自動居中

當設(shè)置了margin: 0 auto屬性實現(xiàn)自動居中后布隔,如果再設(shè)置float或絕對定位离陶,則原先的居中效果將消失自動居中

float布局

當子元素設(shè)置了float后,父元素會受到影響

flex布局

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末执泰,一起剝皮案震驚了整個濱河市枕磁,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌术吝,老刑警劉巖计济,帶你破解...
    沈念sama閱讀 206,968評論 6 482
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異排苍,居然都是意外死亡沦寂,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,601評論 2 382
  • 文/潘曉璐 我一進店門淘衙,熙熙樓的掌柜王于貴愁眉苦臉地迎上來传藏,“玉大人,你說我怎么就攤上這事√赫欤” “怎么了哭靖?”我有些...
    開封第一講書人閱讀 153,220評論 0 344
  • 文/不壞的土叔 我叫張陵,是天一觀的道長侈离。 經(jīng)常有香客問我试幽,道長,這世上最難降的妖魔是什么卦碾? 我笑而不...
    開封第一講書人閱讀 55,416評論 1 279
  • 正文 為了忘掉前任铺坞,我火速辦了婚禮,結(jié)果婚禮上洲胖,老公的妹妹穿的比我還像新娘济榨。我一直安慰自己,他們只是感情好绿映,可當我...
    茶點故事閱讀 64,425評論 5 374
  • 文/花漫 我一把揭開白布擒滑。 她就那樣靜靜地躺著,像睡著了一般叉弦。 火紅的嫁衣襯著肌膚如雪橘忱。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,144評論 1 285
  • 那天卸奉,我揣著相機與錄音,去河邊找鬼颖御。 笑死榄棵,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的潘拱。 我是一名探鬼主播疹鳄,決...
    沈念sama閱讀 38,432評論 3 401
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼芦岂!你這毒婦竟也來了瘪弓?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 37,088評論 0 261
  • 序言:老撾萬榮一對情侶失蹤禽最,失蹤者是張志新(化名)和其女友劉穎腺怯,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體川无,經(jīng)...
    沈念sama閱讀 43,586評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡呛占,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,028評論 2 325
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了懦趋。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片晾虑。...
    茶點故事閱讀 38,137評論 1 334
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出帜篇,到底是詐尸還是另有隱情糙捺,我是刑警寧澤,帶...
    沈念sama閱讀 33,783評論 4 324
  • 正文 年R本政府宣布笙隙,位于F島的核電站洪灯,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏逃沿。R本人自食惡果不足惜婴渡,卻給世界環(huán)境...
    茶點故事閱讀 39,343評論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望凯亮。 院中可真熱鬧边臼,春花似錦、人聲如沸假消。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,333評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽富拗。三九已至臼予,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間啃沪,已是汗流浹背粘拾。 一陣腳步聲響...
    開封第一講書人閱讀 31,559評論 1 262
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留创千,地道東北人缰雇。 一個月前我還...
    沈念sama閱讀 45,595評論 2 355
  • 正文 我出身青樓,卻偏偏與公主長得像追驴,于是被迫代替她去往敵國和親械哟。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 42,901評論 2 345

推薦閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案殿雪? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽?zāi)J的外補...
    _Yfling閱讀 13,728評論 1 92
  • 本文檔回顧了在工作中常會用到的html/css的布局基礎(chǔ)暇咆,由于很多坑只有在實際中踩到才會去總結(jié),因此丙曙,本文也會不定...
    你的肖同學閱讀 408評論 0 1
  • 什么是布局 現(xiàn)有樣式 文檔流 浮動 定位 不能滿足人們的需求. 人們需要: 導航欄+內(nèi)容 導航欄+內(nèi)容+廣告欄 從...
    愁容_騎士閱讀 2,536評論 0 2
  • [toc] 使用CSS美化表格和表單元素 數(shù)據(jù)表格及結(jié)構(gòu) 設(shè)置相應(yīng)表格內(nèi)容, 職責注意的屬性: 讓橫坐標和縱坐標教...
    hi句身閱讀 462評論 0 0
  • 今生已矣且將 所有無法形容的渴望與企盼 凝聚成一粒孤獨的種子 播在來世 讓時光逝去最簡單的方法 就是讓白日與黑夜
    三寸天堂閱讀 146評論 0 0