如何在项目标题中添加项目符号？

Question

是否可以将这样的项目符号（•）添加到div标题中？

编辑

我正在尝试通过javascript代码（反应）来执行此操作，并将其写在代码“？”中符号，而不是•

<div title="I want bullet">Hover me</div>

Answer 1

我们可以在psuedo元素之前使用来实现此目的。

.html

/* Added a title class to the element */
<div class="title" title="I want bullet">Hover me</div> 

.css

.title:before {
   content:"\A";
   width:10px;
   height:10px;
   border-radius:50%;
   background: #000;
   margin-right: 5px;
   display:inline-block;
}

Answer 2

通常来说，您可以使用 HTML实体替换键盘上不存在的字符。 只需在参考页面（如

https://en.wikipedia.org/wiki/List_of_XML_and_HTML_character_entity_references

记下它的十进制值-对于项目符号为 8226 -在该值之前放置＆＃，在其后放置; 最后将此添加到您的字符串中。 所以

<div title="I want bullet">Hover me</div>

成为

<div title="I want bullet">&#8226; Hover me</div>

不幸的是，尽管这样的数字很难记住，所以也有可能用它的名字来引用这样的实体。项目符号字符的实体名称是 bull ，您可以将其添加到字符串中，例如•

如果您想使用Javascript将项目符号点添加到<div>元素中，则需要使用它的 .innerHTML 属性。

这是一个例子：

document.getElementById("bullet").innerHTML = "• Hover me";

<div id="bullet"></div>

Answer 3

使用

<div title="&#8226; I want bullet">Hover me</div>

Answer 4

我们可以使用li元素的默认CSS在其他元素中创建项目符号。

div{
  display: list-item;
  list-style: list-item;
}