水平滚动条和垂直滚动条设置

最新推荐文章于 2023-02-25 10:31:59 发布
最新推荐文章于 2023-02-25 10:31:59 发布
阅读量5.8k 收藏 4
点赞数 1
分类专栏： css 文章标签： overflow

1．overflow内容溢出时的设置（设定被设定对象是否显示滚动条）
overflow-x水平方向内容溢出时的设置
overflow-y垂直方向内容溢出时的设置
以上三个属性设置的值为visible(默认值)、scroll、hidden、auto。

2．scrollbar-3d-light-color立体滚动条亮边的颜色（设置滚动条的颜色）
scrollbar-arrow-color上下按钮上三角箭头的颜色
scrollbar-base-color滚动条的基本颜色
scrollbar-dark-shadow-color立体滚动条强阴影的颜色
scrollbar-face-color立体滚动条凸出部分的颜色
scrollbar-highlight-color滚动条空白部分的颜色
scrollbar-shadow-color立体滚动条阴影的颜色

我们通过几个实例来讲解上述的样式属性：
1.让浏览器窗口永远都不出现滚动条
没有水平滚动条

<body   style="overflow-x:hidden">

没有垂直滚动条

<body   style="overflow-y:hidden">

没有滚动条

<body   style="overflow-x:hidden;overflow-y:hidden">或<body style="overflow:hidden">

2.设定多行文本框的滚动条

没有水平滚动条

<textarea   style="overflow-x:hidden"></textarea>

没有垂直滚动条

<textarea   style="overflow-y:hidden"></textarea>

没有滚动条

<textarea   style="overflow-x:hidden;overflow-y:hidden"></textarea>   
或<textarea   style="overflow:hidden"></textarea>

3.设定窗口滚动条的颜色
设置窗口滚动条的颜色为红色
scrollbar-base-color设定的是基本色，一般情况下只需要设置这一个属性就可以达到改变滚动条颜色的目的。
加上一点特别的效果：

<body   style="scrollbar-arrow-color:yellow;scrollbar-base-color:lightsalmon">

4.在样式表文件中定义好一个类，调用样式表。

<style>   
.coolscrollbar{scrollbar-arrow-color:yellow;scrollbar-base-color:lightsalmon;}   
</style>

这样调用：

<textarea   class="coolscrollbar"></textarea>
喜大普奔⁶⁶⁶
关注
  • 1
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
如何设置ListView的列宽不出现水平滚动条博客内容的项目例子
03-26
开发WTL/Win32的程序时，经常会用到表格控件CListViewCtrl。这个控件需要设置列的宽度，当用完100%的宽度来平均分配给列宽时，一加载数据多，就会出现垂直滚动条后，水平滚动条也会同时出现的问题。怎么设置才能让水平滚动条不出现? 所属项目: https://blog.csdn.net/infoworld/article/details/137053414
Android实现Activity水平和垂直滚动条的方法
09-02
主要介绍了Android实现Activity水平和垂直滚动条的方法,涉及Activity的ScrollView设置相关技巧,需要的朋友可以参考下
滚动的简析
eihhhha的博客
08-30 487
简单的一些滚动的属性的使用方法
表格超出水平方向出现滚动条，可以滑动
qq_42430038的博客
11-05 442
表格超出水平方向出现滚动条，可以滑动
关于window.scroll系列方法汇总 & 滚动到指定元素位置
锋利的绵羊的博客
08-20 1万+
1.window.scroll() 概述 滚动窗口至文档中的特定位置。 语法 window.scroll(x-coord, y-coord) // 参数表示想要置于左上角的像素点的横纵坐标 2.window.scrollBy() 概述 在窗口中按指定的偏移量滚动文档(相对于当前位置进行偏移) 语法 window.scrollBy(x-coord, y-coord); ...
window.scroll()、window.scrollTo()、window.scrollBy()、写一个小说的自动阅读功能
JEFF_xieyuzhi的博客
09-27 2152
让滚动条滚动 window.scroll(X,Y)：X代表着X轴滚动多少px，Y代表着Y轴滚动多少，px假如是Y方向滚动100px，window.scroll(0,100)。这个window.scrollTo()方法和 window.scroll()方法一样的。 window.scrollBy(X,Y)方法,这个scrollBy()方法和上面的这两个方法的不同之处在于...
浏览器滚动条的参数总结
madein82的专栏
10-23 1010
 简单地介绍一下涉及浏览器滚动条的样式表内容（某些样式需ie5.5+才能支持）： 1．overflow内容溢出时的设置（设定被设定对象是否显示滚动条）overflow-x水平方向内容溢出时的设置overflow-y垂直方向内容溢出时的设置以上三个属性设置的值为visible(默认值)、scroll、hidden、auto。2．scrollbar-3d-light-color立体滚动条亮边的
