学 css 遇到的问题,求前端高手解答

2014-07-22 22:17:21 +08:00
 whrhw
代码是这样:
<!DOCTYPE html>
<html>
<head>
<style>
#c1{background:red;height:80px;width:30px;float:left;}
#c2{margin:0px;background:dimgray;}
#c21,#c22,#c23,#c24,#c25{margin:10px;background:green;width:100px;height:30px;}
#c22,#c24{background:gold;}
</style>
</head>
<body>

<div id="c1"></div>
<div id="c2">
<div id="c21">Text 1</div>
<div id="c22">Text 2</div>
<div id="c23">Text 3</div>
<div id="c24">Text 4</div>
<div id="c25">Text 5</div>
</div>
</body>
</html>

此时的效果图是这样:


当我把#c2的margin改为30px时效果变成了这样:


#c2会影响前面的浮动元素#c1的定位?

求v2的前端工程师解答,前端菜鸟一枚,范了低级错误求轻喷
3183 次点击
所在节点    问与答
21 条回复
whrhw
2014-07-23 13:47:27 +08:00
@wxt2005 应该加上一句只有根元素(html 元素)不会重叠,body和div一样会重叠

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/123999

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX