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


相关推荐

  • phpstorm激活码-激活码分享

    (phpstorm激活码)这是一篇idea技术相关文章,由全栈君为大家提供,主要知识点是关于2021JetBrains全家桶永久激活码的内容IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.net/100143.html1M3Q9SD5XW-eyJsaWN…

    2022年3月28日
  • 你的产品在强制用户按照你的意愿去操作吗「建议收藏」

    你的产品在强制用户按照你的意愿去操作吗「建议收藏」最近小编买了一台某品牌的洗衣机,在国内挺有名的品牌,因为相信这个品牌才买的。买完之后,小编自己在家洗衣服,发现老是滴滴响,然后终止运行了,本来简单的几件衣服,洗了一下午没洗完,自己甚是苦恼。自己看了一下机器上的告警编码,又看了一下说明书,发现是由于洗衣机为了防止漏水而发生告警。主要原理是这样的:洗衣机启动运行,开始进水,如果进水超过40分钟,还没有达到设定的水位,洗衣机就停止运转了,并发出滴滴的告…

    2022年6月24日
  • quotename()函数 

    quotename()函数 请教quotename函数的理解,我已经看了很多帮助,储如以下示例 QUOTENAME(Transact-SQL)返回带有分隔符的Unicode字符串,分隔符的加入可使输入的字符串成为有效的MicrosoftSQLServer2005分隔标识符。Transact-SQL语法约定语法QUOTENAME(‘character_string'[,’q…

    2022年7月25日
  • python 矩阵转置 transpose

    python 矩阵转置 transpose*forin嵌套列表deftranspose1(matrix):cols=len(matrix[0])return[[row[i]forrowinmatrix]foriinrange(0,cols)]deftranspose2(matrix):transposed=[]foriinrange(len(ma…

    2022年6月2日
  • 罗技craft键盘使用方法_罗技g105键盘说明书

    罗技craft键盘使用方法_罗技g105键盘说明书引言:本文旨在为大家(程序员)快速入门罗技craft键盘,因为网上关于craft的测评缺乏深度,根本触及不到我的灵魂深处1.开箱咋样,是不是帅的雅痞?2.入门刚回来的几个小时,由满怀喜悦,到笑容逐渐凝固,再到内心毫无波澜,到最后奔溃后狂按键盘想退货。说起来,均是处于自己的无知。【因为此货用了京东白条六期】2.1软件下载记住了,安装完之后打开软件,千万千万别更新,别更新,别更新。——点击跳过就好了。因为有master2S,所以用的之前的安装包。官网下载是很慢的,差不多1个小时?推荐

    2022年10月15日
  • 正确lua简单的扩展,可以加速相关C++数据。

    正确lua简单的扩展,可以加速相关C++数据。

    2022年1月6日

发表回复

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

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