css滚动条属性

最新推荐文章于 2024-05-21 00:00:00 发布
最新推荐文章于 2024-05-21 00:00:00 发布
阅读量2k 收藏 2
点赞数
分类专栏： .net 开发 文章标签： css scroll c
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/liupeng826/article/details/1516201
版权
 
Overflow 属性 : 检 索或 设 置当 对 象的内容超 过 其指定高度及 宽 度 时 如何 显 示内容
overflow: auto; 在需要 时 内容会自 动 添加 滚动条
overflow: scroll; 总 是 显 示 滚动条
overflow-x: hidden; 禁止横向的 滚动条
overflow-y: scroll; 总 是 显 示 纵 向 滚动条
width: 568px; width: 98%; 设 置区域的 宽 度 [ 像素 / 百分比等等 ]
height: 120px; 设 置区域的高度[像素/百分比等等]

<STYLE>
BODY {
SCROLLBAR-FACE-COLOR: #f892cc;
SCROLLBAR-HIGHLIGHT-COLOR: #f256c6;
SCROLLBAR-SHADOW-COLOR: #fd76c2;
SCROLLBAR-3DLIGHT-COLOR: #fd76c2;
SCROLLBAR-ARROW-COLOR: #fd76c2;
SCROLLBAR-TRACK-COLOR: #fd76c2;
SCROLLBAR-DARKSHADOW-COLOR: #f629b9;
SCROLLBAR-BASE-COLOR: #e9cfe0
}
</STYLE>

SCROLLBAR-FACE-COLOR: 滚动条 凸出部分的 颜 色
SCROLLBAR-HIGHLIGHT-COLOR: 滚动条 空白部分的 颜 色
SCROLLBAR-SHADOW-COLOR: 立体 滚动条 阴 影的 颜 色
SCROLLBAR-3DLIGHT-COLOR: 滚动条 亮 边 的 颜 色
SCROLLBAR-ARROW-COLOR: 上下按 钮 上三角箭 头 的 颜 色
SCROLLBAR-TRACK-COLOR: 滚动条 的背景 颜 色
SCROLLBAR-DARKSHADOW-COLOR: 滚动条 强阴 影的 颜 色
SCROLLBAR-BASE-COLOR: 滚动条 的基本 颜 色
网 页 中去掉 滚动条 ：
去掉横向 滚动条 ： <body   style='overflow:scroll;overflow-x:hidden'>  
去掉 竖 向 滚动条 ： <body   style='overflow:scroll;overflow-y:hidden'>  
两个都去掉： <body   scroll="no">  
框加中去 滚动条 在 name="" 后面加 scrolling="No" 
 
