html:

<body>
<div class="main">
<div class="first"></div>
<div class="second"></div>

</div>
</body>

<style>
.main
{
overflow:hidden;
border:1px solid black;
}
.first{
width:100px;
height:100px;
float:left;
background:#33ffff;
}
.second
{
float:left;
width:300px;
height:300px;
background:#9900ff;

}
.clear
{
clear:both;
}
</style>

1:将main父级div增加高度

2:增加<div class="clear"></div>

3:将父级div增加:overflow:hidden

清除div浮动的三种方式的更多相关文章

  1. css中的浮动与三种清除浮动的方法

    说到浮动之前,先说一下CSS中margin属性的两种特殊现象 1, 外边距的合并现象: 如果两个div上下排序,给上面一个div设置margin-bottom,给下面一个div设置margin-top ...

  2. 【css】清除浮动的几种方式

    [css]清除浮动的几种方式   因为浮动框不在普通的文档流中,所以它不占据空间.如下面的代码: .news { background-color:gray; border:1px solid bla ...

  3. HTML连载49-清除浮动的第三种方式(内外墙法)

    一.清除浮动的第三种方式 1.隔墙法有两种​如下:外墙法和内墙法​.​ 2.外墙法 (1)在两个盒子中间添加一个额外的块级元素 (2)给这个额外添加的块级元素设置:clear:both;属性 注意点: ...

  4. css考核点整理(一)-浮动的理解和清除浮动的几种方式

    浮动的理解和清除浮动的几种方式 clear语法:clear : none | left | right | both 取值:none : 默认值.允许两边都可以有浮动对象left : 不允许左边有浮动 ...

  5. HTML5实现动画三种方式

    编者注:作者以一个运动的小车为例子,讲述了三种实现HTML5动画的方式,思路清晰,动画不仅仅是canvas,还有css3和javascript.通过合理的选择,来实现最优的实现. PS:由于显卡.录制 ...

  6. python 全栈开发,Day94(Promise,箭头函数,Django REST framework,生成json数据三种方式,serializers,Postman使用,外部python脚本调用django)

    昨日内容回顾 1. 内容回顾 1. VueX VueX分三部分 1. state 2. mutations 3. actions 存放数据 修改数据的唯一方式 异步操作 修改state中数据的步骤: ...

  7. CSS控制样式的三种方式优先级对比验证

    入职已经一个月了,自此后,就好久没有写过博客了,在此先跟关注我的博友们说声抱歉.今天,在公司的一个培训作业的驱动以及伟哥那句“再不写博客就开除你”的监督下,我终于重拾旧爱,再次登录博客园,继续与大家分 ...

  8. 使用javascript实现在页面打印的效果的三种方式

    <div id="console"></div> <script type="text/javascript"> var c ...

  9. js学习-DOM之动态创建元素的三种方式、插入元素、onkeydown与onkeyup两个事件整理

    动态创建元素的三种方式: 第一种: Document.write(); <body> <input type="button" id="btn" ...

随机推荐

  1. 字符串(后缀自动机):Codeforces Round #129 (Div. 1) E.Little Elephant and Strings

    E. Little Elephant and Strings time limit per test 3 seconds memory limit per test 256 megabytes inp ...

  2. datagridview bindingsource刷新数据

    调用bindindsource的ResetBindings() 方法

  3. 滑雪 (搜索)(dp)(贪心)

    以每一点为起点找出所有路径,并求出以此点做为起点的最大路径 求出每个点的最大路径后再找出其中最大的值,输出最大值 #include <stdio.h>#include <string ...

  4. LeetCode (85): Maximal Rectangle [含84题分析]

    链接: https://leetcode.com/problems/maximal-rectangle/ [描述] Given a 2D binary matrix filled with '0's ...

  5. Python判断上传文件类型

    在开发上传服务时,经常需要对上传的文件进行过滤. 本文为大家提供了python通过文件头判断文件类型的方法,非常实用. 代码如下 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 ...

  6. 再探LIS

    昨天讲课的时候突然想起来LIS还有一个东西没搞懂. 又去研究了下. LIS问题就是要求一个序列中最长不下降或上升子序列,而此问题应用较广,例如很多题会有这样的条件 对于i,j如果他们可以同时选取,则必 ...

  7. PHP学习之[第09讲]PHP 的 Mysql 数据库函数 (微型博客系统)

    一.数据库函数: mysql_connect(数据库地址,用户名,密码) mysql_select_db(数据库名) mysql_set_chartset(‘编码’) //PHP5.2.3以后的函数 ...

  8. SQL读取XML字段类型的信息

    USE CSOS_NEW_2 GO --(1)定义临时表 DECLARE @table TABLE(id INT IDENTITY(1,1),XMLDetail XML) DECLARE @xml X ...

  9. 九度OnlineJudge之1001:A+B for Matrices

    题目描述: This time, you are supposed to find A+B where A and B are two matrices, and then count the num ...

  10. 第十四章 红黑树——C++代码实现

    红黑树的介绍 红黑树(Red-Black Tree,简称R-B Tree),它一种特殊的二叉查找树.红黑树是特殊的二叉查找树,意味着它满足二叉查找树的特征:任意一个节点所包含的键值,大于等于左孩子的键 ...