html - 在unicode中填充 "o"字符或通过CSS模仿

标签 html css unicode

我需要用 HTML 编写此文本:

Now.

我尝试使用一些 unicode 字符,例如 ● Unicode Character 'BLACK CIRCLE' (U+25CF)⬤ Unicode Character 'BLACK LARGE CIRCLE' (U+2B24)但它们需要一些样式(即大小与 o 不同)并且在某些系统和字体上显示有问题。

您能提出更好的解决方案吗?它可以是一个被广泛接受的 unicode 字符或一些 CSS 模仿(在这种情况下,如果 HTML 仍然包含 Now. 字符串以获得良好的索引,那就太好了)。图片不是一个选项。

最佳答案

我建议使用 CSS border-radius 来创建实心的“o”圆。

span {
    font-family: sans-serif;
    font-size: 50px;
}
i {
    display: inline-block;
    text-indent: -9999px;
    width: 30px;
    height: 30px;
    background: black;
    vertical-align: middle;
    border-radius: 50%;
}
<span>N<i>o</i>w.</span>

关于html - 在unicode中填充 "o"字符或通过CSS模仿,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34152168/

相关文章:

unicode - 使用 unicode 字符的 SQL LIKE 语句未显示正确的结果

javascript - 如何更改 jQuery Skitter.js 幻灯片的宽度?

javascript - 从动态表单生成创建 JSON

javascript - href 目标 rel 变化

HTML/CSS 图像不换行

html - 背景图片不显示

ios - 为什么上标数字的Unicode字符显示高度不一样?

html - 避免在 html/css 中的桌面 View 中水平滚动

jquery - 无法设计带有图像的垂直菜单

python - JSON 文件中的变音符号会导致 ANTLR4 创建的 Python 代码出现错误