亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

如何用CSS進行網頁布局

江老實 Web前端工程師
難度初級
時長22分
學習人數
綜合評分9.60
1991人評價 查看評價
9.8 內容實用
9.6 簡潔易懂
9.4 邏輯清晰
  • 3列布局-特殊案例 左右列固定寬度,中間列自適應。 左側絕對定位:position:absolute;left:0;top:0; 右側絕對定位:position:absolute;right:0;top:0; 中間寬度定義auto,定位:margin值:margin:0 310px 0 210px; 上右下左
    查看全部
    0 采集 收起 來源:三列布局

    2015-06-14

  • clear: both;清除浮動 Q:清除的是哪個float? A:根據footer之前的位置可以看出。和main重疊了。所以清除了main的float,footer才會下移600px,也就是main的height。也就是left的高度。600px 從html代碼來看。清除的應該是與footer同級別的DIV。
    查看全部
    0 采集 收起 來源:實踐題

    2015-06-13

  • 塊之間的關系就是 塊挨著塊, 塊嵌套著塊, 塊疊壓著塊 通過CSS樣式把這些塊位置放準確,網頁就完美了
    查看全部
    0 采集 收起 來源:混合布局

    2015-06-13

  • <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>一列布局</title> <style type="text/css"> body{margin:0;padding:0;} .main{width: 800px;height:600px;background-color: #ccc;margin: 0 auto} .top{height:100px;background-color: blue} .foot{width: 800px;height:100px; background-color: #900;margin: 0 auto} </style> </head> <body> <div class="top"></div> <div class="main"></div> <div class="foot"></div> </body> </html>
    查看全部
    0 采集 收起 來源:一列布局

    2018-03-22

  • 三列布局:左右兩側固定寬度,中間自適應。float是無法實現的。 左側絕對定位:position:absolute;left:0;top:0; 右側絕對定位:position:absolute;right:0;top:0; 中間寬度定義去掉,加上左右的margin值:margin:0 310px 0 210px;
    查看全部
    0 采集 收起 來源:三列布局

    2015-06-13

  • float/*屬性可以改變在盒子模型的位置*/ position/*屬性可以把內容定位在盒子模型的任何一個位置*/ 浮動(float)和 絕對定位(position:absolute)可以讓元素脫離文檔流
    查看全部
    0 采集 收起 來源:評測題目

    2015-06-13

  • 兩列布局,通常建兩個div,一個定義為left,一個定義為right。 一般都先清除樣式body{margin:0;padding:0;} 寬度和高度設置成百分比。記得加上浮動。
    查看全部
    0 采集 收起 來源:二列布局

    2015-06-13

  • 一列布局:比如百度首頁。 清除初始樣式margin:0;padding:0; 水平居中:margin:0 auto; 錯誤: 在.top的樣式結束后{},沒有分號! 如果有分號會導致下面的DIV無法顯示。 注意:寬帶或者高度如果是auto,在樣式里可以不寫,默認就是自動寬或者自動高。
    查看全部
    0 采集 收起 來源:一列布局

    2015-06-13

  • 1.寬度自適應 100% 2.網業的長度理論上可以無限延長 一般是頭部,主體,底部。主體一般再根據需要分欄,一般兩欄或者三欄,
    查看全部
    0 采集 收起 來源:內容簡介

    2015-06-13

  • 左邊設定絕對定位,右邊設定margin值。
    查看全部
    0 采集 收起 來源:編程挑戰

    2015-06-12

  • 清除浮動:clear:both;
    查看全部
    0 采集 收起 來源:實踐題

    2015-06-12

  • 特定條件:right自適應。左邊設定絕對定位,右邊設定margin值。 實際上這樣沒有意義。為了出題而出題吧。 總之,還是對可以控制div位置的幾個點不熟練。
    查看全部
    0 采集 收起 來源:編程挑戰

    2015-06-12

  • 塊間關系: 緊鄰 嵌套 疊加
    查看全部
    0 采集 收起 來源:混合布局

    2015-06-12

  • 三列布局
    查看全部
    0 采集 收起 來源:編程練習

    2015-06-12

  • 三列布局
    查看全部
    0 采集 收起 來源:編程練習

    2015-06-12

舉報

0/150
提交
取消
課程須知
1.你需要掌握html+css樣式基礎知識 2.有一定的前端實際開發經驗
老師告訴你能學到什么?
1.掌握網頁布局的相關知識 2.能對不同的網頁進行布局結構劃分 3.掌握固定寬度和自適應寬度的實現方法

微信掃碼,參與3人拼團

微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

友情提示:

您好,此課程屬于遷移課程,您已購買該課程,無需重復購買,感謝您對慕課網的支持!