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

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

如何用CSS進行網頁布局

江老實 Web前端工程師
難度初級
時長22分
學習人數
綜合評分9.60
1991人評價 查看評價
9.8 內容實用
9.6 簡潔易懂
9.4 邏輯清晰
  • CSS進行網頁布局:1.
    查看全部
    0 采集 收起 來源:內容簡介

    2015-03-30

  • 常見布局
    查看全部
    0 采集 收起 來源:內容簡介

    2015-03-29

  • 三列布局 左右為固定寬度,中間為自適應寬度的情況,需通過絕對定位方式實現。 三列布局:左側和右側固定,中間自適應: 左側{position:absolute;left:0;top:0} 右側{position:absolute;top:0;right:0} 中間{margin-left:100px;margin-right:100px;}
    查看全部
    0 采集 收起 來源:三列布局

    2015-03-28

  • .top{height:200px;background:#999;} .main{ height: 600px; width: auto; } .left{ width: 200px; height: 600px; background: blue; float:left; } .right{ height: 600px; background: #C03; position:absolute;top:200px;right:0;left:200px; } .foot{height:100px;background:#0FF;} 最基本的混合布局
    查看全部
    0 采集 收起 來源:編程挑戰

    2015-03-27

  • 用立體的思維理解塊狀元素的布局 平列 嵌套 疊加
    查看全部
    0 采集 收起 來源:混合布局

    2015-03-27

  • ...
    查看全部
    0 采集 收起 來源:實踐題

    2015-03-27

  • ...
    查看全部
    0 采集 收起 來源:編程練習

    2015-03-27

  • 兩列布局 符合布局 可根據習慣 嵌套在一個 body的主體DIV里面
    查看全部
    0 采集 收起 來源:編程練習

    2015-03-26

  • 三列布局主要思路就是將左右兩側布局全部利用絕對定位的方式把兩個固定的div固定的兩側,因為絕對定位是不占行的,所以中間的那一個div自動浮到了頂部,然后利用外邊距來空出左右的div位置。
    查看全部
    0 采集 收起 來源:編程練習

    2015-03-24

  • 兩列布局:自適應的兩列布局:width用百分比+float; 兩列布局的自適應布局一般用的比較少,用固定的比較多 固定寬度的兩列布局:width:具體值/父級元素的寬度確定,width+百分比;+float; 如果沒有加float的話,不能實現并排的兩列布局。 div作為外聯元素獨占一行,使后面的元素在下一行(設置display:inline/inline-block可以達到float效果) 另外一種設置兩列布局(固定寬度+自適應寬度)的方法: position:relative——父元素:相對定位(因為不設置偏移量時,它還是在原來的位置,不影響其位置) position:absolute——子元素:絕對定位(通過設置top :0;margin/left設置其與另一邊的位置使其位于同行的另一側) 注意:固定寬度的列的高度>自適應的列的高度
    查看全部
    0 采集 收起 來源:二列布局

    2018-03-22

  • 實現三列布局方法: 1、讓三個div在一行,可以對每個div都設置float:left屬性。但是有些特殊效果實現不了。 2、實現左右為固定寬度(左:200px,右:300px),中間為自適應寬度的三列布局:借助絕對定位 .left{width:200px; height:500px; background:#CCC; position:absolute; left:0;top:0;} .center{height:500xp; background:#99C; margin:0 300px 0 200px; } .right{height:500px; width:300px; background:#933; position:absolute; right:0; top:0;}
    查看全部
    0 采集 收起 來源:三列布局

    2015-03-21

  • margin: 0 auto自動居中
    查看全部
    0 采集 收起 來源:練習題

    2015-03-20

  • 浮動float和絕對定位position:absolute 這2中形式可以讓元素脫離標準文檔流。
    查看全部
    0 采集 收起 來源:評測題目

    2015-03-20

  • <style type="text/css"> *{margin:0;padding:0;} #main{width:980px;margin:0 auto;} #left{width:80%;background:#ccc;float:left;} #right{width:20%;background:#ff0;float:right;} </style>
    查看全部
    0 采集 收起 來源:二列布局

    2018-03-22

  • 布局塊級元素時,首先要重置瀏覽器的相關屬性,margin、papdding;*{margin:0;padding:0;} 設置塊級元素居中時,需要設置div{margin:0 auto;}
    查看全部
    0 采集 收起 來源:一列布局

    2015-03-20

舉報

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

微信掃碼,參與3人拼團

微信客服

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

幫助反饋 APP下載

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

公眾號

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

友情提示:

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