一、

<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内容超出后自动显示滚动条的更多相关文章

  1. css设置内容超出后显示省略号

    1.使用overflow: hidden把超出的内容进行隐藏: 2.然后使用white-space: nowrap设置内容不换行: 3.最后使用text-overflow: ellipsis设置超出内 ...

  2. DIV内容超出长度显示省略号,鼠标移上自动显示全部内容(EasyUI DataGrid)

    如果想把DIV中超出的文本显示成省略号,而不是换行全部显示,有2个办法. 注:本文主要是以EasyUI的DataGrid为案例的,如果是其他场景只要底层是用DIV显示文本的应该都能使用. 首先可以给此 ...

  3. html页面内容超出后显示水平滚动条的问题

    这个问题已经遇到好几次,解决起来也熟练了很多.   出现这种问题一般都是html或页面中的某一内部元素宽度超了. 下面总结我遇到的几种情况: 1.某一内部元素width设为100%,然而它还有bord ...

  4. Axure RP 8 实现 圆角文本框 圆角带筛选的下拉列表框 可自动显示滚动条

    刚开始用Axure 会发现 Axure 元件库并不是很齐全,很多元件需要自己想办法解决 或者去网上去找.其实个人建议网上有现成的元件可以就下载就不必花时间去折腾.除非你也想练练手,原型这种东西除非高保 ...

  5. DIV内容超出固定宽度部分用省略号代替

    方法一:CSS控制溢出文本  只针对DIV单行数据展示 /** DIV文本超出宽度部分用...替换,鼠标移上显示全部 **/ .textAuto{overflow:hidden;text-overfl ...

  6. 让一个Activity在开机后自动显示

    Activity本身不会在手机开机后自动运行的.但想让手机开机后就立刻做一些动作,需要使用广播接收器拦截手机开启广播,并在onReceive方法中完成相应的动作,如打开一个Activity. 广播接收 ...

  7. bootstrap-table 内容超出鼠标悬浮显示全部

    .table th, .table td { text-align: center; vertical-align: middle !important; } table { width: 100px ...

  8. css 内容溢出显示垂直滚动条,内容不超出就不显示滚动条

    搬运自:https://www.cnblogs.com/wangyuanyuanlovexuanxuan/p/7767767.html html: <style> .div1{ width ...

  9. JAVA Eclipse开发Android如何让超出界面的部分自动显示滚动条

    在原有布局的最外围添加一层ScrollView,注意原有布局的声明也要删了 <ScrollView xmlns:android="http://schemas.android.com/ ...

随机推荐

  1. 消息队列第二篇:MessageQueue实战(课程订单)

    上一篇:消息队列介绍 本篇一开始就上代码,主要演练MessageQueue的实际应用.用户提交订单(消息发送),系统将订单发送到订单队列(Order Queue)中:订单管理系统(消息接收)端,监听消 ...

  2. HTML与URL两种录制模式分析(转)

    如何选择两种模式? 1.基于浏览器的应用程序推荐使用HTML-Based Script. 2.不是基于浏览器的应用程序推荐使用URL-Based Script. 3.如果基于浏览器的应用程序中包含了J ...

  3. js中的extend,可实现浅拷贝深拷贝

    js中的extend   1.    JS中substring与substr的区别 之前在项目中用到substring方法,因为C#中也有字符串的截取方法Substring方法,当时也没有多想就误以为 ...

  4. markdown语法---根据使用不断扩充中

    markdown语法 标题 标题使用 #表示,几个#表示几级标题,最多六级标题. 斜体 使用 两个星号*括起来的文字是斜体字 这是斜体字 粗体 使用四个 * 号括起来的是粗体字. 这是粗体字 引用 这 ...

  5. golang build 的简单用法.(菜鸟初学)

    1. golang 里面的 go build 可以编译代码. go build helloworld.go 2. 这里面有一个注意事项事项. 如果引用非go语言的 内置package的话 需要在环境变 ...

  6. Kafka日志存储原理

    引言 Kafka中的Message是以topic为基本单位组织的,不同的topic之间是相互独立的.每个topic又可以分成几个不同的partition(每个topic有几个partition是在创建 ...

  7. 字符串(string)与整型(int)、浮点型(float)等之间的转换

    #include <stdlib.h> 1.int/float to string/array: C语言提供了几个标准库函数,可以将任意类型(整型.长整型.浮点型等)的数字转换为字符串,下 ...

  8. 【题解】JSOI2015染色问题

    好像这个容斥还是明显的.一共有三个要求,可以用组合数先满足一个,再用容斥解决剩下的两个维.(反正这题数据范围这么小,随便乱搞都可以).用 \(a[k][i]\) 表示使用 \(k\) 种颜色,至少有 ...

  9. NEERC 15 (10/12)

    NEERC=Not Easy European Regional Contest 据说NEERC天天被搬,赶紧做了好了.在Claris和Google的帮助下做了10题,感谢cls. http://co ...

  10. 记一个鼠标略过时候的css动画

    .circle{ width: 15px; height: 15px; background: rgba(0,0,0,0.7); border-radius: 50%; display: table- ...