Question

任何知道如何制作虚线0的CSS大师？我有一个白色打击结合白色正向斜线和背斜线为described here的想法，但也许有更好的方法。

Answer 1

使用虚线为零的字体。您可以使用@font-face包含一个可以保证点零的字体。

Answer 2

选项1.在其上放置一颗子弹：

<div>HELL<span class="dottedO">O<span>&bull;</span></span> WORLD</div>

CSS：

.dottedO {
  display: inline-block;
  overflow: auto;
  position: relative;
}

.dottedO span {
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  text-align: center;
}

选项2：使用unicode双唇点击字符（ʘ）：

<div>&#664;</div>

JSBIN：http://jsbin.com/ewufod/1

请注意，上述两种解决方案可能会导致屏幕阅读器，搜索引擎等出现问题，因为您要在混音中添加非标准字符。

选项3：背景图片

在一个范围内包裹'O'，将其设置为display: inline-block并为该范围提供一个点的背景图像。缺点：不会打印。

选项4：使用已具有此样式的字体（嵌入Web字体）。

Answer 3

您可以使用自定义字体，或者如果它足够好，U + 25CC DOTTED CIRCLE字符◌是否适合您？

CSS的虚线文字？

3 个答案: