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)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • APP安全环节缺失,手游运营商怎样应对APP破解困境

    APP安全环节缺失,手游运营商怎样应对APP破解困境

    2021年11月28日
    44
  • java 滤波算法_双边滤波算法

    java 滤波算法_双边滤波算法1、原理高斯滤波是以距离为权重,设计滤波模板作为滤波系数,只考虑了像素间的空间位置上的关系,因此滤波的结果会丢失边缘的信息。高斯滤波的缺陷如下图所示:平坦区域正常滤波,图像细节没有变化,而在突变的边缘上,因为只使用了距离来确定滤波权重,导致边缘被模糊。在高斯基础上,进一步优化,叠加了像素值的考虑,因此也就引出了双边滤波,一种非线性滤波,滤波效果对保留边缘更有效。为了理解双边滤波的距离和像素差两个影…

    2022年5月29日
    32
  • 浏览器出现stack overflow at line:0,解决方法

    浏览器出现stack overflow at line:0,解决方法浏览器如果出现"stackoverflowatline:0"并且有些图片无法显示的问题,是由于注册表被串改了这是由于pngfilt.dll问题,解决方法如下把以下内容保存到记事本,随便起个名字,并且把后缀改名为.reg,双击打开这个reg文件点“是”,添加入注册表中再重启浏览器,问题就解决了WindowsRegistryEditorVersion5.00;…

    2022年7月15日
    15
  • sql语句面试经典50题_sql基础知识面试题

    sql语句面试经典50题_sql基础知识面试题目录​SQL基础知识整理:常见的SQL面试题:经典50题三、50道面试题2.汇总统计分组分析3.复杂查询sql面试题:topN问题4.多表查询【面试题类型总结】这类题目属于行列如何互换,解题思路如下:其他面试题:SQL基础知识整理:select查询结果如:[学号,平均成绩:组函数avg(成绩)]from从哪张表中查找数…

    2022年4月20日
    47
  • UAT 环境_系统uac

    UAT 环境_系统uacUserAcceptEnvironment用户仿真测试环境转载于:https://www.cnblogs.com/qinqiu/p/5981222.html

    2022年9月30日
    1
  • 转:电商推荐技术

    转:电商推荐技术

    2021年8月20日
    50

发表回复

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

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