IE7与FireFox、IE8下CSS浮动对比

IE7:
IE7与FireFox、IE8下CSS浮动对比<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
IE7与FireFox、IE8下CSS浮动对比transitional.dtd">
IE7与FireFox、IE8下CSS浮动对比<html>
IE7与FireFox、IE8下CSS浮动对比<head>
IE7与FireFox、IE8下CSS浮动对比<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
IE7与FireFox、IE8下CSS浮动对比<title></title>
IE7与FireFox、IE8下CSS浮动对比</head>
IE7与FireFox、IE8下CSS浮动对比<body>
IE7与FireFox、IE8下CSS浮动对比<div style="width:600px;height:300px;background-color:Black;float:left;"></div>
IE7与FireFox、IE8下CSS浮动对比<div style="width:600px;height:300px;background-color:Yellow;float:right;"></div>
IE7与FireFox、IE8下CSS浮动对比<div style="background-color:Green;height:100px;">aa</div><!--在IE7下div并不会被隐藏到浮动元素的下方，说
IE7与FireFox、IE8下CSS浮动对比明浮动元素对于div来说是占位的-->
IE7与FireFox、IE8下CSS浮动对比<table style="background-color:Red;height:10px;width:10px;"><!--在IE7下浮动元素对table会占位--> 
IE7与FireFox、IE8下CSS浮动对比<tr>
IE7与FireFox、IE8下CSS浮动对比<td>
IE7与FireFox、IE8下CSS浮动对比</td>
IE7与FireFox、IE8下CSS浮动对比</tr>
IE7与FireFox、IE8下CSS浮动对比</table>
IE7与FireFox、IE8下CSS浮动对比<span style="clear:both;"><!--在IE7下非块级元素可以清除浮动-->
IE7与FireFox、IE8下CSS浮动对比456
IE7与FireFox、IE8下CSS浮动对比</span>
IE7与FireFox、IE8下CSS浮动对比
IE7与FireFox、IE8下CSS浮动对比</body>
IE7与FireFox、IE8下CSS浮动对比</html>

FireFox/IE8
IE7与FireFox、IE8下CSS浮动对比<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
IE7与FireFox、IE8下CSS浮动对比transitional.dtd">
IE7与FireFox、IE8下CSS浮动对比<html>
IE7与FireFox、IE8下CSS浮动对比<head>
IE7与FireFox、IE8下CSS浮动对比<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
IE7与FireFox、IE8下CSS浮动对比<title></title>
IE7与FireFox、IE8下CSS浮动对比</head>
IE7与FireFox、IE8下CSS浮动对比<body>
IE7与FireFox、IE8下CSS浮动对比<div style="width:600px;height:300px;background-color:Black;float:left;"></div>
IE7与FireFox、IE8下CSS浮动对比<div style="width:600px;height:300px;background-color:Yellow;float:right;"></div>
IE7与FireFox、IE8下CSS浮动对比<div style="background-color:Green;height:100px;">aa</div><!--在IE8下div会被隐藏到浮动元素的下方，说明浮动元素对于
IE7与FireFox、IE8下CSS浮动对比div来说是不占位的，但是aa被挤在了中间，说明浮动元素对div中的非块级元素是要占位的-->
IE7与FireFox、IE8下CSS浮动对比<table style="background-color:Red;height:10px;width:10px;"><!--在IE8下浮动元素对table会占位，由此更佳说明在IE8和
IE7与FireFox、IE8下CSS浮动对比FireFox下浮动元素只对div来说不占位--> 
IE7与FireFox、IE8下CSS浮动对比<tr>
IE7与FireFox、IE8下CSS浮动对比<td>
IE7与FireFox、IE8下CSS浮动对比</td>
IE7与FireFox、IE8下CSS浮动对比</tr>
IE7与FireFox、IE8下CSS浮动对比</table>
IE7与FireFox、IE8下CSS浮动对比<span style="clear:both;"><!--在IE8下非块级元素不可以清除浮动-->
IE7与FireFox、IE8下CSS浮动对比456
IE7与FireFox、IE8下CSS浮动对比</span>
IE7与FireFox、IE8下CSS浮动对比<p style="clear:both;"><!--在IE8下块级元素可以清除浮动-->
IE7与FireFox、IE8下CSS浮动对比789
IE7与FireFox、IE8下CSS浮动对比</p>
IE7与FireFox、IE8下CSS浮动对比</body>
IE7与FireFox、IE8下CSS浮动对比</html>
IE7与FireFox、IE8下CSS浮动对比


另外有几个需要注意的地方：
div的display:inline后会完全消失

在IE和FireFox下:
IE7与FireFox、IE8下CSS浮动对比<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
IE7与FireFox、IE8下CSS浮动对比transitional.dtd">
IE7与FireFox、IE8下CSS浮动对比<html>
IE7与FireFox、IE8下CSS浮动对比<head>
IE7与FireFox、IE8下CSS浮动对比<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
IE7与FireFox、IE8下CSS浮动对比<title></title>
IE7与FireFox、IE8下CSS浮动对比</head>
IE7与FireFox、IE8下CSS浮动对比<body>
IE7与FireFox、IE8下CSS浮动对比<div  style="background-color:Maroon; width:60px; height:60px; float:left;">
IE7与FireFox、IE8下CSS浮动对比
IE7与FireFox、IE8下CSS浮动对比</div><!--浮动元素会对其紧接的块级元素减少部分块，例如table:t1是块级元素，div浮动后t1却在div的右边没有满满的占满一行只占满了div右边部分-->
IE7与FireFox、IE8下CSS浮动对比<table id="t1" style="background-color:Green; width:60px; height:60px;">
IE7与FireFox、IE8下CSS浮动对比<tr>
IE7与FireFox、IE8下CSS浮动对比<td>
IE7与FireFox、IE8下CSS浮动对比
IE7与FireFox、IE8下CSS浮动对比</td>
IE7与FireFox、IE8下CSS浮动对比</tr>
IE7与FireFox、IE8下CSS浮动对比</table>
IE7与FireFox、IE8下CSS浮动对比第二行
IE7与FireFox、IE8下CSS浮动对比</body>
IE7与FireFox、IE8下CSS浮动对比</html>
IE7与FireFox、IE8下CSS浮动对比

相关文章：

  • 2022-01-10
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-01-11
  • 2021-06-10
猜你喜欢
  • 2022-01-31
  • 2021-12-18
  • 2022-12-23
  • 2021-07-12
  • 2022-01-18
相关资源
相似解决方案
热门标签
Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode