在 CSS 滚动条中旋转背景图像：解决旋转之谜
问题：
中开发人员在尝试在 Chrome 滚动条按钮内旋转图像时遇到了挑战。虽然 -webkit-transform 属性成功旋转了整个按钮（包括其内容），但他们寻求单独旋转图像的解决方案。
答案：
解决方案在于利用伪元素 :before，它在原始元素内创建一个附加元素。通过绝对定位伪元素，定义其尺寸，并将其相对于父元素定位，它就成为一个单独的“层”。
CSS 代码片段：
#myelement:before {
content: "";
position: absolute;
width: 200%;
height: 200%;
top: -50%;
left: -50%;
z-index: -1;
background: url(background.png) 0 0 repeat;
transform: rotate(30deg);
}在此代码片段中，背景图像设置在伪元素内并使用 Transform 属性进行旋转。 z-index 确保图像层位于主元素内容的后面。通过调整 top 和 left 属性，图像可以定位在元素内以围绕其首选中心旋转。
以上是如何在 CSS 滚动条按钮内旋转图像而不旋转按钮本身？的详细内容。更多信息请关注PHP中文网其他相关文章！
