如何在“选择器之后”在css中添加br标签？

Question

我在:: selecter之后使用css来显示文本。我想要做的只是在此显示之前添加一个
标签。不能让它工作

H2::after { 
 
    content: " <br>posted by me"; 
 
    font-size: 14px; 
 
}

<H2>Hello</H2>

Answer 1

不能添加内部伪元素的content:"" html标签。

在:after上使用display:block伪元素，你将得到想要的结果。见下图：

H2::after { 
 
    content:"posted by me"; 
 
    display:block; 
 
    font-size: 14px; 
 
}

<H2>Hello</H2>

让我知道，如果它可以帮助

或者你可以使用JQ如果你真的想包含HTML标记

$("h2").after("<span style='color:red;font-style:italic'>posted by me</span>");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<H2>Hello</H2>

Answer 2

如果您打算将“:: after”打破为新行，为什么不添加“display：block”规则？

h2::after{ 
    content:"posted by me"; 
    font-size:14px; 
    display:block; 
}