在使用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. Java 继承(extends)、抽象类(abstract)的特点用法原理(7)

    Java  中的继承 继承: java中的抽象类用法原理: /* 当多个类中出现相同功能,但是功能主体不同, 这是可以进行向上抽取.这时,只抽取功能定义,而不抽取功能主体. 抽象:看不懂. 抽象类的特 ...

  2. php分页代码。

     $result_count=select("hy_news_en",$where,'','','count(1)');     $count=mysql_fetch_array( ...

  3. Mac中制作USB系统启动盘

    .iso镜像文件转 .dmg文件 hdiutil convert -format UDRW -o linuxmint.dmg ~/Desktop/linuxmint-19-cinnamon-64bit ...

  4. [Algo] 118. Array Deduplication IV

    Given an unsorted integer array, remove adjacent duplicate elements repeatedly, from left to right. ...

  5. UML-类图-如何画引用类和集合?

    1.画引用类 引用到了类时,需要画关联线,否则其他基本类型(int.string.date等)不画. 2.画集合 当然,方法1中可加入箭头.对应java代码: public class Sale { ...

  6. UML-如何画通信图?

    1.链 2.消息 3.自身传递消息 4.消息顺序编号 5.有条件消息 6.互斥的有条件消息 7.循环或迭代 8.调用静态方法 9.多态 10.同步和异步调用

  7. 实践一次有趣的sql优化

    课程表 #课程表 create table Course( c_id int PRIMARY KEY, name varchar(10) ) 增加 100 条数据 #增加课程表100条数据 DROP ...

  8. Python笔记_第一篇_面向过程第一部分_6.循环控制语句(while 和 for)_

    承接条件控制语句.条件控制语句像大树一样有很多的之差,那条路径通(也就是表达式判断为True)就会往哪一个树杈去运行,万涓溪水汇成大河.对于常用的程序结构形式,还有一种这篇文章就会讲解,那就是循环控制 ...

  9. ESLint javascript格式要求

    首行缩进2个空格 eslint: indent functionhello (name) { console.log('hi', name) } 字符串使用单引号(除了避免转义) eslint: qu ...

  10. PyTorch基础——词向量(Word Vector)技术

    一.介绍 内容 将接触现代 NLP 技术的基础:词向量技术. 第一个是构建一个简单的 N-Gram 语言模型,它可以根据 N 个历史词汇预测下一个单词,从而得到每一个单词的向量表示. 第二个将接触到现 ...