html - CSS "content"不工作

Question

我想通过 CSS 而不是在 HTML 中为段落添加文本，因为它可能会随着网站的响应能力而发生变化。

现在我无法让它工作，我想知道是不是CSS有问题？

此外，这是唯一可以做到这一点的方法(使用纯 HTML 和 CSS)还是有另一种方法来定位文本并根据每个分辨率更改它？

HTML:

<p class="title"></p>

CSS:

p.title {
        width: auto;
        height: auto;
        position: relative;
        float: left;
        clear: none;
        margin: 40px 0 0 0;
        padding: 0;
        display: block;
        font-family: 'Fjalla One', sans-serif; 
        font-weight: 400; 
        font-size: 36px;
        color: #d76e50; color: rgba(215, 92, 52, 0.9);
        cursor: default;
        content:"TITLE GOES HERE";
}

Answer 1

CSS content 属性只能与 ::before 和 ::after 伪元素一起使用。您可以通过创建一个仅在 ::after 上具有样式的子元素来解决此问题，并且还包括依赖于解析的文本的 content 属性媒体查询。