带来一篇网页制造技能:float和clear的成绩

显示全部楼层 · 发表于 2015-1-15 22:58:36

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

您需要登录才可以下载或查看，没有帐号？立即注册

x

强大的字体控制和排版能力。CSS控制字体的能力比糟糕的FONT标签好多了。
破洛洛文章简介：就教关于float和clear的成绩。
<html>
<head>
<title>test</title>
<styletype="text/css">
body,div{margin:0;padding:0;}
.one{width:100px;height:30px;background:#900;float:left;clear:right;}
.two{width:150px;height:50px;background:#009;}
</style>
</head>
<body>
<divclass="one">sometext.</div>
<divclass="two">sometext.</div>
</body>
</html>

1、div中的text内容排布是甚么纪律，为何text内同不会被粉饰？

登录/注册后可看大图

2012-4-1817:15:22上传下载附件(2.04KB)

2、在.one中到场白色clear后是否是应当分明失落.one右边的浮动影响，也就是说右边不克不及呈现浮动div，而在.two中到场float：left后.two仍然像教程中一样浮动横向分列；

登录/注册后可看大图

2012-4-1817:17:19上传下载附件(461Bytes)

3、在.two中到场float后再到场clear:left就可以完成扫除失落浮动效果，.two在.one上面分列；

登录/注册后可看大图

2012-4-1817:19:29上传下载附件(531Bytes)
clearleft无效

解答：
第一点内里的TEXT内同（容？）不会被粉饰是指two内里的吗？我是如许了解的，div是块级元素，块级元素之间默许的效果应当是你的第三张图那样，当你给.one一个左浮动后它就离开了文档流，以是.two就移上往了，可是.two内里的笔墨仍是被挤上去了，谁人高度恰好是.one的高度。
第二点，clear扫除的不是本人的浮动，而是上一个标签的浮动，以是你在.one内里加clear实在没有任何感化，不管是clear:left,clear:right仍是clear:both都一样，像你说的，要扫除失落浮动效果只能在.two内里加clear:left才行。
</p>
在主页制作时采用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。

		自动登录	找回密码
密码			立即注册

[DIV+CSS] 带来一篇网页制造技能:float和clear的成绩

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

相关帖子