为什么：奇怪的是被画了？

Question

这是我的代码：

.specific_tag_cases a:after{
    position: absolute;
    font-family: Arial;
    background-color: #c1c1c1;
    color: white;
    content: "×";
    padding: 0px 3px;
    margin-top: 6px;
    margin-right: 4px;
    font-size: 11px;
    border-radius: 50%;
}

这是输出：

好的，一切都很好。

但有时突然看起来这样在页面重新加载后：

背后没有任何具体的逻辑。我的意思是我不知道什么时候会被奇怪地画出来。任何时候都可以发生。

为什么呢？我该如何解决这个问题？

Answer 1

请为O(n *n!) = O(4 * 4!)代码定义height和width。

您正在使用a，但未分配border-radius:50%;和width，如果您需要一个圆角框，则必须分配相等的height和{{ 1}}。

如下所示

width

包括工作示例。在此示例中，我删除了height并更改了.specific_tag_cases a:after{ position: absolute; font-family: Arial; background-color: #c1c1c1; color: white; content: "×"; padding: 0px 3px; margin-top: 6px; margin-right: 4px; font-size: 11px; border-radius: 50%; width:8px; /*Add this*/ height:8px; /*Add this*/ } 属性，因为我不需要它。

position

margin