两列_右侧固定_左侧自适应 登录

下一节课程: 二列_左右固定_自己撑开父级块 (12921次播放)

5 秒后自动播放下一节
  重新观看
介绍 >

30分钟学会网站布局

难度:初级 共10节 205709次学习

新课:PHP零基础(CMS开发)教学!

立即报名
章节 评论 笔记 课件
第1章 网站快速预览[配乐版]

快速预览网站布局精华[配乐版]

02分钟38秒
第2章 单例布局_最简洁的布局形式

单列_上中下等宽布局

04分钟10秒

单列_宽度自适应_内容居中布局

04分钟34秒
第3章 两列布局_最优雅的布局形式

两列_左侧固定_右侧自适应

03分钟35秒

两列_右侧固定_左侧自适应

03分钟30秒

二列_左右固定_自己撑开父级块

10分钟06秒

两列_左右二侧_绝对定位布局

08分钟22秒
第4章 三列布局_最通用的布局形式

三列_左右固定_中间自适应布局

06分钟45秒

三列_左右绝对定位_中间适应布局

07分钟42秒
第5章 实战:QQ空间首页主体布局

QQ空间首页布局原理

16分钟37秒

全部评论我要评论

  • young

    young4年前

    div.right元素要写在div.main元素之前才可以,元素的顺序不能写错!否则右浮动时会换行

    回复
    0

  • 思源

    思源5年前

    很好的课程,对我很有帮助,谢谢老师!

    回复
    0

  • 古月丨就是我了

    古月丨就是我了5年前

    飞机管理科科技奶量高点分开了就开了

    回复
    0

  • aaaaaaaa张

    aaaaaaaa张5年前

    对方顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶

    回复
    0

  • 晓森

    晓森5年前

    很好的课程,对我很有帮助,谢谢老师!

    回复
    0

  • 後會無期

    後會無期5年前

    很好的课程,对我很有帮助,谢谢老师!

    回复
    0

  • 施生派

    施生派5年前

    很好的课程,对我很有帮助,谢谢老师!

    回复
    0

  • frank

    frank5年前

    内容很不错,值得学习

    回复
    0

  • 5年前

    直接把上节课的left改成right,也是可以的!!!

    回复
    0

  • Tear

    Tear5年前

    滴滴滴

    回复
    0

  • 洛陈珂

    洛陈珂5年前

    老师,为什么DOM的div输出会影响结果呢,如果是主体在上面就会溢出,如果是右侧限先输出就会正常?

    回复
    0

  • 张

    6年前

    直接把上节课的left改成right,也是可以的!!!

    回复
    0

  • 全部笔记发布笔记

  • lilove

    lilove6年前

    不知为何我代码浮动不起作用 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>3.两列布局右边固定左边自适应</title> <style type="text/css"> .main { height:600px; background-color:skyblue; margin-right:200px; } .right { width:200px; height:600px; background-color:lightgreen; float:right; /*设置块元素的右浮动*/ } </style> </head> <body> <div class="main">主体</div> <div class="right">右侧</div> </body> </html>

    0

  • 张

    6年前

    这样更直接 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .div1{ width: 200px; height: 600px; background-color: #ccc; float: right; } .div2{ height: 600px;background-color: red; } </style> </head> <body> <div class="div1">1</div> <div class="div2">2</div> </body> </html>

    0

  • 取消 回复 发送
  • 取消 发布笔记 发送
  • PHP中文网