找回密码
 立即注册

QQ登录

只需一步,快速开始

aatest

高级会员

128

主题

461

帖子

1375

积分

高级会员

积分
1375
aatest
高级会员   /  发表于:2021-7-22 22:43  /   查看:2551  /  回复:7
本帖最后由 Chelsey.Wang 于 2021-7-26 16:59 编辑

选项卡  滚动条能否也 弄成跟 表格一样 支持 细条形状,更美观

7 个回复

倒序浏览
Chelsey.Wang讲师达人认证 悬赏达人认证 活字格认证
论坛元老   /  发表于:2021-7-23 16:36:50
沙发
已记录,感谢您的建议~
不过选项卡中滚动条的样式也可以通过CSS来修改

代码:
  1. .tab-content > ::-webkit-scrollbar {
  2.   width: .5rem;
  3.   height: .5rem;
  4.   background: hsla(0, 0%, 100%, 0.6);
  5. }

  6. .tab-content > ::-webkit-scrollbar-track {
  7.   border-radius: 0;
  8. }

  9. .tab-content > ::-webkit-scrollbar-thumb {
  10.   border-radius: 0;
  11.   background-color: rgba(95,95,95,.4);
  12.   transition: all .2s;
  13.   border-radius: .5rem;
  14. }

  15. .tab-content >::-webkit-scrollbar-thumb:hover  {
  16.     background-color: rgba(95,95,95, .7);
  17. }
复制代码


网上还有很多各种滚动条样式的分享,这里用到的CSS参考的是这篇文章:
纯css修改浏览器scrollbar滚动条样式 - SegmentFault 思否







本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复 使用道具 举报
aatest
高级会员   /  发表于:2021-7-31 08:34:42
板凳
Chelsey.Wang 发表于 2021-7-23 16:36
已记录,感谢您的建议~
不过选项卡中滚动条的样式也可以通过CSS来修改

页面容器呢···页面容器css该如何写呢
回复 使用道具 举报
Chelsey.Wang讲师达人认证 悬赏达人认证 活字格认证
论坛元老   /  发表于:2021-8-2 10:09:45
地板
aatest 发表于 2021-7-31 08:34
页面容器呢···页面容器css该如何写呢

和选项卡的思路类似,也可以通过CSS修改页面容器中scrollbar的对应属性。
不过这就是另外一个问题了,您可以重新发一个帖子提问哈~我们尽量保证一个帖子解决一个问题,这样再次遇到相同问题,大家就可以通过帖子题目的关键词进行检索啦。
感谢您的理解与支持~
回复 使用道具 举报
aatest
高级会员   /  发表于:2021-8-2 11:31:59
5#
Chelsey.Wang 发表于 2021-8-2 10:09
和选项卡的思路类似,也可以通过CSS修改页面容器中scrollbar的对应属性。
不过这就是另外一个问题了,您 ...

能写下css吗,自己搞了半天也没搞出来···
回复 使用道具 举报
Timothy.Xu讲师达人认证 悬赏达人认证 活字格认证
论坛元老   /  发表于:2021-8-2 11:55:49
6#
aatest 发表于 2021-8-2 11:31
能写下css吗,自己搞了半天也没搞出来···

不知道您有没有新发一个帖子呢?这边看到和您问题相同的帖子了,您可以参考一下哈:
页面容器滚动条能否也弄成细条形状?
https://gcdn.grapecity.com.cn/fo ... 3&fromuid=59908
(出处: 葡萄城产品技术社区)
回复 使用道具 举报
追风
注册会员   /  发表于:2023-11-10 15:51:59
7#
css调整选项卡样式
回复 使用道具 举报
Shawn.Liu活字格认证
超级版主   /  发表于:2023-11-10 16:56:50
8#
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 立即注册
返回顶部