有没有一种方法可以使CSS选择器在标题之前放置一个 "-"？

Question

我有这个CSS选择器：

h3 {
    font-size: 1rem;
}

有没有办法让它更改标题：

Example

to

- Example 

- Alan2

---

需要使用纯CSS完成，不能使用JS或JQuery。 - PseudoAj

Answer 1

您可以使用伪元素:before在其前面添加内容，如下所示：

伪元素:before

。

h3 {
  font-size: 1rem;
}

h3:before {
  content: '- ';
}

<h3>Example</h3>

- timolawl

Answer 2

你可以使用:before伪元素。

h3:before
{
  content:"- ";
}

 <h3>Example</h3>

查看更多 http://www.w3schools.com/cssref/sel_before.asp

- Naresh Teli

Answer 3

h3::before {
  content: "- ";
  display: inline-block;
  font-size: 13px;
}

这样的东西应该就够了

- Mark Eriksson

---

为什么使用“display: inline-block;”？另外，字体大小为什么重要？ - ferdynator

Answer 4

这就是它

CSS

h1:before{
  content:'-';
}

DEMO

可以翻译为：

{{链接1：演示}}

- Fiido93