关于浮动的前世今生
作者:糖伴西红柿 来源:前端观察 时间:2009-08-19 18:51:00
什么是浮动?
浮动是 css 的定位属性。我们可以看一下印刷设计来了解它的起源和作用。印刷布局中,文本可以按照需要围绕图片。一般把这种方式称为“文本环绕”。
这是一个例子:
在排版软件里面,存放文字的盒子可以被设置为允许图文混排,或者无视它。无视图文混排将会允许文字出现在图片的上面,就像它甚至不会在那里一样。这就是图片是否是页面流的一部分的区别。网页设计与此非常类似。
在网页设计中,应用了CSS的float属性的页面元素就像在印刷布局里面的被文字包围的图片一样。浮动的元素仍然是网页流的一部分。这与使用绝对定位的页面元素相比是一个明显的不同。绝对定位的页面元素被从网页流里面移除了,就像印刷布局里面的文本框被设置为无视页面环绕一样。绝对定位的元素不会影响其它元素,其它元素也不会影响它,无论它是否和其它元素挨着。
像这样在一个元素上用CSS设置浮动:
#sidebar { float: right; }
fload属性有四个可用的值:Left 和Right 分别浮动元素到各自的方向,None (默认的) 使元素不浮动,Inherit 将会从父级元素获取float值。
标签:浮动,float,css
0
投稿
猜你喜欢
商品评论的设计
2009-12-23 13:06:00
MySQL的远程连接出现错误提示分析
2011-07-01 11:34:00
Safari显示网页字体为超级无敌难看的宋体的原因
2008-04-20 16:49:00
快速让MySQL数据库服务器支持远程连接
2010-01-16 13:06:00
Oracle捕获问题SQL解决CPU过渡消耗
2010-07-21 13:14:00
ASP MSSQL存储过程的实现小例
2011-04-06 11:02:00
Firefox 下 innerHTML 的一个 BUG
2008-08-05 18:19:00
菜鸟课堂:详述如何提高MySQL中数据装载效率
2009-10-23 14:29:00
多维度导航探秘II
2010-08-17 21:24:00
使用 WinHttpRequest 伪造 Referer (附实战代码)
2010-08-24 18:28:00
应用技术:如何通过SQLyog分析MySQL数据库
2009-03-25 16:53:00
简单的asp采集代码教程
2011-04-18 10:39:00
Dreamweaver MX网页图片热区使用方法
2008-05-20 12:50:00
如何在浏览器地址栏显示自己的Favicons.ico图标
2007-10-22 11:45:00
MySQL两种表存储结构性能比较测试过程
2007-12-09 12:45:00
Js 按照MVC模式制作自定义控件
2008-10-12 12:11:00
IIS出现Active Server Pages错误“ASP 0201”的修复工具
2009-05-25 18:06:00
用Dreamweaver 4.0编制会议通知
2010-10-20 20:06:00
FSO如何一行行地读取文件?
2010-06-10 18:40:00
css有趣而诡异的数组
2009-02-04 16:06:00