ie6 ie7下使用clear不能将浮动的元素换行问题

在主流浏览器中使用clear方法可以轻松完成浮动元素的换行。

例如:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>ie clear</title>
<style type="text/css">
.one{
width:100px;
height:100px;
border:solid 1px #000;
float:left;
}
.clear{
clear:left;
}</style>
</head><body>
<div class="one"></div>
<div class="one"></div>
<div class="clear one"></div>
</body>
</html>

这段代码显示结果如下

但此方法在ie6和ie7下会不起作用,也就是元素不能完成换行。

在这种情况下可以用以下方式替代。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>ie clear</title>
<style type="text/css">
.one{
width:100px;
height:100px;
border:solid 1px #000;
float:left;
}
/*.clear{
clear:left;
}*/
.clear_ie{
height:1px;
margin-top:-1px;
border:0px;
float:left;
width:100%;
}
</style>
</head><body>
<div class="one"></div>
<div class="one"></div>
<div class="clear_ie"></div>
<div class="clear one"></div>
</body>
</html>

换行成功~

转载于:https://www.cnblogs.com/michealx/p/3174729.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/575889.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

传值类型_Java内存管理:Stackoverflow问答-Java是传值还是传引用(十一)

勿在流沙筑高台&#xff0c;出来混迟早要还的。做一个积极的人编码、改bug、提升自己我有一个乐园&#xff0c;面向编程&#xff0c;春暖花开&#xff01;本文导图&#xff1a;一、由一个提问引发的思考在Stack Overflow 看到这样一个问题&#xff1a;Is Java “pass-by-refere…

java位运算(转)

位移动运算符: <<表示左移, 左移一位表示原来的值乘2. 例如&#xff1a;3 <<2(3为int型) 1&#xff09;把3转换为二进制数字0000 0000 0000 0000 0000 0000 0000 0011&#xff0c; 2&#xff09;把该数字高位(左侧)的两个零移出&#xff0c;其他的数字都朝左平移2位…

可以批量转modis投影_SNAP批量处理Sentinel2数据

Sentinel-2数据以其高时空分辨率获得了越来越多的应用&#xff0c;然而由于Sentinel-2数据空间分辨率高&#xff0c;光谱分辨率高&#xff0c;数据量也较Landsat数据大幅上升。好在ESA SNAP软件批处理功能也很强大&#xff0c;可以支撑起大数据量的应用。下面就介绍一下如何使用…

struts2整合uploadify插件怎样传参数

关于uploadify3.1&#xff0c;先看下帮助文档中的有些知识。 其中有个onUploadStart方法&#xff0c;我们可以使用这个向后台传参。 下面举个例子&#xff0c; js&#xff1a; <script type"text/javascript">$(function () {$(#actpic).uploadify({debug: fal…

对齐方式有那些_Excel基础:开始菜单之对齐方式,那些被遗忘的实用功能

今天小编要分享的Excel基础系列文章是"第三区块-对齐方式"。对齐方式主要是出来文字的排版问题&#xff0c;对齐方式包含的所有功能下面思维导图已经列出来。大多数功能都是我们常用的&#xff0c;也是比较简单的&#xff0c;这些功能小编就不说了&#xff0c;小编来…

来自Java空间的传送门

变量是程序中存储数据的基本单元&#xff0c;在该存储空间中&#xff0c;存储的数据值可以改变。 通过变量名可以简单快速地找到它存储的数据 使用Java的过程中我们需要注意一些细节&#xff0c;那就是Java语言的规范性了&#xff0c;比如Java的变量命名&#xff1a; 1.标识符…

来及Java空间的传送门2

上一篇文章我们学习了Java的4种基本数据类型&#xff0c;今天我们就继续学习Java中的2种结构类型&#xff0c;分别是单分支结构&#xff0c;双分支结构和多重if结构 单分支结构&#xff1a;条件表达式的值必须为boolean类型 条件为true时执行if内的代码 双分支结构&#xff1…

redis value最大值_Redis 的 maxmemory 和 dbnum 默认值都是多少?对于最大值会有限制吗?...

一、Redis 的默认配置了解 Redis 的都知道&#xff0c;Redis 服务器状态有很多可配置的默认值。例如&#xff1a;数据库数量&#xff0c;最大可用内存&#xff0c;AOF 持久化相关配置和 RDB 持久化相关配置等等。我相信&#xff0c;关于 AOF 持久化和 RDB 持久化的配置大家都很…

实现页面适配_微信公众号文章页面适配深色模式

最近安卓微信7.0.10正式版发布&#xff0c;更新过后&#xff0c;很多用户发现&#xff0c;之前在测试版中对系统深色模式的适配功能被取消了&#xff0c;小伙伴们对此很是不满&#xff0c;好在Android 10系统手机用户占比很少&#xff0c;影响范围还不是很大&#xff0c;并且也…

