css到手写笔滚动条问题

我很难将一些css翻译成手写笔。在我的html/css测试中，它工作得非常好，但是当我试图用jade和stylus重写它时，我在正确的语法方面遇到了一些问题。对于上下文，我正在制作一个自定义滚动条。 以下是我正在尝试更改的css：

body::-webkit-scrollbar {
    width: 12px;
    background: rgba(0,0,255,1);
}

body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 2px rgba(255,0,0,1);
}

body::-webkit-scrollbar-thumb {
    background-color: cornflowerblue;
}

---

本质上是

主体：：-webkit滚动条

等行，如何将其转换为工作触控笔？

溢出属性告诉浏览器如何处理溢出元素显示区域的内容。此属性的默认值“可见”告诉浏览器渲染所有内容，使其即使在元素显示区域之外也可见

出于谨慎，您通常希望浏览器显示文档的所有内容。但在极少数情况下，元素可能重叠，造成难看的显示。要防止此类事故，请将overflow属性设置为hidden、scroll或auto

“隐藏”值强制浏览器隐藏溢出其分配空间的所有内容，使其对用户不可见。值scroll为元素创建滚动条，观众可以使用滚动条查看隐藏内容。但是，即使内容没有溢出，滚动条也会添加到元素中

---

添加永久滚动条可确保滚动条不会随着动态文档中元素内容的大小变化而移动。这样做的缺点是滚动条会造成混乱和分心。使用overflow属性的自动值避免所有这些。启用“自动”时，滚动条仅在需要时显示。如果元素的内容发生了更改，因此没有被剪裁，滚动条将从元素中删除。

嗯，我没有完全理解您试图解决的问题。您可以将此代码粘贴到

.styl

文件中，而不做任何更改，并且它可以正常编译（没有错误）。但如果你需要更多的手写笔，你可以这样写：

body::-webkit-scrollbar
  width: 12px
  background: rgba(0,0,255,1)

  &-track
    -webkit-box-shadow: inset 0 0 2px rgba(255,0,0,1)

  &-thumb
    background-color: cornflowerblue

---

好吧，我一定会留意的。这只是css文件的一个片段，所以不仅仅是这些部分。但是谢谢你的忠告！