Question

结构性问题。

我试图将伪元素放在标签css括号内。目前它看起来像这样：

    a {
        background-color: grey;
        padding: 50px 100px 50px 100px;
        text-decoration: none;
        display: inline-block;
        font-size: 50px;
        border: 3px solid grey;
        border-radius: 25px;
        box-shadow: 0px 0px 30px 10px #080808, 0px 0px 25px 30px #2f4f4finset;
        text-shadow: 3px 3px #999999;
        margin-left: 10%;
        margin-top: 20%;
    }

    a:before {
    content: "* ";
}

    a:after {
   content: " *";
}

我希望它能像这样工作：

    a {
        background-color: grey;
        padding: 50px 100px 50px 100px;
        text-decoration: none;
        display: inline-block;
        font-size: 50px;
        border: 3px solid grey;
        border-radius: 25px;
        box-shadow: 0px 0px 30px 10px #080808, 0px 0px 25px 30px #2f4f4finset;
        text-shadow: 3px 3px #999999;
        margin-left: 10%;
        margin-top: 20%;

    a:before {
    content: "* ";
}

    a:after {
   content: " *";
}
    }

有关如何正确调用＆＃39;的任何提示伪元素没有打破原来的标签样式？

Answer 1

可以使用预处理器实现，例如SASS或LESS。

a {
    // styles here
    &:before {
        // styles for :before
    }
}

Answer 2

你不能在纯CSS中这样做，因为纯CSS不允许嵌套样式块。您需要一个预处理器，如SASS或LESS。

CSS Pseudo Element在另一个样式块中

2 个答案: