CSS scroll bar style modification code

CSS scroll bar style modification code

CSS scroll bar style modification code

.scroll::-webkit-scrollbar { // Vertical and horizontal scroll bar width width: 1px;
    height: 1px;
}
.scroll::-webkit-scrollbar-thumb { // Scrollbar background bar style border-radius: 1px;
    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
    background: #5b5f63;
}
.scroll::-webkit-scrollbar-track { // Scroll bar button style-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
    border-radius: 1px;
    background: #00284d;
}

Summarize

The above is the code for modifying the CSS scroll bar style that I introduced to you. I hope it will be helpful to you. If you have any questions, please leave me a message and I will reply to you in time. I would also like to thank everyone for their support of the 123WORDPRESS.COM website!
If you find this article helpful, please feel free to reprint it and please indicate the source. Thank you!

<<:  Comparing Document Locations

>>:  Code for aligning form checkbox and radio text

Recommend

MySQL permissions and database design case study

Permissions and database design User Management U...

How to center your HTML button

How to center your HTML button itself? This is ea...

MySQL table and column comments summary

Just like code, you can add comments to tables an...

How to implement data persistence using the vuex third-party package

Purpose: Allow the state data managed in vuex to ...

JS implements simple example code to control video playback speed

introduction I discovered a problem before: somet...

Realize super cool water light effect based on canvas

This article example shares with you the specific...

Detailed description of the life cycle of React components

Table of contents 1. What is the life cycle 2. Lo...

vue+element custom query component

This article mainly introduces the Vue project. O...

Sample code for html list box, text field, and file field

Drop-down box, text field, file field The upper p...

Don’t bother with JavaScript if you can do it with CSS

Preface Any application that can be written in Ja...

Detailed tutorial on installing Prometheus with Docker

Table of contents 1. Install Node Exporter 2. Ins...

Detailed explanation of the difference between Vue life cycle

Life cycle classification Each component of vue i...

Summary of four ways to loop through an array in JS

This article compares and summarizes four ways of...

CentOS installation mysql5.7 detailed tutorial

This article shares the detailed steps of install...