我这样是否正确呢

#wrap{width:970px; margin:0 auto;} #mainbody{position:relative; margin-top:15px;} #left{float:left;width:110px;margin-right:13px;border:1px solid #999; } #mid{float:left;width:650px;border:1px solid #999;} #right{position:absolute;margin-left:794px;border:1px solid #999;}请问各位高手，我这样是否正确呢

美1

2016-01-21

源自：网页布局基础 5-1

关注问题我要回答

268

操作

收起

3 回答

粤川_shu
2016-01-22

<style type="text/css">
*{margin:0; padding:0;}
#wrap{width:970px; margin:0 auto;}
#mainbody{position:relative; margin-top:15px;}
#left{float:left;width:110px;border:1px solid #999; }
#mid{float:left;width:650px;border:1px solid #999;margin-left:13px;}
#right{position:absolute; border:1px solid #999; left:792px;}
</style>
</head>

因为#left 和#mid 使用了浮动，所以像素为图片宽度+border(1px) *2

109+2+649+2+13+17=792

#right 的left应该是792px。

0 回复有任何疑惑可以回复我~

#1

ps：我在#left 里面加了border，这在答题里面的代码本身没有~

2016-01-22 回复有任何疑惑可以回复我~

#2

i920hua 回复粤川_shu

为什么是109、649，不是110跟650吗

2016-02-02 回复有任何疑惑可以回复我~

美1 提问者
2016-01-22

为什么是790而不是792？

0 回复有任何疑惑可以回复我~

#1

792是正确的

2016-01-22 回复有任何疑惑可以回复我~

#2

写790的也没错，因为在答题图里面的#left 是没有加border的。这个细节如果加了border就是：109+2+649+2+13+17=792 不加则是：109+649+2+13+17=790

2016-01-22 回复有任何疑惑可以回复我~

蝶飞凤舞02
2016-01-21

<style type="text/css">

*{margin:0; padding:0;}

#wrap{width:970px; 【任务1】margin:0px auto;}

#mainbody{【任务3】 margin-top:15px;position:relative;}

#left{【任务2】width:110px; float:left;}

#mid{【任务2】width:650px;border:1px solid #999;float:left;margin-left:13px;}

#right{【任务3】border:1px solid #999;position:absolute;margin-left:790px;}

</style>

0 回复有任何疑惑可以回复我~

举报

0/150

提交

取消

网页布局基础

参与学习 214705 人
解答问题 1756 个

让你精通CSS中三大定位机制，彻底掌握网页布局的相关知识

我这样是否正确呢

我要回答关注问题

意见反馈帮助中心 APP下载