清除浮动2-父元素设置overflow:hidden
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="Author" content="胡超">
<title>super胡</title>
<style>
.news {
background-color: gray;
border: solid 1px black;
overflow:hidden;
zoom:1;
/*父元素设置overflow:hidden
通过设置父元素overflow值设置为hidden;在IE6中还需要触发 hasLayout ,例如 zoom:1;
Zoom的使用方法:
zoom : normal | number normal :
默认值。使用对象的实际尺寸 number :
百分数 | 无符号浮点实数。浮点实数值为1.0或百分数为100%时相当于此属性的 normal 值 用白话讲解就是zoom:后面的数字即放大的倍数,可以是数值,也可以是百分比。如:zoom:1,zoom:120%。 而这个属性只要在IE中才起作用,所以很少用到它的实际用途,而最经常用到作用是清除浮动等。*/
}
.news img {
float: left;
}
.news p {
float: right;
}
</style>
</head>
<body>
<div class="news clearfix">
<img src="7v/1318240446520.jpg" />
<p>some text</p>
</div>
</body>
</html>
清除浮动2-父元素设置overflow:hidden的更多相关文章
- [Web 前端] inline-block元素设置overflow:hidden属性导致相邻行内元素向下偏移
cp from : https://blog.csdn.net/iefreer/article/details/50421025 在表单修改界面中常会使用一个标签.一个内容加一个修改按钮来组成单行界面 ...
- 给元素设置overflow:hidden,pc端正常,但移动端依然可以滑动
给设置overflow:hidden的元素设置position:fixed即可解决
- 父元素设置overflow,绝对定位的子元素会被隐藏或一起滚动
一般情况: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <met ...
- float浮动导致父元素高度坍塌的原因及清除浮动方法
一.浮动产生原因 一般浮动是什么情况呢?一般是一个盒子里使用了CSS float浮动属性,导致父级对象盒子不能被撑开,这样CSS float浮动就产生了. 本来两个黑色对象盒子是在红色盒子内, ...
- 清除浮动以及:after元素
http://www.iyunlu.com/demo/enclosing-float-and-clearing-float/index.html 以上这篇示意图把清除浮动的几种方法讲的非常清楚了,其中 ...
- 为什么我们要给父级元素写overflow:hidden
有这样的一种情况,有的时候,我们的父级元素设置了高度,一般来说,父级元素的高度是根据子元素的高度来自适应撑开的,如果我们的父级元素也设置了高度,那么其高度就不会随着子元素的的大小而自适应,也许有的时候 ...
- 关于子元素的margin-top溢出和元素浮动对父元素高度影响解决方案
以下是个人学习笔记,仅供学习参考. 1.关于子元素的margin-top作用在无margin-top-border的父元素上导致子元素的margin-top溢出问题. 在给没有margin-top-b ...
- 解决IE6,IE7下子元素使用position:relative、父元素使用overflow:auto后,子元素不随着滚动条滚动的问题
解决IE6,IE7下子元素使用position:relative.父元素使用overflow:auto后,子元素不随着滚动条滚动的问题 在IE6,IE7下,子元素使用position:relati ...
- 父元素设置min-height子元素设置100%问题
问题:父元素设置min-height子元素高度设置100%取不到值,这是因为子元素 div设置 height:100%: 只有当父级元素满足min-height:1000px;设置的条件才触发: 浏览 ...
随机推荐
- 166. Fraction to Recurring Decimal -- 将除法的商表示成字符串(循环节用括号表示)
Given two integers representing the numerator and denominator of a fraction, return the fraction in ...
- 集成 Union Pay - 银联支付
作者感言 前面已经把WeChat SDK的支付, AliPay SDK搞得七七八八了, 接下来就是银联支付的Union Pay SDK.最后:如果你有更好的建议或者对这篇文章有不满的地方, 请联系我, ...
- Java 集合系列 16 HashSet
java 集合系列目录: Java 集合系列 01 总体框架 Java 集合系列 02 Collection架构 Java 集合系列 03 ArrayList详细介绍(源码解析)和使用示例 Java ...
- hdu5878 I Count Two Three(二分+ 打表)
题目链接:hdu5878 I Count Two Three 题意:给出一个整数n, 找出一个大于等于n的最小整数m, 使得m可以表示为2^a * 3^b * 5^c * 7^d. 题解:打表预处 ...
- 3D MAX在立方体的使用
3D MAX不会“复用”立方体的顶点-----它直接计算该立方体需要12个三角面,每个三角面需要3个顶点,这样一共是36个顶点-----其实有大量顶点的位置是相同的,但3D MAX不管这些.它认为 ...
- Blackhat EU 2013 黑客大会(Full Schedule for Black Hat USA 2013)
大会文档下载:https://www.blackhat.com/eu-13/archives.html 此次BH EU 议题整体较水,涉及系统安全.移动安全.网络传输安全.WEB安全.游戏安全等.下面 ...
- Admob(6.12.x)符号未定义错误的解决方法(IOS)
在升级Admob的SDK版本到6.12.x时, 按照官方文档操作(https://developers.google.com/mobile-ads-sdk/docs/#ios), 添加如下framew ...
- 二模 (11) day2
第一题: 题目大意: 有一本n个单词的字典,其中每个单词的长度不超过4且大于0.现在给你一篇文章,文章中没有分隔符,只有小写字母.现在需要你修改最少的字母,使文章(长度为m 是由字典中的单词构成. n ...
- SQL CAST, CONVERT 比较
本文转自:http://www.cnblogs.com/denylau/archive/2010/12/01/1893371.html if (@StartTime > @EndTime) ...
- Codeforces Round #326 (Div. 2)-Duff in Love
题意: 一个数x被定义为lovely number需要满足这样的条件:不存在一个数a(a>1),使得a的完全平方是x的因子(即x % a2 != 0). 给你一个数n,求出n的因子中为love ...