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

如何用CSS进行网页布局

江老实 Web前端工程师
难度初级
时长22分
学习人数
综合评分9.60
1991人评价 查看评价
9.8 内容实用
9.6 简洁易懂
9.4 逻辑清晰

最新回答 / Blizzard_lihe
按照标准文档流,从上到下,从左至右进行加载。,
left:0; top:0之间记得加;号
感谢慕课网
我用的chrome浏览器,然而“foot“底部会跟‘’top“重合。。。
.top{width:100%;height:50px; background:#666}
.main{ width:100%; height:600px;}
.left{ width:200px; background:#00F;float:left; height:600px; position:absolute;left:0;top:50px;}
.right{ background:#3F0;height:600px; margin:0 0 0 200px;}
.foot{ width:auto;background:#F00}

已采纳回答 / DD慕帆
可以使用快捷键”ctrl+/“,如果你没有改的话,很多编辑软件都适用

已采纳回答 / qq_耳东东_04258867
.right{width:65%; height:600px; background-color:green; float:right; }}最后多了一个括号!去掉就行了
.top{width:100%;height:80px;background:#ccc;}
.main{height:400px;background:red;}
.left{width:200px;height:400px;background:blue;position:absolute;}
.right{margin-left:210px;height:400px;background:green;position:absolute;width:100%;}
.foot{height:55px;background:#ff9933;margin-bottom:0;}
这个才完美
.top{width:100%;height:80px;background:#ccc;}
.main{height:400px;background:red;}
.left{width:200px;height:400px;background:blue;position:absolute;}
.right{margin-left:210px;height:400px;background:green;position:absolute;width:85%;}
.foot{height:55px;background:#ff9933;margin-bottom:0;}
我这个完全没问题 过关
哈哈 评论区可以的
基础课,很适合入门,听完之后对CSS+DIV布局有了清晰地认识,赞赞赞!
有和我一样用 blue yellow red grey的同学么
.top{height:80px;background:#ccc;}
.main{height:300px;background:red;}
.left{height:300px;width:200px;background:blue;position:absolute;left:0;top:80px;}
.right{height:300px;;background:green;margin-left:210px;}
.foot{height:30px;background:yellow;}
.top{height:80px;background:#ccc;}
.main{height:300px;background:red;}
.left{height:300px;width:200px;background:blue;position:absolute;left:0;}
.right{height:300px;;background:green;position:absolute;left:210px;right:0;}
.foot{height:30px;background:yellow;}
同学们,复制评论代码时,注意单词错误以及中英文符号切换,别问我怎么知道的。正确的-->margin:0 auto;
了解了网页布局的基本知识
课程须知
1.你需要掌握html+css样式基础知识 2.有一定的前端实际开发经验
老师告诉你能学到什么?
1.掌握网页布局的相关知识 2.能对不同的网页进行布局结构划分 3.掌握固定宽度和自适应宽度的实现方法

微信扫码,参与3人拼团

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

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

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

举报

0/150
提交
取消