zoukankan      html  css  js  c++  java
  • 闭合浮动元素(clearingfloat)的简单方法

      关于闭合浮动元素(clearing float)的方法现在已经很多了,个人认为简单实用的方法就是使用:after伪类动态的嵌入一个用于清除浮动的元素,可惜代码量太大了,看上去不够简洁。鞍山看皮肤科专业医院www.pfk0412.net

      现在看到有个方法超级简单。介绍一下这个方法。原文在:http://annevankesteren.nl/2005/03/clearing-floats

      这一方面的原理是,外围元素之所以不能很好的延伸,问题出在了overflow上,因为overflow不可见(见W3C的解释)。现在只要将给外围元素添加一个“overflow:auto”,就可以解决问题,结果是除了IE,真的可以解决。下来就要解决ID的问题了,再加上“_height:1%”,这个问题就完全解决了。

      下面的例子作为比较

      1、没有闭合浮动元素;2、非IE下闭合浮动元素;3、完全闭合元素。相关代码如下:鞍山好的皮肤病医院www.pfk0412.net

      XHTML代码:

      示例代码 [www.mb5u.com]

      Float left

      Float right

      CSS样式:

      示例代码 [www.mb5u.com]

      #wrap{ border:6px #ccc solid; overflow:auto; _height:1%;}

      .column_left{ float:left; 20%; padding:10px;}

      .column_right{ float:right; 75%; padding:10px; border-left:6px #eee solid;}

  • 相关阅读:
    [转载]Linux下mail使用技巧
    VTK Online教程大全
    拓扑结构与TopoDS
    三维视图变换与相机模型
    说说DoDataExchange(CDataExchange* pDX)
    Lua Lib在VC下的编译
    建立最简单的OpenCASCADE程序
    构建通用类型 继承 VS 聚合
    【软件】新瓶装老酒 MyCapture
    用std::find查找文件流中的内容
  • 原文地址:https://www.cnblogs.com/asds/p/7873990.html
Copyright © 2011-2022 走看看