CSS:可以将 Webkit 滚动条“推”到内容中吗?

2024-04-11

通常滚动条的位置如下:

________________________________________
|                          |           |
|         content          | scrollbar |
|                          |           |
|                          |           |
|                          |           |
|                          |           |
|__________________________|___________|

我基本上希望在“自定义”滚动条和可滚动容器的外边界之间有一个间隙:

________________________________________
|                    |           |     |
|      content       | scrollbar | gap |
|                    |     <     |     | 
|                    |           |     |
|                    |           |     |
|                    |           |     |
|____________________|___________|_____|

Using a margin-right在任一::-webkit-scrollbar or ::-webkit-scrollbar-track-piece失败,Webkit 的样式滚动条声明如下:

沿滚动条的轴支持边距。他们可以 负(例如,轨道可以充气以覆盖 部分按钮)。

我现在想知道是否有人设法通过其他方式将滚动条“推入”内容(或从包装器中推出)margin.

我假设这可能只有(即使)使用某种技巧才有可能 - 有什么想法吗?

我尝试过的其他失败的事情是padding-right: 10px and border-right: 10px solid rgba(255, 255, 255, 0)(透明边框)。


您可以使用透明边框来做到这一点。但你需要设置background-clip: padding-box;否则行不通。

例子:http://jsfiddle.net/6KprJ/1/ http://jsfiddle.net/6KprJ/1/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

CSS:可以将 Webkit 滚动条“推”到内容中吗? 的相关文章

随机推荐