JavaScript开发者必知：CSS中content属性的作用全解析

CSS中的content属性主要用于定义元素的内容。它可以用于伪元素（例如：::before和::after），也可以用于生成器元素（例如：<output>）。content属性的值可以是文本、URL、counter、attr等。 在伪元素中，content属性用于向元素添加内容。例如： ```css ::before { content: "Hello, "; } ::after { content: "World!"; } ``` 这将在元素的前面添加"Hello, "，在元素的后面添加"World!"。 在生成器元素中，content属性用于设置元素的默认值。例如： ```css output { content: attr(value); } ``` 这将设置output元素的值为它自身元素的value属性的值。 content属性还可以与数据属性一起使用，以从HTML中动态生成内容。例如： ```html <div class="greeting"></div> <script> var greeting = document.querySelector('.greeting'); greeting.textContent = greeting.dataset.greeting; </script> ``` 这将在div元素中设置文本内容，该内容是从data-greeting属性中动态获取的。 ######[AI写代码神器 | 234点数解答 | 2023-11-09 01:06:52]