iframe悬浮在html上_HTML Iframe

HTML Iframeiframe 用于在网页内显示网页。添加 iframe 的语法URL 指向隔离页面的位置。Iframe - 设置高度和宽度height 和 width 属性用于规定 iframe 的高度和宽度。属性值的默认单位是像素&#xff0c;但也可以用百分比来设定(比如 "80%")。实例&#xff1a;html&…

mysql 当前timestamp_MySQL表结构使用timestamp以自动获取当前时间

一、怀念ACCESS的时代ACCESS的表结构如果想自动插入当前时间的时候&#xff0c;可以在列定义的时候输入默认值now ()就可以实现自动插入当前时间了。而MySQL则行不通&#xff0c;MySQL这个东东默认是命令行下面的产物&#xff0c;如果不是后来有了phpMyAdmin这个图形化界面东东…

[转]如何设置win7一直以管理员身份运行

如何设置win7一直以管理员身份运行 在win7有些程序需要以管理员的身份才能运行&#xff0c;但是我们几乎天天都要运行这些程序&#xff0c;老是要手动选下很麻烦&#xff0c;怎么样设置才能这个程序以后运行都直接是以管理员的身份运行&#xff0c;不用在让我们去选择了&#x…

MySQL substring-index_mysql函数之SUBSTRING_INDEX(str,/,-1)

SUBSTRING_INDEX的用法&#xff1a; •SUBSTRING_INDEX(str,delim,count) 在定界符 delim 以及count 出现前&#xff0c;从字符串str返回自字符串。若count为正值,则返回最终定界符(从左边开始)若为-1则是从后往前截取SELECT substring_index(Hn_P00001, P, -1) -- 结果是0000…

integer 负数字符串比较_JAVA源码之Integer-1

四、方法toString三个方法&#xff0c;其中两个static方法。1、public String toString()&#xff1a;该方法内部使用toString(int i)实现。2、public static String toString(int i)&#xff1a;该方法内部使用stringSize方法巧妙的获取入参的size&#xff0c;然后用getChars把…

springboot mysql url_spring boot 连接Mysql介绍

Spring Boot 集成教程概述java应用的数据库接口的层次图如下JDBCJava应用通过JDBC接口访问数据库&#xff0c;JDBC(Java DataBase Connectivity/Java数据库连接)为各种数据库&#xff0c;如mysql、oracle等&#xff0c;提供一个统一的接口&#xff0c;应用程序通过JDBC执行各种…

python的遍历字典里的键然后放到一个列表里_Python列表和字典互相嵌套怎么办?看完让你没有疑惑...

文 | 猿天罡前言前两篇文章&#xff0c;我们学习了Python字典的基本用法和遍历字典的三种方式。为了让小伙伴们不耗费多余的注意力&#xff0c;我们举的例子都尽可能的简单&#xff0c;不信你回去看看&#xff0c;字典键对应的值都是基本数据类型(字符串、数字等)。其实&#x…

linux如查看是否安装了mysql_linux中如何查看mysql是否安装

linux中查看mysql是否安装的方法&#xff1a;1、mysql的守护进程是mysqld如果已经安装则:[rootlocalhost ~]# service mysqld start启动 MySQL&#xff1a; [确定]如果没有安装则:[rootlocalhost ~]# service mysqld startmysqld:未被识别的服务2、通过查看服务是否…

新鲜的宣传册设计

原文地址&#xff1a;http://www.goodfav.com/brochure-designs-9367.html 宣传画册设计印刷在品牌以及企业形象建设疏导方面扮演着非常重要的角色。宣传册设计是理想的营销材料。他们将帮助您建立有意向目标受众&#xff0c;提供有价值的信息。如果没有企业宣传册&#xff0c;…

mysql门派年龄最大的人_目前活着年龄最大的人

每逢老人过生日&#xff0c;子女都会祝他长命百岁&#xff0c;但事实上&#xff0c;长命百岁能过百岁的人少之又少。那么大家知道中国现在活着的最长寿的人是谁吗?下面让小编为大家揭晓答案吧!比正式的历史文献记载最长寿者年长14岁中新网曾对这一名黎巴嫩妇女进行报道&#x…

解决Gradle生成Eclipse支持后,发布到Tomcat丢失依赖jar包的问题

最近一个项目中&#xff0c;使用号称下一代构建工具的Gradle构建项目。 使用中发现一个问题&#xff0c;Gradle从中央库下载的jar文件在系统的其它目录&#xff0c;使用gradle eclipse添加Eclipse支持时&#xff0c;jar文件是以外部依赖的形式导入的。Eclipse将web项目发布到To…