如何使用CSS制作3个垂直点？

我想在我的页面上有3个点，例如，切换上下文菜单的显示。如何使用CSS实现这一点

HTML

<div class="dot"></div>

使用unicode字符

。测试：在{
内容：'\2807'；
字体大小：100px；
}

---

如果您使用的是令人敬畏的字体，那么添加

.fa-ellission-v

样式就很容易了。更多文档可在此处找到：。

请尝试3点菜单的完整源代码：

index.html

三点菜单
*{边距：0；填充：0px}
.标题{
宽度：100%；
背景色：#0d77b6！重要；
高度：60px；
}
.左{
背景色：#0d77b6！重要；
边框：1px实心#0d77b6！重要；
文本阴影：无！重要；
颜色：#fff！重要；
填充：10px；
}
李先生{
背景：无重复滚动0 0#fff；
高度：7px；
宽度：7px；
线高：0；
列表样式：无外无；
右边距：15px；
利润上限：3倍；
垂直对齐：顶部；
边界半径：50%；
指针事件：无；
}
.btn左{
左：0.4em；
}
.btn对{
右：0.4em；
}
.btn左、.btn右{
位置：绝对位置；
顶部：0.24em；
}
.dropbtn{
背景色：#4CAF50；
位置：固定；
颜色：白色；
字体大小：16px；
边界：无；
光标：指针；
}
.dropbtn:悬停，.dropbtn:焦点{
背景色：#3e8e41；
}
.下拉列表{
位置：绝对位置；
显示：内联块；
右：0.4em；
}
.下拉内容{
显示：无；
位置：相对位置；
边缘顶部：60像素；
背景色：#f9f9f9；
最小宽度：160px；
溢出：自动；
盒影：0px 8px 16px 0px rgba（0,0,0,0.2）；
z指数：1；
}
.下拉内容a{
颜色：黑色；
填充：12px 16px；
文字装饰：无；
显示：块；
}
.下拉列表a:悬停{背景色：#f1f1}
.show{display:block；}
函数更改语言（语言）{
var元素=document.getElementById（“url”）；
元素值=语言；
element.innerHTML=语言；
}
函数显示下拉列表（）{
document.getElementById（“myDropdown”）.classList.toggle（“show”）；
}
//如果用户在下拉列表之外单击，请关闭下拉列表
window.onclick=函数（事件）{
如果（！event.target.matches（'.dropbtn'））{
var dropdowns=document.getElementsByClassName（“下拉内容”）；
var i；
对于（i=0；i

使用fontawesome.css

<i class='fa fa-ellipsis-v'></i>

---

这可用于显示三个点。这可用于react中的卡片⠇ 这是字母“U”的盲文符号。要使用，只需使用HTML实体

⠇在您的代码中。
大多数投票的答案显示我用2列点着，所以我用下面的Unicode字符完成了

<div>&#xFE19;</div>

︙；

为什么不能直接使用html列表标记？为什么只有css？我只需要项目符号而不是文本。点击三个点，弹出一个弹出菜单。你应该更新你的问题以反映这些信息。请完整详细地描述您的问题。这出现在低质量的审阅队列中，很可能是因为您给出了一个只使用代码的答案。我建议在你的答案后面包括一个解释和推理，这样其他人就可以真正理解这个问题的答案是如何和为什么的。所以我需要给这个部门打三次电话来实现这个目标。我可以有一个单一的css，它将给出3个点，这样我可以一次调用div。字体-可怕的垂直点是如此丑陋（和平方）！！cf接受unicode解决方案以获得合适的样式请参阅修订版（单击“5月15日编辑…”）
<span class="glyphicons glyphicons-option-vertical"></span>

.textSpan:after {
 content: '\2807';
 font-size: 3em;
 color: #2e2e2e
}

<script> <meta name="viewport" content="width=device-width, initial-scale=1"/>
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"></link></script>

 <i class="fa fa-ellipsis-v col-2 mt-3 .text-light fa-lg" style={{"float":"right"}}></i>

<div>&#xFE19;</div>