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的更多相关文章

  1. css中overflow:hidden的属性 可能会导致js下拉菜单无法显示

    css中overflow:hidden属性导致ExtJS中无法显示下拉滚动条 overflow属性: visible 默认.内容不会被修剪,会呈现在元素之外. hidden 内容会被修剪,但是浏览器不 ...

  2. 转:css中overflow:hidden 不起作用了吗?

    css中overflow:hidden 不起作用了吗? 有同学遇到这样的问题,现象是给元素设置了overflow:hidden,但超出容器的部分并没有被隐藏,难道是设置的hidden失效了吗?其实看似 ...

  3. CSS 的overflow:hidden 属性详细解释

    overflow:hidden这个CSS样式是大家常用到的CSS样式,但是大多数人对这个样式的理解仅仅局限于隐藏溢出, 而对于清除浮动这个含义不是很了解.一提到清除浮动,我们就会想到另外一个CSS样式 ...

  4. CSS中overflow:hidden

    CSS中,overfllow:hidden的作用是隐藏溢出 比如:<div style="width:300px;overflow:hidden" id=1><d ...

  5. CSS 的overflow:hidden (清除浮动)

    verflow:hidden这个CSS样式是大家常用到的CSS样式,但是大多数人对这个样式的理解仅仅局限于隐藏溢出,而对于清除浮动这个含义不是很 了解.一提到清除浮动,我们就会想到另外一个CSS样式: ...

  6. 关于css中overflow:hidden的使用

    overflow:hidden有两个用处经常用到: 1.通过设定自身的高度,加上overflow:hidden可以隐藏超过容器本身的内容:     但是,小编在以往的使用中,发现了一个问题,只要父级容 ...

  7. css 中 overflow: hidden清楚浮动的真正原因

    1. 先上一段代码清楚浮动的代码, 外层ul设置overflow为hidden, 内层li设置float为left左浮动 <!DOCTYPE html> <html> < ...

  8. css & auto height & overflow: hidden;

    css & auto height & overflow: hidden; {overflow: hidden; height: 100%;} is the panacea! {溢出: ...

  9. JS弹出层制作,以及移动端禁止弹出层下内容滚动,overflow:hidden移动端失效问题

    HTML <div class="layer"> <div class="menu-list"> <span>社会</ ...

随机推荐

  1. 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 ...

  2. JSONObject和JSONArray 以及Mybatis传入Map类型参数

    import org.json.JSONArray;import org.json.JSONObject; 将字符串转化为JSONArray   JSONArray  jsonArray = new ...

  3. sql server dba之路

    转自:https://blog.csdn.net/dba_huangzj/article/details/7841441 在专职DBA工作一年过一个月以后,开通了CSDN的博客专栏,在第一篇文章中,我 ...

  4. 007-shiro与spring web项目整合【一】基础搭建

    一.需求 将原来基于url的工程改成使用shiro实现 二.代码 https://github.com/bjlhx15/shiro.git 中的permission_shiro 三.去除原项目拦截器 ...

  5. python中math常用函数

    python中math的使用 import math #先导入math包 1 三角函数 print math.pi #打印pi的值 3.14159265359 print math.radians(1 ...

  6. gdb各种调试命令和技巧

    陈皓:用GDB调试程序 GDB概述———— GDB是GNU开源组织发布的一个强大的UNIX下的程序调试工具.或许,各位比较喜欢那种图形界面方式的,像VC.BCB等IDE的调试,但如果你是在UNIX平台 ...

  7. NUnit.Framework的使用方法演示

    using NUnit.Framework; namespace CheckExcel { [TestFixture] public class TestExcelHelper { /// <s ...

  8. Python(变量、数据类型)

    常量:python中没有常量,只能通过名字特征来提示例如:全部大写,如 : OLDBOY_AGE=57 一.变量 变量声明变量#!/usr/bin/env python age=18gender1=' ...

  9. ubuntu中在Launcher上添加Android Studio的运行图标

    运行命令创建desktop文件: sudo gedit /usr/share/applications/android_studio.desktop 打开窗口后输入以下内容,注意Exec和Icon要修 ...

  10. make cmake catkin_make

    在Linux下进行C语言编程,必然要采用GNU GCC来编译C源代码生成可执行程序. 一.GCC快速入门 Gcc指令的一般格式为:Gcc [选项] 要编译的文件 [选项] [目标文件] 其中,目标文件 ...