在使用JQueryUI chosen插件的时候,由于页面布局的原因,下拉列表框超出div范围,图形效果严重变形,一点解决的思路都没有,最后请教公司前端,瞬间解决,原来使用CSS 中的overflow属性就搞定了。

现重新学习下overflow的知识:

浏览器支持

所有主流浏览器都支持 overflow 属性。

注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "inherit"。

定义和用法

overflow 属性规定当内容溢出元素框时发生的事情。

说明

这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制。因此,有可能即使元素框中可以放下所有内容也会出现滚动条。

默认值: visible
继承性: no
版本: CSS2
JavaScript 语法: object.style.overflow="scroll"

可能的值

值 描述
visible 默认值。内容不会被修剪,会呈现在元素框之外。
hidden 内容会被修剪,并且其余内容是不可见的。
scroll 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。
auto 如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。
inherit 规定应该从父元素继承 overflow 属性的值。

w3c地址:http://www.w3school.com.cn/cssref/pr_pos_overflow.asp

overflow属性的应用的更多相关文章

  1. CSS中的overflow属性

    导读:overflow属性一般用来隐藏超过div范围的元素,包括不隐藏(visible),直接隐藏(hidden),用滚动条隐藏(scroll),自动(aotu)这四个属性.当然overflow的用法 ...

  2. overflow属性

    css属性overflow属性定义溢出元素内容区的内容会如何处理.如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制. 参数是scroll时候,必会出现滚动条. 参数是auto时候,子 ...

  3. CSS overflow 属性

     值 描述 visible 默认值.内容不会被修剪,会呈现在元素框之外. hidden 内容会被修剪,并且其余内容是不可见的. scroll 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容. ...

  4. 转:CSS Overflow 属性

    原文:CSS Overflow 属性译自:The CSS Overflow Property版权所有,转载请注明出处,多谢!! 根据CSS的盒模型概念,页面中的每个元素,都是一个矩形的盒子.这些盒子的 ...

  5. overflow属性及其在ios下卡顿问题解决

    overflow属性:http://www.w3school.com.cn/cssref/pr_pos_overflow.asp overflow:scroll/auto;在手机页面滑动不流畅问题: ...

  6. CSS3对于盒中容纳不下的内容的显示——overflow属性

    overflow属性 1.如果将overflow属性值设定为hidden,则超出容纳范围的文字将被隐藏起来. div{ overflow:hidden; } 2.如果将overflow属性值设定为sc ...

  7. 【CSS学习】--- overflow属性

    一.前言 在网页布局中,未处理的溢出元素绝对算得上是个“毒瘤”.因为如果一个“盒子”周围还有其它元素,而从这个盒子中溢出的元素会和盒子周围的元素发生层叠,并脱离了整个HTML元素,所以我们应当合理使用 ...

  8. 字体图标,盒子显隐,overflow属性,伪类设计边框,盒子阴影2d形变

    字体图标 ''' fa框架: http://fontawesome.dashgame.com/ 下载 => 引入css文件 引入字体图标库 <link rel="styleshe ...

  9. div包裹页面后多余部分没有显示,也没滚动条 overflow 属性设置

    今天弄个div套着一个页面结果那个页面超出范围后页面没有滚动条可以滚动浏览下面的内容,原来是设置了overflow的hidden属性 visible 默认值.内容不会被修剪,会呈现在元素框之外. hi ...

  10. overflow属性-摘自网友

    关于我们 版权声明 网站地图 前端观察 专注于网站前端设计与前端开发 用IE6抢不到火车票的!!! Home 首页 CSS样式之美 Front News前端资讯 JavascriptAjax与JS技术 ...

随机推荐

  1. 27. docker compose 单机 均衡负载

    1.编写Dockerfile #Dockerfile FROM python:2.7 LABEL maintaner="eaon eaon123@docker.com" COPY ...

  2. php的date()函数判断今天是星期几

    d  月份中的第几天,有前导零的 2 位数字 01 到 31 D  星期中的第几天,文本表示,3 个字母 Mon 到 Sun j  月份中的第几天,没有前导零 1 到 31 l  ("L&q ...

  3. 吴裕雄--天生自然TensorFlow2教程:维度变换

    图片视图 [b, 28, 28] # 保存b张图片,28行,28列(保存数据一般行优先),图片的数据没有被破坏 [b, 28*28] # 保存b张图片,不考虑图片的行和列,只保存图片的数据,不关注图片 ...

  4. 吴裕雄--天生自然 PHP开发学习:表单验证

    <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title> ...

  5. 手动安装GCC4.8.5

    服务器是 redhat 6,安装xgboost时,提示自带gcc 太老, 需要手动升级. 1). 手动安装 mpc-0.8.2.tar.gz, 用默认参数, 安装完后添加系统变量 export LD_ ...

  6. 吴裕雄--天生自然TensorFlow高层封装:Keras-多输入输出

    # 1. 数据预处理. import keras from keras.models import Model from keras.datasets import mnist from keras. ...

  7. GIL全局解释器锁-死锁与递归锁-信号量-event事件

    一.全局解释器锁GIL: 官方的解释:掌握概念为主 """ In CPython, the global interpreter lock, or GIL, is a m ...

  8. TPO5-1 Minerals and plants

    Only recently have investigators considered using these plants to clean up soil and waste sites that ...

  9. 曾经倍受年轻人追棒的Facebook为何如今却被称为“老年人社交网站”?

    一直以来,Facebook都被视为最受年轻人欢迎的社交媒体.毕竟此前在社交领域,能跟Facebook这一庞然巨物掰手腕的网站.应用几乎还没出现.但很显然,随着Instagram和Snapchat等新型 ...

  10. DataSet,DataTable排序(转载)

    DataSet,DataTable排序   关于对已经绑定的DataSet的排序的问题: DataSet ds=new DataSet();DataView dv=new DataView();dv. ...