带有3个水平点的HTML按钮样式

我正在尝试创建一个带有3个水平点的按钮，如所附的屏幕截图所示，带有下面的css类和unicode字符“…”（U+2026）

但当我应用背景时，它需要更多的宽度和高度，请任何人建议。 在附加的屏幕截图中，我需要第一个图像，但得到第二个图像

。测试：在{
内容：'\2026'；
字体大小：25px；
背景色：#D0；
}

---

大部分代码都达到了所需的风格。现在尝试在结果图像的3个点之前和之后添加空背景

。水平点{
光标：指针；
宽度：19px；
高度：14px；
背景图像：径向渐变（圆形，黑色1.5px，透明2.0px）；
背景尺寸：6px 16px；
背景色：#EEEEEE；
边框顶部：1px实心#中交；
右边框：1px实心#中交；
边框底部：1px实心#CCCC；
左边框：1px实心#中交；
边界半径：0.2米；
左边距：14px；
}
.水平点：悬停{
边框：实心。2px#0198E1；
}

这个怎么样

将

放置在

按钮内可以微调点的位置


按钮{
边框：2px实心#9fa2a4；
高度：18px；
边界半径：5px；
背景：线性渐变（#fbfbfb，#d1d1d1）；/*给出“渐变*/彩色背景”
}
.圆点{
字体系列：Arial，“Helvetica Neue”，Helvetica，无衬线；/*Arial字体似乎有“方形”点*/
字体大小：36px；/*点的大小*/
线条高度：0；/*有助于垂直定位点*/
页边距顶部：-10px；/*有助于将圆点“抬高”*/
字母间距：-2px；/*将点“挤压”在一起*/
}

...
最初的按钮是由离散的html元素构成的还是仅仅是一个图像？嗨@Ourobrus，furstone是flex mx:按钮。当你想要的是一个
按钮时，为什么要使用
div
？试试
填充
CSS属性你可能想尝试不同的字体，使点更“矩形”。还有为什么不只用三个点。。。而不是unicode字符。对于三个点，您还可以使用
字母间距
将点分散得更远。看起来原稿的背景有轻微的渐变。你可以通过：
.horizontal dots{background:linear gradient（#f9f9f9，#d1d1）}
Hi@Sergey，当应用填充时，背景图像重复并添加一个点。Hi@Sergey，应用建议的线条背景：linear gradient（#f9f9f9，#d1d1d1）；从背景中删除所有点。谢谢你的帮助。Hi@Sergey，是的，它是100%匹配的，非常感谢，将其标记为答案，实际上我对css样式了解不多。Hi@Sergey，我希望锚定标记的样式与按钮的样式相同，如果可能，请提供。你可以使用
&hellip实体，因为这实际上是一个水平省略号。也可以节省字母间距。是的，我喜欢使用www.ampwhat.com查找unicode字符。我的目标是简单地避开“点背景图像”方法。但是是的，有很多方法可以实现这些点。我喜欢字母间距可以控制点的间距。嗨@Sergey，当点击你提供的按钮时，顶部会显示黑线，请检查