对CSS了解-overflow:hidden
overflow:hidden
列出我在项目中,运用到此属性的例子:
(1)暴力清除浮动
<style type="text/css">
.wrap {overflow: hidden;zoom:;background-color: #ccc;}
.wrap p {float: left;}
</style>
<div class="wrap">
<p>test of css</p>
</div>
(2)阻止边距外折叠
<style type="text/css">
body,p {padding: 0;margin: 0;}
.wrap {overflow: hidden;zoom:;background-color: #ccc;}
.wrap p {margin-top: 20px;}
</style> <div class="wrap">
<p>test of css</p>
</div>
(3)在IE-6,解决定义1px高的块元素
<style type="text/css">
.line {height: 1px;background-color: #ccc;overflow: hidden;}
</style>
<div class="line"></div>
(4)创建两栏布局
<style type="text/css">
div {height: 500px;}
.left {float: left;background-color: #000;width: 200px;margin-right: 5px;}
.right {overflow: hidden;zoom:;background-color: #ccc;}
</style> <div class="left"></div>
<div class="right"></div>
对CSS了解-overflow:hidden的更多相关文章
- css中overflow:hidden的属性 可能会导致js下拉菜单无法显示
css中overflow:hidden属性导致ExtJS中无法显示下拉滚动条 overflow属性: visible 默认.内容不会被修剪,会呈现在元素之外. hidden 内容会被修剪,但是浏览器不 ...
- 转:css中overflow:hidden 不起作用了吗?
css中overflow:hidden 不起作用了吗? 有同学遇到这样的问题,现象是给元素设置了overflow:hidden,但超出容器的部分并没有被隐藏,难道是设置的hidden失效了吗?其实看似 ...
- CSS 的overflow:hidden 属性详细解释
overflow:hidden这个CSS样式是大家常用到的CSS样式,但是大多数人对这个样式的理解仅仅局限于隐藏溢出, 而对于清除浮动这个含义不是很了解.一提到清除浮动,我们就会想到另外一个CSS样式 ...
- CSS中overflow:hidden
CSS中,overfllow:hidden的作用是隐藏溢出 比如:<div style="width:300px;overflow:hidden" id=1><d ...
- CSS 的overflow:hidden (清除浮动)
verflow:hidden这个CSS样式是大家常用到的CSS样式,但是大多数人对这个样式的理解仅仅局限于隐藏溢出,而对于清除浮动这个含义不是很 了解.一提到清除浮动,我们就会想到另外一个CSS样式: ...
- 关于css中overflow:hidden的使用
overflow:hidden有两个用处经常用到: 1.通过设定自身的高度,加上overflow:hidden可以隐藏超过容器本身的内容: 但是,小编在以往的使用中,发现了一个问题,只要父级容 ...
- css 中 overflow: hidden清楚浮动的真正原因
1. 先上一段代码清楚浮动的代码, 外层ul设置overflow为hidden, 内层li设置float为left左浮动 <!DOCTYPE html> <html> < ...
- css & auto height & overflow: hidden;
css & auto height & overflow: hidden; {overflow: hidden; height: 100%;} is the panacea! {溢出: ...
- JS弹出层制作,以及移动端禁止弹出层下内容滚动,overflow:hidden移动端失效问题
HTML <div class="layer"> <div class="menu-list"> <span>社会</ ...
随机推荐
- shell function/for in/for (())/string concat/has dir/rename using regex/if(())/exit/execute command and pass value to variable/execute python
#!/bin/bash #remove the MER.*_ in file name for all the files in a dir function getdir(){ for elemen ...
- JSONObject和JSONArray 以及Mybatis传入Map类型参数
import org.json.JSONArray;import org.json.JSONObject; 将字符串转化为JSONArray JSONArray jsonArray = new ...
- sql server dba之路
转自:https://blog.csdn.net/dba_huangzj/article/details/7841441 在专职DBA工作一年过一个月以后,开通了CSDN的博客专栏,在第一篇文章中,我 ...
- 007-shiro与spring web项目整合【一】基础搭建
一.需求 将原来基于url的工程改成使用shiro实现 二.代码 https://github.com/bjlhx15/shiro.git 中的permission_shiro 三.去除原项目拦截器 ...
- python中math常用函数
python中math的使用 import math #先导入math包 1 三角函数 print math.pi #打印pi的值 3.14159265359 print math.radians(1 ...
- gdb各种调试命令和技巧
陈皓:用GDB调试程序 GDB概述———— GDB是GNU开源组织发布的一个强大的UNIX下的程序调试工具.或许,各位比较喜欢那种图形界面方式的,像VC.BCB等IDE的调试,但如果你是在UNIX平台 ...
- NUnit.Framework的使用方法演示
using NUnit.Framework; namespace CheckExcel { [TestFixture] public class TestExcelHelper { /// <s ...
- Python(变量、数据类型)
常量:python中没有常量,只能通过名字特征来提示例如:全部大写,如 : OLDBOY_AGE=57 一.变量 变量声明变量#!/usr/bin/env python age=18gender1=' ...
- ubuntu中在Launcher上添加Android Studio的运行图标
运行命令创建desktop文件: sudo gedit /usr/share/applications/android_studio.desktop 打开窗口后输入以下内容,注意Exec和Icon要修 ...
- make cmake catkin_make
在Linux下进行C语言编程,必然要采用GNU GCC来编译C源代码生成可执行程序. 一.GCC快速入门 Gcc指令的一般格式为:Gcc [选项] 要编译的文件 [选项] [目标文件] 其中,目标文件 ...