Html 自定义 Webkit 滚动条按钮
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/26070489/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Custom Webkit Scrollbar Button
提问by Clam
I am trying to figure out how to make the webkit scrollbar button appear. I'm testing this on safari on Mac.
我想弄清楚如何使 webkit 滚动条按钮出现。我正在 Mac 上的 safari 上对此进行测试。
I read these guides but I can't for the life of me figure out how to get a simple button to make it go up and down. I have an image that I was supposed to emulate, but no idea how. Can images be used as buttons? Example of image
我阅读了这些指南,但我终生无法弄清楚如何获得一个简单的按钮来使其上下移动。我有一个我应该模仿的图像,但不知道如何模仿。图像可以用作按钮吗?图像示例
!(http://oi62.tinypic.com/28kh76a.jpg)
!( http://oi62.tinypic.com/28kh76a.jpg)
http://css-tricks.com/custom-scrollbars-in-webkit/
http://css-tricks.com/custom-scrollbars-in-webkit/
Have this so far..
到目前为止有这个..
::-webkit-scrollbar {
width: 12px;
}
::-webkit-scrollbar-track {
background-color: #fff;
}
::-webkit-scrollbar-thumb {
background-color: #81CFCC;
height: 10px;
but don't know how to get the scroll buttons for up and down.. or how to style them.
但不知道如何获得向上和向下滚动按钮......或如何设置它们的样式。
回答by Brian Whitton
Use the ::-webkit-scrollbar-button
selector and set its display to block. I wasn't getting buttons to show up until I set their display prop.
使用::-webkit-scrollbar-button
选择器并将其显示设置为阻止。在我设置他们的显示道具之前,我没有让按钮显示出来。
回答by Blake
refer to this article, this is all you will need to know for webkit scrollbars
参考这篇文章,这就是你需要知道的关于 webkit 滚动条的全部内容
Custom Scrollbars in WebKit - Css Tricks
EDIT 1
编辑 1
You could try something like this
你可以试试这样的
::-webkit-scrollbar-button {
background: #444;
}
EDIT 2
编辑 2
hopefully this helps in some way
希望这在某种程度上有所帮助