首页 > 其他分享 >滚动条自定义样式

滚动条自定义样式

时间:2023-12-04 13:55:54浏览次数:43  
标签:自定义 样式 button 滚动条 箭头 scrollbar background webkit horizontal

        .ant-table-content {
            &::-webkit-scrollbar {
                height: 10px !important;
            }

            &::-webkit-scrollbar-thumb {
                border-radius: 0 !important;
            }

            &::-webkit-scrollbar-button {
                display: block;
                background-size: 4px;
                background-repeat: no-repeat;
            }

            /* left */
            &::-webkit-scrollbar-button:horizontal:start:decrement {
                height: 10px;
                width: 15px;
                background-position: center;
                background-image: url('左侧箭头图片地址');
            }

            // 设置“减少滚动值”的箭头仅在左侧展示
            &::-webkit-scrollbar-button:horizontal:end:decrement {
                display: none;
            }

            // 设置“增加滚动值”的箭头仅在右侧展示
            &::-webkit-scrollbar-button:horizontal:start:increment {
                display: none;
            }

            /* Right */
            &::-webkit-scrollbar-button:horizontal:end:increment {
                height: 10px;
                width: 15px;
                background-position: center;
                background-image: url('右侧箭头图片地址');
            }
        }

标签:自定义,样式,button,滚动条,箭头,scrollbar,background,webkit,horizontal
From: https://www.cnblogs.com/flying-script/p/17874762.html

相关文章

  • php8自定义扩展
    1:进入php源码目录下的ext.如/usr/local/php-8/ext2.生成自定义扩展的名字phpext_skel.php--extpython3.撰写函数原型,编辑python.stub.php3.1默认是test1,test2<?php/**@generate-function-entries*/functionall(array$arr):bool{}function......
  • Spring实践之自定义命名空间并解析
    自定义一个命名空间1、新建一个空项目,在resources/META-INF目录下新建一个spring.handlers文件,内容如下:http\://open.harvey.com/schema/dog=com.harvey.open.annotation.spring.DogNamespaceHandler文件内容为一个键值对。key为自定义命名空间:http://open.harvey.com/sc......
  • 自定义精美商品分类列表组件 侧边栏商品分类组件 category组件(适配vue3)
    随着技术的发展,开发的复杂度也越来越高,传统开发方式将一个系统做成了整块应用,经常出现的情况就是一个小小的改动或者一个小功能的增加可能会引起整体逻辑的修改,造成牵一发而动全身。通过组件化开发,可以有效实现单独开发,单独维护,而且他们之间可以随意的进行组合。大大提升开发效率......
  • 【C语言】自定义类型:联合和枚举
    1、联合体1.1、联合体类型的声明像结构体⼀样,联合体也是由⼀个或者多个成员构成,这些成员可以不同的类型。但是编译器只为最大的成员分配足够的内存空间。联合体的特点是所有成员共⽤同⼀块内存空间。所以联合体也叫:共用体。给联合体其中⼀个成员赋值,其他成员的值也跟着变化。#inclu......
  • 【C语言】自定义类型:结构体
    1、结构体类型的声明1.1、结构体的概念结构是⼀些值的集合,这些值称为成员变量。结构的每个成员可以是不同类型的变量。1.2、结构的声明structtag{member-list;}variable-list;在一般情况下,tag、member-list、variable-list这3部分至少要出现2个。以下为实例://此声明......
  • streamlit 展示自定义 html 以及 css
    目前探索出来的有效方法:style="""<style>.memo-box{border:1pxsolid#ccc;padding:10px;margin-bottom:20px;}.tag{font-size:12px;color:#88......
  • 极语言3-7滚动信息类、滚动条类、消息类、消息框类——成员表
    中文名字英文名称长度作用解释滚动信息类SCROLLINFO28用来储存滚动条信息滚动信息类——成员表长度cbSize整数结构长度字节数,该值在设置和查询参数时都必须填写。标志fMask整数指定结构中的哪些成员是有效,SIF_ALL全部有效,SIF_DISABLENOSCROLL禁止滚动SIF_PAGE页码有效,SIF_POS位置有......
  • Java开发者的Python快速进修指南:自定义模块及常用模块
    好的,按照我们平常的惯例,我先来讲一下今天这节课的内容,以及Java和Python在某些方面的相似之处。Python使用import语句来导入包,而Java也是如此。然而,两者之间的区别在于Python没有类路径的概念,它直接使用.py文件的文件名作为导入路径,并将其余的工作交给Python解释器来扫描和处理。另......
  • Spring是如何解析自定义的xml标签
    SpringSPISpring借鉴了JavaSPI思想来解析各种标签,我们称之为SpringSPI。SpringSPI沿用了JavaSPI的设计思想,但在实现上和JavaSPI及DubboSPI也存在差异,Spring通过spring.handlers和spring.factories两种方式实现SPI机制,可以在不修改Spring源码的前提下,做到对Spring框架的扩......
  • input输入时的边框样式去除
    很多程序员在写项目过程中,会遇到input的边框样式去除问题。今天我们就研究一下,有什么办法解决这个问题?一般的,我们会给input设置:input{ border:none; }这种方法,我们去除的是显示样式,但是输入的时候,我们需要点击一下input框,发现还是有一个黑色的初始化边框:这种情况,怎么处理?我们可......