我可以为通过 "content" CSS 属性插入的文本设置样式吗？

Question

我正在使用 CSS 和缓动动画制作按钮动画，我发现我可以使用 "content" 属性在缓动动画之上插入文本。有没有办法设置插入文本的样式？

或者是否有更好的样式和插入文本的方法？ - 请只使用 CSS。

Answer 1

可以，看例子

div {
position:relative;
width: 400px;
height: 50px;
}

div:after {
position: absolute;
content: 'inserted via CSS';
width: 100%;
height: 100%;

/* adding some random properties to illustrate */

background-color: maroon;
color: white;
text-decoration: underline;
font-size: 2em;
display: flex;
align-items: center;
justify-content: center;
font-family: sans-serif;
text-transform: uppercase;
}

<div class=test></div>

我可以为通过 "content" CSS 属性插入的文本设置样式吗？

Can I style text that has been inserted via the "content" CSS attribute?

html

css

attributes

css-animations