css3":: after"伪元素不起作用

Question

我想在div标签之后添加一个三角形.因此我在伪元素之后使用了css3.但它不起作用.以下是我的css规则.

.header-wrapper .part1 ::after {
    width: 0;
    height: 0;
    border-left: solid 48.35px #f21e1e;
    border-bottom: solid 48.35px transparent;
    border-top: solid 48.35px transparent;
}

以下是我的HTML部分

<div class="header-wrapper">
    <div class="part1"></div>
</div>

Answer 1

为了生成伪元素,您需要指定一个content值.否则,该值被假定为默认值none- 这可能就是为什么它不适用于您的情况.(例)

.header-wrapper .part1::after {
    content: '';
    width: 0;
    height: 0;
    border-left: solid 48.35px #f21e1e;
    border-bottom: solid 48.35px transparent;
    border-top: solid 48.35px transparent;
}

根据您发布的CSS,您还应该删除之间的空格.part1 ::after.