CSS定位属性Position详解(3)

作者:帕兰 来源:帕兰映像 时间:2009-09-16 20:37:00 

7. 浮动

对于可变高度的列来说,绝对定位就不起作用了,以下是另外一个方案。

我们可以浮动一个元素,使它移动到左边/右边,并且是文本环绕着它。这主要用于图像,但这里我们把它用于一个复杂的布局任务(因为这是我们唯一的工具)。

#div-1a {
 float:left;
 width:200px;
}

8. 浮动列

如果我们把一个元素向左浮动,并且把第二个元素也向左浮动,they will push up against each other。

#div-1a {
 float:left;
 width:150px;
}
#div-1b {
 float:left;
 width:150px;
}

9. 清除浮动列

在浮动元素之后,我们可以清除浮动来使其他元素正确定位。

#div-1a {
 float:left;
 width:190px;
}
#div-1b {
 float:left;
 width:190px;
}
#div-1c {
 clear:both;
}

英文原文:Learn CSS Positioning in Ten Steps
中文译文:CSS Position

标签:css,定位,position
0
投稿

猜你喜欢

  • IE8的一些CSS hack

    2008-03-17 13:08:00
  • js获取select选中的option的text示例代码

    2024-04-19 09:58:48
  • 深入浅析python继承问题

    2023-05-20 15:22:26
  • JavaScript中自带的 reduce()方法使用示例详解

    2024-02-24 09:37:11
  • Python标准库calendar的使用方法

    2023-09-01 01:28:07
  • javascript生成大小写字母

    2024-04-17 10:26:30
  • js 兼容多浏览器的回车和鼠标焦点事件代码(IE6/7/8,firefox,chrome)

    2024-04-23 09:24:07
  • OpenCV+python实现实时目标检测功能

    2023-11-03 01:59:35
  • Hibernate4在MySQL5.1以上版本创建表出错 type=InnDB

    2024-01-14 23:45:17
  • Ubuntu下安装卸载python3.8的过程

    2021-09-06 10:43:28
  • python实现名片管理系统

    2021-04-02 22:21:40
  • MYSQL主从库不同步故障一例解决方法

    2010-06-09 19:12:00
  • ITK 实现多张图像转成单个nii.gz或mha文件案例

    2023-02-18 20:39:51
  • Python爬豆瓣电影实例

    2022-03-22 20:03:12
  • python获取目录下所有文件的方法

    2023-08-20 13:55:24
  • Python高级架构模式知识点总结

    2023-12-19 14:36:47
  • js实现的星星评分功能函数

    2024-06-16 10:28:07
  • vc6编写python扩展的方法分享

    2022-05-12 16:39:30
  • vue.js表格分页示例

    2024-05-02 16:40:45
  • django之导入并执行自定义的函数模块图解

    2023-07-27 02:45:19
  • asp之家 网络编程 m.aspxhome.com