77 lines
1.7 KiB
HTML
77 lines
1.7 KiB
HTML
<head>
|
|
<style>
|
|
div::-webkit-scrollbar {
|
|
width:17px;
|
|
height:17px;
|
|
}
|
|
|
|
div::-webkit-scrollbar-button {
|
|
display: block;
|
|
width: 17px;
|
|
height: 17px;
|
|
}
|
|
|
|
div::-webkit-scrollbar-button:-webkit-decrement:-webkit-start {
|
|
background-color:lightblue;
|
|
border:2px solid black;
|
|
}
|
|
|
|
div::-webkit-scrollbar-button:-webkit-increment:-webkit-start {
|
|
background-color:lightgreen;
|
|
border:2px solid black;
|
|
}
|
|
|
|
div::-webkit-scrollbar-button:-webkit-decrement:-webkit-end {
|
|
background-color:orange;
|
|
border:2px solid black;
|
|
}
|
|
|
|
div::-webkit-scrollbar-button:-webkit-increment:-webkit-end {
|
|
background-color:brown;
|
|
border:2px solid black;
|
|
}
|
|
|
|
div::-webkit-scrollbar-button:hover {
|
|
background-color:black !important;
|
|
}
|
|
|
|
div::-webkit-scrollbar-thumb {
|
|
min-width:20px;
|
|
min-height:20px;
|
|
background-color: navy;
|
|
border:2px solid #cccccc;
|
|
}
|
|
|
|
div::-webkit-scrollbar-track {
|
|
background-color: pink;
|
|
}
|
|
|
|
div::-webkit-scrollbar-thumb:hover {
|
|
background-color: green;
|
|
}
|
|
|
|
div::-webkit-scrollbar-thumb:active {
|
|
border:3px dotted white;
|
|
}
|
|
|
|
div::-webkit-scrollbar-track:hover {
|
|
background-color: maroon;
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div style="width:200px; height:200px; overflow-y:scroll; overflow-x:hidden">
|
|
Hello<br>
|
|
Hello<br>Hello<br>Hello<br>Hello<br>Hello<br>Hello<br>Hello<br>
|
|
Hello<br>Hello<br>Hello<br>Hello<br>
|
|
Hello<br>Hello<br>Hello<br>Hello<br>
|
|
<span style="white-space:nowrap">Hello world this is a long string and will not wrap.</span>
|
|
Hello<br>Hello<br>Hello<br>Hello<br>
|
|
Hello<br>Hello<br>Hello<br>Hello<br>Hello<br>Hello<br>
|
|
Hello<br>Hello<br>Hello<br>Hello<br>
|
|
Hello<br>Hello<br>Hello<br>Hello<br>Hello<br>Hello<br>
|
|
Hello<br>Hello<br>Hello<br>Hello<br>
|
|
Hello<br>Hello<br>Hello<br>
|
|
</div>
|