DIV滚动条显示

DIV滚动条显示DIV滚动条所谓DIV滚动条,就是利用DIV标签,在里面嵌入CSS样式表,加入overflow的属性值,这样,当div所规范的区域内的内容达到一定程序时,滚动条就派上用场1、滚动条常用属性:overflow:auto为自动,scroll为出现滚动条overflow-x:横向滚动条overflow-y:纵向滚动条代码样例:  这里是你要显示的内容,只有需要时才出现滚动条。  这里是你要显示的内容,无论是否需要都出现滚动条。

大家好,又见面了,我是你们的朋友全栈君。

DIV滚动条

 

 

所谓DIV滚动条,就是利用DIV标签,在里面嵌入CSS样式表,加入overflow的属性值,这样,当div所规范的区域内的内容达到一定程序时,滚动条就派上用场

1、滚动条常用属性:
overflow:auto为自动,scroll为出现滚动条
overflow-x:横向滚动条
overflow-y:纵向滚动条

代码样例:

  
  
  
< div style ="width:260px;height:120px; overflow:auto; border:1px solid;" >
  这里是你要显示的内容,只有需要时才出现滚动条。
</ div >
< div style ="width:260px;height:120px; overflow:scroll; border:1px solid;" >
  这里是你要显示的内容,无论是否需要都出现滚动条。
</ div >
< div style ="width:260px;height:120px; overflow-y:scroll; border:1px solid;" >
  这里是你要显示的内容,只出现Y-纵向滚动条。
</ div >
< div style ="width:260px;height:120px; overflow-x:scroll; border:1px solid;" >
  这里是你要显示的内容,只出现X-横向滚动条。
</ div >

 
2、滚动条相关颜色属性:
scrollbar-face-color:滚动条滑块部分的颜色
scrollbar-highlight-color:滚动条空白部分的颜色
scrollbar-shadow-color:滚动条阴影的颜色
scrollbar-arrow-color:上下按钮三角箭头的颜色
scrollbar-base-color:滚动条的基本颜色
scrollbar-darkshadow-color:滚动条强阴影的颜色
scrollbar-track-color:滚动条滑道颜色

代码样例:

  
  
  
span style="color: #0000ff;">< div style ="overflow:scroll;width:260px;height:120px;
  scrollbar-face-color:#ffffff;
  scrollbar-highlight-color:#ffffff;
  scrollbar-shadow-color:#919192;
  scrollbar-arrow-color:#919192;
  scrollbar-base-color:#900000;
  scrollbar-darkshadow-color:#ffffff;
  scrollbar-track-color:#ffffff;"
>
  这里是你要显示的内容。设置滚动条颜色。
</ div >
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/158621.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • Postman使用入门

    Postman使用入门

    2021年9月18日
    37
  • 一线工程师告诉你嵌入式真实现状与发展前景「建议收藏」

    个人说明:本人并不是年薪百万的技术大牛,但总算是一名合格的嵌入式工程师,现在某企业担任嵌入式软件工程师开发一职,以下观点可能会带有片面或者分析不全,但却是一名一线企业嵌入式软件开发者真实感受和所得,希望能帮助那些有需要的人,我明白年轻人出来打拼都不容易。为何要写这片文章?小生也是过来人,踩过你们踩过的坑百度搜索“嵌入式”、“嵌入式开发”、“嵌入式发展前景”等字眼,出来的都是一大堆培训机构,…

    2022年4月4日
    71
  • python画qq图_python绘制散点图

    python画qq图_python绘制散点图qq图有两个作用:1、检验一组数据是否服从某一分布。2、检验两个分布是否服从同一分布。qq图全称是quantile-quantileplot,从名称中可以了解到是和分位数相关的图。由于最近在做数据分析时用到了,然而看了一些博客,要么是qq图讲解的比较详尽但是没有使用Python;要么是使用Python语言但是没有讲清楚原理。基于此,想写一篇博客尽量讲清楚原理并且用Python实现出来。qq图原理…

    2022年8月10日
    28
  • SQL Server 下载安装教程

    SQL Server 下载安装教程SQLServer2017下载安装教程第一步:打开浏览器,在浏览的搜索框中我们输入“SQLServer”。如图,会匹配出中文两条微软官方下载页面(一个页面内容是英文、一个页面内容是中文)。这里我们以中文的为例。第二步:点击进入下载页面后,可以看到如图所示页面,我们不要着急点击下载,因为这些SQLServer只能试用180天(大家从介绍中可以看到)。第三步:我们将网页下滑,可以看到…

    2022年4月29日
    54
  • Android适配器作用

    Android适配器作用AndroidAdapter适配器Adapter的作用就是ListView界面与数据之间的桥梁,当列表里的每一项显示到页面时,都会调用Adapter的getView方法返回一个View。Android中有很多的适配器,首先看看这些适配器的继承结构Data、Adapter、View三者的关系  Data、Adapter、View三者的关系一个li

    2022年4月28日
    44
  • Py2exe_py import

    Py2exe_py import转载自:http://www.cnblogs.com/jans2002/archive/2006/09/30/519393.html一、简介py2exe是一个将python脚本转换成windows上的可独立执行的可执行程序(*.exe)的工具,这样,你就可以不用装python而在windows系统上运行这个可执行程序。py2exe已经被用于创建wxPython,Tkin

    2022年9月10日
    3

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号