liupeng826
关注
专栏目录
css scroll属性_CSS中的scroll-behavior属性
cumt951045的博客
07-18 7148
css scroll属性 CSS | 滚动行为属性 (CSS | scroll-behavior property) Who does not want their links to function smoothly and attractively? This type of functionality is very easy to implement. All you need is a ...
利用JS+CSS实现滚动表格数据展示
06-06
利用CSS动画制作 Html 表格数据滚动显示, 实际自己开发也不难实现。实现的方法很多，下面是本人的一种实现方案，分享给大家。
滚动条的css属性
09-21
滚动条的css属性滚动条的css属性滚动条的css属性
css控制滚动条样式
vmanas_的博客
01-14 575
1、::-webkit-scrollbar ：滚动条整体部分，其中的属性有width,height,background,border等。 2、::-webkit-scrollbar-button ：滚动条两端的按钮。可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果。 3、::-webkit-scrollbar-track ：外层轨道。可以用display:non...
CSS中滚动条的样式属性
teng_zz的博客
10-04 300
转自：https://www.w3cschool.cn/css/css-scrollbar.html
CSS 滚动条属性
shibaweijin的博客
07-13 435
/*滚动条样式*/ .scroll::-webkit-scrollbar { width: 4px; /*height: 4px;*/ } .scroll::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); background: rgba(0, 0, 0, 0.2); } .scroll::-webkit-scrollbar-track
css滚动条的属性
Abeita的博客
05-14 705
滚动条的属性 ::-webkit-scrollbar 滚动条整体部分，可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端的按钮 ::-webkit-scrollbar-track 外层轨道 ::-webkit-scrollbar-track-piece 内层滚动槽 ::-webkit-scrollbar-thumb 滚动的滑块 ::-webkit-scrollbar-corner 边角 ::-webkit-resizer 定义右下角拖动块的样式 原创点击这里 ...
div css 滚动条样式 DIV滚动条属性及样式设置方式
12-13
本文将详细介绍如何通过CSS来设置`div`标签内的滚动条属性和样式。 首先，要让`div`元素显示滚动条，我们需要设置`overflow`属性。这个属性决定了当内容溢出元素边界时的处理方式。有以下几个可选值： 1. `visible...
Html+CSS实现滚动条不挤占内容区宽度.zip
09-01
以下是一些关键的 CSS 属性，用于实现滚动条不挤占内容区宽度： 1. `overflow: auto;`: 当内容溢出容器时，显示滚动条。使用 `hidden` 可隐藏滚动条，`scroll` 则始终显示滚动条。 2. `-webkit-scrollbar`: 这个伪...
css 滚动条换色调整代码
12-10
我们将主要关注在IE浏览器下的CSS滚动条样式调整，同时也会提及Firefox浏览器的解决方案。 在IE浏览器中，我们可以利用CSS扩展属性来改变滚动条的外观。这些扩展属性包括`scrollbar-face-color`、`scrollbar-shadow...
css滚动条样式属性
panda被占用了的博客
06-22 346
::-webkit-scrollbar滚动条整体部分，可以设置宽度 ::-webkit-scrollbar-button滚动条两端的按钮 ::-webkit-scrollbar-track外层轨道 ::-webkit-scrollbar-track-piece内层滚动槽 ::-webkit-scrollbar-thumb滚动的滑块 ...
CSS overflow 属性设置滚动条
10-27 841
visible 默认值。内容不会被修剪，会呈现在元素框之外。 hidden 内容会被修剪，并且其余内容是不可见的。 scroll 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。 auto 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。 inherit 规定应该从父元素继承 overflow 属性的值。 scroll 不管内容是否...
关于Scroll的CSS属性--修改滚动条样式
qq_30258721的博客
11-16 2714
关于Scroll的CSS属性--修改滚动条样式
CSS 滚动条设置：显示方式、样式修改
最新发布
大剑师兰特的GIS世界
05-21 2708
在CSS中，你可以通过`overflow`属性来控制元素内容溢出时是否显示滚动条，以及如何显示滚动条。同时，对于Webkit内核的浏览器（如Chrome和Safari），还可以定制滚动条的样式。以下是一些关于滚动条设置的详细说明及示例代码。
滚动条的属性
weixin_30433075的博客
03-25 353
::-webkit-scrollbar //滚动条整体部分，可以修改width,height,background,border等::-webkit-scrollbar-button // 滚动条两端的按钮。可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果。::-webkit-scrollbar-track // 外层轨道。可以用display:none让其不显示...
CSS scroll-behavior:
YDOOK
08-13 341
Initial value auto Applies to scrolling boxes Inherited no Media visual Computed value as specified Animation type discrete Canonical order the unique non-ambiguo...
学会使用 CSS 自定义滚动条，能让你做的产品更有用户体验！
2401_84097883的博客
04-06 1832
拥有一个自定义的滚动条曾经是webkit的专利，所以Firefox和IE被排除在游戏之外。我们有一种新的语法，只在Firefox中使用，当它被完全支持时，将使我们的工作更容易。我们先看一下旧的Webkit语法，然后再介绍新的语法。要知道的一个重要问题是，在哪里定制滚动条。你希望样式是通用的，对网站上的所有滚动条都有效吗？还是你只想让它用于特定的部分？使用旧的语法，我们可以编写选择器，而不必将它们附加到元素上，它们将应用于所有可滚动的元素。如果你想只适用于一个特定的部分，你需要在选择器之前附加元素。
html 滚动条 scrolltop scrollheight,JavaScript之scrollTop、scrollHeight、offsetTop、offsetHeight等属性学习笔记...
weixin_42522400的博客
06-24 423
全文参考：https://github.com/iuap-design/blog/issues/38 、MDNclientHeight，只读clientHeight可以用公式 CSS height + CSS padding - 水平滚动条的高度 (如果存在) 来计算。如图，这样一个div，它的clientHeight为95，计算：50(height)+30(padding-top)+30(pad...
js - 原生的一些滚动属性和方法(scroll)
qq_43886365的博客
11-23 2563
原生的一些滚动属性和方法(scroll)
css设置滚动条属性
07-27
要设置滚动条的属性，你可以使用 CSS 的 `::-webkit-scrollbar` 伪元素来进行样式定制。下面是一些常用的属性和对应的示例代码： 1. 设置滚动条的宽度和高度： ```css ::-webkit-scrollbar { width: 10px; /* 设置宽度 */ height: 10px; /* 设置高度 */ } ``` 2. 设置滚动条的背景颜色： ```css ::-webkit-scrollbar { background-color: #f1f1f1; } ``` 3. 设置滚动条轨道的颜色： ```css ::-webkit-scrollbar-track { background-color: #f1f1f1; } ``` 4. 设置滚动条滑块的颜色： ```css ::-webkit-scrollbar-thumb { background-color: #888; } ``` 5. 设置滚动条滑块在 hover 状态时的颜色： ```css ::-webkit-scrollbar-thumb:hover { background-color: #555; } ``` 6. 设置滚动条边框的颜色： ```css ::-webkit-scrollbar { border-color: #aaa; } ``` 这些只是一些常见的属性，你可以根据自己的需求进行定制。请注意，上述代码中的 `::-webkit-scrollbar` 是针对 Chrome 和 Safari 浏览器的样式定制，其他浏览器可能需要使用不同的前缀。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值