返回頂部API Window.scroll()
wk的博客
03-27 565
Window.scroll() 语法 window.scrollTo(x-coord,y-coord ) 1、x-coord 是文档中的横轴坐标。 2、y-coord 是文档中的纵轴坐标 window.scrollTo(options) options 是一个包含三个属性的对象: 1、top：指定沿 Y 轴滚动窗口或元素的像素数。 2、left：指定沿 X 轴滚动窗口或元素的像素数。 3、behavior ：类型String,表示滚动行为, behavior 支持参数： smooth(...
Python tkinter -- 第11章滚动条
weixin_42272768的博客
07-01 1万+
第11章滚动条 滚动条的作用就是可以让与之关联的控件的内容滚动显示。
visual c++自定义滚动条外观 制作五颜六色的滚动条(水平滚动条,垂直滚动条).zip
01-28
vc自定义滚动条外观 制作五颜六色的滚动条(水平滚动条,垂直滚动条).zip
水平滚动条和垂直滚动条的自绘优化
03-28
自己写的自绘制水平滚动条和垂直滚动条类、调用可轻松实现滚动条的优化、以及坐标显示、非常适合项目
通知公告滚动效果（兼容IE8）
zzhqun的专栏
07-06 186
可以参考该博文https://blog.csdn.net/Star_Chan/article/details/51456548 但是有一个小错误 if(!($(this).is(":animated"))) { //判断是否有一个动画节点 需要去掉！，改为如下，亲测可用 if(($(this).is(":animated"))) { //判断是否有一个动画节点 ...
IE兼容滚动效果
百事可乐
01-29 386
var speed=30demo2.innerHTML=demo1.innerHTMLfunction Marquee(){if(demo2.offsetWidth-demo.scrollLeftdemo.scrollLeft-=demo1.offsetWidthelse{demo.scrollLeft++}}var MyMar=setInterval(Marquee,speed)demo.onm
关于IE下滚动条的问题
seraph的专栏
01-14 5848
如何让IE下的滚动条在内容少的时候隐藏得更彻底呢？滚动条的出现使固定的有限空间能够展示更多的内容。但是当展示内容很少的时候，滚动条还需要吗？这个情况下,Firefox会将滚动条隐藏得很彻底，但是，IE做不到这样，还留有滚动条的灰色痕迹。对比图如下：Firefox 3.0.1:IE7为例，IE6是同样的状况：解决这个问题，采用的方法不妥，将使这个窗口始终没有滚动条，多出的内容会被隐藏，看
JAVASCRIPT应用篇（5）－－设置TEXTAREA的MAXLENGTH属性
仰望者！
02-25 8992
标准的DHTML文档中TEXTAREA的MAXLENGTH属性默认情况下不起作用，只有当事件发生时才起作用如下：http://spiderscript.net/site/spiderscript/examples/ex_textarea_maxlength.asp但TEXT中有且起作用， 那么在TEXTAREA中怎么实现输入内容不能超过多少个字符呢。方法1、如果只需要截取多少个
window.scrollTo控制滚动条平滑的滚动到某个位置
qq_38985463的博客
01-22 7230
语法一：window.scrollTop(x,y) //x横坐标 y纵坐标 例：window.scrollTop(0，1000) 语法二：window.scrollTop(options) window.scrollTo({ top:560, left:0, behavior: "smooth" }); // top:纵坐标 left:横坐标 behavior 类型String,表示滚动行为,支持参数 sm..
IE浏览器中自定义滚动条
iteye_7055的博客
11-26 159
1、在窗口最大化时让IE滚动条消失！   &lt;body scroll=no style="overflow-x:hidden" &gt; 2、制作好看的滚动条：19个带示例的jQuery滚动条插件
window.scroll 浏览器滚动条的参数总结.......... [转]
热门推荐
水上漂的专栏
01-13 1万+
网页代码常用小技巧总结     02-06PORTFOLIO COLLECTIONfunction openWin(str, w, h) {  window.open(str,sixWindow,toolbar=no,location=no,directories=no,status=no,menub ar=no,scrollbar=no,resizable=no,copyh
textarea滚动条CSS样式属性设置
gla2018的博客
02-25 3721
textarea>滚动条属性CSS样式设置，包括textarea溢出横竖滚动条设置、隐藏滚动条、滚动条颜色、水平滚动条、垂直滚动条设置等。以上三个CSS样式属性可以设置的值为：visible(默认值)、scroll（显示）、hidden（隐藏）、auto（自动）。overflow内容溢出时的设置（设定被设定对象是否显示滚动条）举例：滚动条在y下显示（垂直显示滚动条），行数10行，列数30列。overflow-y垂直方向内容溢出时的设置。textarea滚动条CSS样式。隐藏textarea滚动条设置。
Python ScrolledText 同时添加垂直和水平滚动条
最新发布
05-25
可以使用`tkinter`中的`ScrolledText`类来实现同时添加垂直和水平滚动条。 首先，需要导入`tkinter`和`ScrolledText`模块： ```python import tkinter as tk from tkinter.scrolledtext import ScrolledText ``` ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值