<!DOCTYPE html>

 <html>

     <head>

         <meta charset="utf-8">

         <title></title>

         <style>

             .box{

                 width: 400px;

                 border: 1px solid black;

                 overflow:hidden;    <主盒子要消除浮动给否则包不住里面的内荣>

             }

             .let{

                 float: left;

                 background-color: red;

             }

             .right{

                 float: right;

                 background-color: blue;

             }

             h2{

                 float: left;      <要使得h2不盛满一行就得给h2加一个浮动>

                 margin: 0;

                 height: 30px;

             }

         </style>

         <!--

             解决方案：float: left;

         -->

     </head>

     <body>

         <div class="box">

             <div class="let">

                 <h2>左边</h2>

             </div>

             <div class="right">

                 <h2>右边</h2>

             </div>

         </div>

     </body>

 </html>

兼容性，float的更多相关文章

  1. js实现省市区联动

    先来看看效果图吧,嘻嘻~~~~~~~~~~~~~~~~~~~· 代码在下面: 示例一: html: <!DOCTYPE html> <html> <head> &l ...

  2. ie浏览器float兼容性

    在最近的项目中,遇到label.input.和button显示同一行,需求如下 实现代码,框架为react.js <label class="formGrid__label requi ...

  3. float、定位、inline-block、兼容性需注意的特性总结

    inline-block 特性: 1.块在一排显示 2.内联支持宽高 3.默认内容撑开宽度 4.标签之间的换行间隙被解析(问题)[相当字体大小的一半] 5.ie6 ie7不支持块属性标签的inline ...

  4. 前端学习笔记之css清除浮动float的七种常用方法总结和兼容性处理

    在清除浮动前我们要了解两个重要的定义: 浮动的定义:使元素脱离文档流,按照指定方向发生移动,遇到父级边界或者相邻的浮动元素停了下来. 高度塌陷:浮动元素父元素高度自适应(父元素不写高度时,子元素写了浮 ...

  5. css清除浮动float的七种常用方法总结和兼容性处理

    在清除浮动前我们要了解两个重要的定义: 浮动的定义:使元素脱离文档流,按照指定方向发生移动,遇到父级边界或者相邻的浮动元素停了下来. 高度塌陷:浮动元素父元素高度自适应(父元素不写高度时,子元素写了浮 ...

  6. 对CSS中的Position、Float属性的一些深入探讨

    对CSS中的Position.Float属性的一些深入探讨 对于Position.Float我们在平时使用上可以说是使用频率非常高的两个CSS属性,对于这两个属性的使用上面可能大多数人存在一些模糊与不 ...

  7. IE7,6与Fireofx的CSS兼容性处理方法集结

    CSS对浏览器的兼容性有时让人很头疼,尤其是对于IE6这个问题多多的浏览器版本,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于web2.0的过度,请尽量用xhtml格式写代码 ...

  8. CSS中一些常见的兼容性问题

    CSS中一些兼容性问题就是浏览器兼容,而这些浏览器兼容问题主要是Ie和FF之间的争斗. CSS hack中的一些事: 我们为了让页面形成统一的效果,要针对不同的浏览器或不同版本写出对应可解析的CSS样 ...

  9. CSS3与页面布局学习笔记（八）——浏览器兼容性问题与前端性能优化方案

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

随机推荐

  1. 第二十节，基本数据类型,集合set、综合应用新数据更新老数据

    基本数据类型,集合set.综合应用新数据更新老数据 创建两个字典新数据,更新原始数据,a为原始数据,b为新数据 1,分别获取到a字典和b字典的key(键),将两个字典的键分别转换成两个集合 2,找出a ...

  2. simHash 简介以及java实现

    http://gemantic.iteye.com/blog/1701101 simHash 简介以及java实现 博客分类: 算法 simHash java 去重  传统的hash 算法只负责将原始 ...

  3. js算数方法

    原文:http://www.w3school.com.cn/js/js_obj_math.asp 除了可被 Math 对象访问的算数值以外,还有几个函数(方法)可以使用. 函数(方法)实例: 下面的例 ...

  4. C语言隐式强制类型转换

    今天又被精度问题困扰,把最基本的东西忘了. int n = 5; int cnt = 5.5; double sum = (n-cnt);  运算完后sum是 -0.5.不知道什么时候n转换成doub ...

  5. hdu_5794_A Simple Chess(lucas+dp)

    题目链接:hdu_5794_A Simple Chess 题意: 给你n,m,从(1,1)到(n,m),每次只能从左上到右下走日字路线,有k(<=100)的不能走的位置,问你有多少方案 题解: ...

  6. Mac 下格式化U盘

    diskutil list 查看U盘盘符: lapommedeMacBook-Pro:~ lapomme$ diskutil list /dev/disk0 (internal, physical): ...

  7. MySQL半同步复制的数据一致性探讨微信后台团队实践【转】

    MySQL是一个RDBMS(关系型数据库管理系统),由瑞典MySQL AB 公司开发,目前属于 Oracle 旗下产品.由于其体积小.速度快.拥有成本低,尤其是开放源码这一特点,广受各大企业欢迎,包括 ...

  8. ASP:GB2312格式文本文件转换成UTF-8格式

    '-------------------------------------------------'函数名称:gb2utf_file'作用:利用AdoDb.Stream对象来把GB2312格式文本文 ...

  9. iOS \'The sandbox is not sync with the Podfile.lock\'问题解决

    iOS \'The sandbox is not sync with the Podfile.lock\'问题解决 HUANGDI 发表于 2015-02-27 09:51:13 问题描述: gith ...

  10. ignite客户端找不到服务端的时候如何设置退出

    ignite启动客户端时需要有服务端支持: Ignition.setClientMode(true); Ignition.start("ignite.xml"); 这里有个问题,当 ...