如何用CSS进行网页布局_技术问答

首页免费课如何用CSS进行网页布局问答

如何用CSS进行网页布局

全部评论问答未解决精华

花森煜米

其实效果是有的，点击全屏查看就有了，不过即使你正确添加了margin: 0 auto;它还是没有通过。

0 2-3 编程练习

2017-06-14

无是非题

left， right脱离了标注文档流。main只能以html 为基准布局

1 4-3 编程练习

2017-06-14

Infor

我4K的显示器你们给我讲960px太宽了?

0 2-3 编程练习

2017-06-12

安魔

我觉得老师讲的很仔细~

1 2-1 一列布局

2017-06-12

qq_天子道_0

右侧先加载，左侧后加载，应该说的是下方div方框为right在上方，left在下方，这样当浏览器阅读的时候，会先读到right，这个时候添加浮动，则不能都添加左浮动。需要将right添加为右浮动，left添加为左浮动。当right属性添加为右浮动的时候，盒子边框先右浮动触碰到main右边框，然后停止浮动；left属性添加为左浮动的时候，盒子边框触碰到main左边框，然后停止浮动。这个情况两个盒子是left在左，right在右，而浏览器阅读顺序为先出现right盒子，然后浮动触碰main右边框；然后出现left盒子，浮动触碰main左边框。

2 5-3 编程挑战

2017-06-09

我不爱吃好吃的爱吃

再给第一道个歉，忘了说main高度没有设置，我自己习惯性设置了后面在看又忘了 -- 高度依照下面的left 设置为了600px 但是width=220+740=960

0 5-2 实践题

2017-06-09

我不爱吃好吃的爱吃

to热评第一，应该是没有看见main设置。代码第10行就是设置head和main同样宽度。综合答案有两种(第二种不算标准清除浮动，这等于无意义代码)
1,clear:both 清除浮动 (footer 现在处于body 里面，所以清除浮动后宽度自适应与body宽度，即是body的父标签html，即网页的宽度)
2，footer{height:50px; background:#9F9;margin:700px 0 0 0｝700=100+600(head+left or right)

2 5-2 实践题

2017-06-09

我不爱吃好吃的爱吃

to 那些说 main 还是left居于下方的骚年。热评第二说了，left 和 right连个div模块已经脱离文档流。作为单独两个盒模型去覆盖main原本的内容了，如果不经过浮动或者绝对定位，这两个模块就还是处在文档流。文档流的特性就是从上而下，从左至右依次显示。

2 4-3 编程练习

2017-06-09

我不爱吃好吃的爱吃

正如热评说的，left 和right 已经填满了 main。然后 left 样式设置的时候还多了花括号，效果图不可能实现

1 3-3 编程练习

2017-06-09

慕斯4282661

干嘛要一段一段居中麻烦啊

0 2-1 一列布局

2017-06-06

这人不懒_学习刻苦

.top{width:100%;height:100px;background:#ccc;}
.main{width:100%;height:500px;background:red;}
.left{width:200px;height:500px;background:blue;position:absolute;left:0;top:100px;}
.right{margin-left:210px;height:500px;background:#3f6;left:0;top:100;}
.foot{width:100%;height:70px;background:#F60;}

0 5-3 编程挑战

2017-06-05

这人不懒_学习刻苦

好简单，只要跟着学习步骤走完全能听明白！给自己掌声鼓励！

0 5-2 实践题

2017-06-05

这人不懒_学习刻苦

②、想按题目做的
.left{ width:300px; height:600px; background:#ccc;float:left;}/*左浮动样式*/
.right{ width:660px; height:600px; background:#fcc;float:right}/*右浮动样式*/

0 3-3 编程练习

2017-06-05

这人不懒_学习刻苦

①、想做成题目效果如示：
.left{ width:300px; height:600px; background:#ccc;float:left;}/*左浮动样式*/
.right{ width:660px; height:600px; background:#fcc;float:right;position:relative;left:30px;}/*右浮动样式*/

1 3-3 编程练习

2017-06-05

这人不懒_学习刻苦

声音太小了。。

8 1-1 内容简介

2017-06-05

首页上一页 17 18 19 20 21 22 23 下一页尾页

该课程已下架

课程须知: 1.你需要掌握html+css样式基础知识 2.有一定的前端实际开发经验

老师告诉你能学到什么？: 1.掌握网页布局的相关知识 2.能对不同的网页进行布局结构划分 3.掌握固定宽度和自适应宽度的实现方法

微信扫码，参与3人拼团

热搜

最近搜索清空

如何用CSS进行网页布局