overflow属性的应用
在使用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属性的应用的更多相关文章
- CSS中的overflow属性
导读:overflow属性一般用来隐藏超过div范围的元素,包括不隐藏(visible),直接隐藏(hidden),用滚动条隐藏(scroll),自动(aotu)这四个属性.当然overflow的用法 ...
- overflow属性
css属性overflow属性定义溢出元素内容区的内容会如何处理.如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制. 参数是scroll时候,必会出现滚动条. 参数是auto时候,子 ...
- CSS overflow 属性
值 描述 visible 默认值.内容不会被修剪,会呈现在元素框之外. hidden 内容会被修剪,并且其余内容是不可见的. scroll 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容. ...
- 转:CSS Overflow 属性
原文:CSS Overflow 属性译自:The CSS Overflow Property版权所有,转载请注明出处,多谢!! 根据CSS的盒模型概念,页面中的每个元素,都是一个矩形的盒子.这些盒子的 ...
- overflow属性及其在ios下卡顿问题解决
overflow属性:http://www.w3school.com.cn/cssref/pr_pos_overflow.asp overflow:scroll/auto;在手机页面滑动不流畅问题: ...
- CSS3对于盒中容纳不下的内容的显示——overflow属性
overflow属性 1.如果将overflow属性值设定为hidden,则超出容纳范围的文字将被隐藏起来. div{ overflow:hidden; } 2.如果将overflow属性值设定为sc ...
- 【CSS学习】--- overflow属性
一.前言 在网页布局中,未处理的溢出元素绝对算得上是个“毒瘤”.因为如果一个“盒子”周围还有其它元素,而从这个盒子中溢出的元素会和盒子周围的元素发生层叠,并脱离了整个HTML元素,所以我们应当合理使用 ...
- 字体图标,盒子显隐,overflow属性,伪类设计边框,盒子阴影2d形变
字体图标 ''' fa框架: http://fontawesome.dashgame.com/ 下载 => 引入css文件 引入字体图标库 <link rel="styleshe ...
- div包裹页面后多余部分没有显示,也没滚动条 overflow 属性设置
今天弄个div套着一个页面结果那个页面超出范围后页面没有滚动条可以滚动浏览下面的内容,原来是设置了overflow的hidden属性 visible 默认值.内容不会被修剪,会呈现在元素框之外. hi ...
- overflow属性-摘自网友
关于我们 版权声明 网站地图 前端观察 专注于网站前端设计与前端开发 用IE6抢不到火车票的!!! Home 首页 CSS样式之美 Front News前端资讯 JavascriptAjax与JS技术 ...
随机推荐
- JS用例
showBtn :class="{getInput:showBtn}"v-if="showBtn" showBtn: true, this.showBtn = ...
- 配置window下python3环境
功能介绍 整理生信小知识库,一些技巧一些知识. 昨天 以下配置环境基于window操作系统,安装python3版本为例,推荐基础版配置. ! METHOD 1 (基础版) 官网下载对应电脑版本的p ...
- Spring Cloud Alibaba 教程 | Nacos(三)
使用Nacos作为配置中心 前面我们已经介绍过滤Nacos是一个更易于构建云原生应用的动态服务发现.配置管理和服务管理平台.所以它可以作为注册中心和配置中心,作为注册中心Nacos可以让我们灵活配置多 ...
- delphi实现FTP上传与下载
unit Unit1; interface uses Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms ...
- Java中static变量作用和用法详解
static表示"全局"或者"静态"的意思,用来修饰成员变量和成员方法,也可以形成静态static代码块,但是Java语言中没有全局变量的概念. 被static ...
- 【MySQL参数】-innodb_buffer_pool_chunk_size
如果 初始化缓冲池时 innodb_buffer_pool_chunk_size* innodb_buffer_pool_instances大于当前缓冲池大小, innodb_buffer_pool_ ...
- 刘永富的Office/VBA/VSTO开发资源分享
各种常用安装包下载:https://share.weiyun.com/5PCvqY4 简称 文件名称 描述信息 视频课程 虚拟光驱软件Daemon DAEMON_Tools_Lite_V10.1.0. ...
- Vue 项目中应用
Vue使用 一.vue生命周期 # main.js import Vue from 'vue' import App from './App.vue' import router from './ro ...
- JSONP 跨域问题
JSONP跨域请求 什么是跨域: 1.域名不同 2.域名相同端口不同 js出于对安全考虑不支持跨域请求.我们可以使用JSONP解决跨域问题. 一.JSONP是什么 JSONP(JSON with ...
- F - Fraction Formula Gym - 102307F
Mr. Potato Head has been promoted and now is a math professor at the UNAL. For his first course he i ...