关于CSS浮动的影响

今天的作业是做一个淘宝交易的确认界面。本来以为我们关于web静态页面的基础知识已经基本学完，做这样一个基本界面应该不是一个很大的问题，可是真正接触这个项目，才发现学懂看懂和能做之间的区别。

关于这个页面的总体框架很好搭建，就是一个3段式布局，利用div和css相结合就能很好的完成总体布局。但是当往其中添相应元素时却是问题不断。这才真正理解到什么是“细节决定成败”。

其中遇到的最大问题是关于float飘动的影响问题，我们知道当一个元素浮动时，其周围的文字段落等会相应的环绕它。这样浮动的元素就会成为一座孤岛，周围的东西就会成为水流，围绕它。这时问题就来了，我们往往希望浮动的影响不要对周围原有的布局产生影响。我们往往想到的是利用clear来清除浮动的影响，但是我们却往往忘记clear是只对块级元素有用，所以经常会忽略这点导致清除影响失败。
其次是关于定位的问题，因为作业时float的浮动只有左右之分，导致我们的元素不能达到准确的位置。我就尝试着使用position来定位，可是却发现它往往不起作用。具体原因还有待解决。



原网页



效果图