为了账号安全,请及时绑定邮箱和手机立即绑定

如何用CSS进行网页布局

江老实 Web前端工程师
难度初级
时长22分
学习人数
综合评分9.60
1991人评价 查看评价
9.8 内容实用
9.6 简洁易懂
9.4 逻辑清晰
  • 不会做了,留存待学
    查看全部
    0 采集 收起 来源:编程挑战

    2014-12-01

  • 清除浮动使用clear:both.
    查看全部
    0 采集 收起 来源:实践题

    2014-12-12

  • 三列布局,两边固定宽度,中间自适应。两边用绝对定位absolute,中间设置margin值
    查看全部
    0 采集 收起 来源:编程练习

    2014-12-01

  • 让元素脱离文档流:浮动(float)和绝对定位(position:absolute) 文档流:将窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素,即为文档流.(自己的理解是从头到尾按照文档的顺序,该在什么位置就在什么位置,也可以按照上面的意思理解,自上而下,自左到右的顺序)
    查看全部
    0 采集 收起 来源:评测题目

    2014-12-01

  • 浮动(float)和 绝对定位(position:absolute)可以让元素脱离文档流.
    查看全部
    0 采集 收起 来源:评测题目

    2015-01-27

  • main和footer在浏览器中水平居中
    查看全部
    0 采集 收起 来源:编程练习

    2014-12-01

  • 1. Div{width:800px; height:500px; margin:0 auto},上面这段样式,可以让div在页面的 居中
    查看全部
    0 采集 收起 来源:练习题

    2014-12-01

  • 1. 让div居中:margin:0 auto; 2. 典型单列布局:头部top 主体main 尾部foot 三个<div> 3. 清除默认样式:;body{margin:0;padding:0} 4. margin的顺序是上右下左,那么这里的0表示上方的为0,上方的对应部位也就是下方也为0.同理auto指的是右方,那么对应的左方也为auto。
    查看全部
    0 采集 收起 来源:一列布局

    2018-03-22

  • 学完
    查看全部
    0 采集 收起 来源:编程挑战

    2014-11-30

  • 块挨着块,嵌套,叠压
    查看全部
    0 采集 收起 来源:混合布局

    2014-11-30

  • 块与块的嵌套 重叠
    查看全部
    0 采集 收起 来源:实践题

    2014-11-30

  • 三列布局 两边设置绝对定位 中间一列设置margin值
    查看全部
    0 采集 收起 来源:编程练习

    2014-11-30

  • 三层布局的多种方法: 1、利用position进行三列布局的排版: .mainbody{width:960px;}//包裹在外面的mainbody .left{width:200px;position:absolute;left:0;top:0;}//position:absolute;是相对于浏览器窗口的绝对定位,即使外层包裹的mainbody怎么改变margin和padding都不改变;position:relative;是相对于标准文档流中其原来位置的的定位; .middle{width:400px;background:yellow;margin:0 20px}//相当于在文档流中正常显示,不受left和right的影响,用float的话会有很多影响 .right{width:320px;background:blue;position:absolute;top:0;right:0;} 2、利用float 如果有多个float:left,后者知道前者的float存在,不会遮挡它,与其相邻。 3、float与position并用。
    查看全部
    0 采集 收起 来源:三列布局

    2014-11-30

  • float 两列布局
    查看全部
    0 采集 收起 来源:编程练习

    2014-11-30

  • margin:0 auto
    查看全部
    0 采集 收起 来源:编程练习

    2014-11-30

举报

0/150
提交
取消
课程须知
1.你需要掌握html+css样式基础知识 2.有一定的前端实际开发经验
老师告诉你能学到什么?
1.掌握网页布局的相关知识 2.能对不同的网页进行布局结构划分 3.掌握固定宽度和自适应宽度的实现方法

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!