今天做了个样例:

div 的滚动栏问题:

两种方法:

一、

<div style=" overflow:scroll; width:400px; height:400px;”></div>

记住宽和高一定要设置噢,否则不成的

只是在不超出时,会有以下的滚动栏,所以不是最好的选择

二、

<div style=" overflow-y:auto; overflow-x:auto; width:400px; height:400px;”></div>

记住宽和高一定要设置噢,否则不成的

这样比較好的是,在宽和高不超出时,仅仅是一条线

三、说明

直接为div指定overflow属性为auto就可以,可是必须指定div的高度,例如以下:

<div style="position:absolute; height:400px; overflow:auto">

</div>

假设要出现水平滚动栏,则: overflow-x:auto

同理,垂直滚动栏为: overflow-y:auto

假设该div被包括在其它对象比如td中,则位置可设为相对:position:relative

div:给div加滚动栏 div的滚动栏设置的更多相关文章

  1. JavaScript实现页面滚动到div区域div以动画方式出现

    用JavaScript实现页面滚动效果,以及用wow.js二种方式实现网页滚动效果 要实现效果是页面滚动到一块区域,该区域以动画方式出现. 这个效果需要二点: 一:我们要先写好一个css动画. 二:用 ...

  2. html小知识点汇总(浏览器导航上显示图标、div无高度时试着清除浮动、文字环绕图片、字体加粗、div按百分比分、已有的不合适的class,针对特定的标签进行修改)

    1.新点击的网页,在浏览器导航上显示图标: 像这种效果: <head> <meta charset="UTF-8"> <meta name=" ...

  3. 禁止body滚动允许div滚动防微信露底

    最近遇到一个需求,页面中只有一个div允许滚动,其他内容不允许滚动. 正常来讲加上 body{height:100%;overflow: hidden;} 应该就阻止页面滚动了.可是很悲催的是手机端并 ...

  4. ios 下防止整个网页滑动(阻尼回弹 . 瞒天过海,骗IOS,把阻尼回弹限制在滚动区div内

    下面是一个手机APP页面,分成上中下三部分,最上面和最下面是固定的,中间可以滚动.这是常见的APP布局方式. <style> .box{ overflow: auto; -webkit-o ...

  5. 天猫首页迷思之-jquery实现整个div的懒加载(1)

    懒加载是众所周知的减少网页负载,提高性能的方法,不少大型用图片用的多的网站都用到了. 于是我网上一搜,得到一插件:jquery.lazyload    网址:http://www.appelsiini ...

  6. div 加滚动条 超过div宽度 自动换行 div居中

    一.div 中加滚动条 一. <div style=" overflow:scroll; width:400px; height:400px;”></div> 记住宽 ...

  7. jquery +点击按钮,切换div内容,按钮加高亮

    html: <div class="dw4"> <span class="dw">单位(次)</span> <div ...

  8. 转: div:给div加滚动条 div的滚动条设置

    div 的滚动条问题: 两种方法: 一. <div style=" overflow:scroll; width:400px; height:400px;”></div&g ...

  9. div样式position:fixed,不随屏幕滚动而滚动,导致屏幕太小时弹出层被遮挡,无法滚动查看的解决办法

    window.onscroll = function () { var sl = -Math.max(document.body.scrollTop, document.documentElement ...

  10. DIV重叠 如何优先显示(div浮在重叠的div上面)

    如果有2个div有重叠,默认是根据html解析顺序,最后加载的优先级最高(浮在最上面). 问题: 如果想把前面加载的div显示在最上面?关键字:z-index 举例: --原来的页面:first di ...

随机推荐

  1. protel dxp快捷键大全

    enter——选取或启动 esc——放弃或取消f1——启动在线帮助窗口tab——启动浮动图件的属性窗口pgup——放大窗口显示比例pgdn——缩小窗口显示比例end——刷新屏幕del——删除点取的元件 ...

  2. VMware与宿敌Amazon一笑泯恩仇:重新定义混合云?(私有云节节败退)

    摘要: 私有云巨头VMware看来是真的要输给一个“书贩子” 了!这意味着私有云将败给公有云? [阅读原文] 三年前,虚拟化巨头VMware曾对亚马逊Amazon云服务AWS竖过中指:我们怎么可能打不 ...

  3. leetcode面试准备:Implement Trie (Prefix Tree)

    leetcode面试准备:Implement Trie (Prefix Tree) 1 题目 Implement a trie withinsert, search, and startsWith m ...

  4. Form – 保存自動關閉當前窗口

    FAQ: 在BUTTON的触发器中,写如下代码, commit_form; go_bloack('你想显示的那个window的block'); --或者写 show_view('你要显示的canvas ...

  5. bzoj3262

    三维裸的做法是一维排序,剩下树套树,可我好像还没写过树套树先说cdq分治吧,先对一维排序,相当于原来修改询问里的时间线在这上面分治.划分,计算前半部分对后半部分的影响,显然可以按第二维的顺序维护树状数 ...

  6. 转自 void- man 差分约束系统详解

    一直不知道差分约束是什么类型题目,最近在写最短路问题就顺带看了下,原来就是给出一些形如x-y<=b不等式的约束,问你是否满足有解的问题 好神奇的是这类问题竟然可以转换成图论里的最短路径问题,下面 ...

  7. 小图用 imageNamed: 大图用 dataWithContentsOfFile:options

    1down voteaccepted If you're loading images like:[UIImage imageNamed:@"myImage.png"];Then ...

  8. Android 实用代码七段(二)

    声明 欢迎转载,但请保留文章原始出处:)  博客园:http://www.cnblogs.com 农民伯伯: http://over140.cnblogs.com 正文 一.获取应用程序下所有Acti ...

  9. HDU4725 The Shortest Path in Nya Graph dij

    分析:对于每一层,原来n个点,然后扩展为原来的三倍,每一层扩展一个入点,一个出点,然后跑最短路 注:tmd我把一个n写成m了,然后wa了7次,我都要怀疑人生了 #include<cstdio&g ...

  10. lightoj 1004

    很水的一个dp #include<cstdio> #include<iostream> #include<cstring> #include<algorith ...