Heim  >  Fragen und Antworten  >  Hauptteil

前端 - 集思广益,如何用CSS实现数字上面有一个点

就像简谱一样的那种。css上划线的那种,容易出现很多点或横线,并不适用

ringa_leeringa_lee2766 Tage vor677

Antworte allen(2)Ich werde antworten

  • 黄舟

    黄舟2017-04-17 11:49:08

    需要加点的数字单独一个元素,然后用before或after伪元素实现。

    <span>5</span>
    <style>
        span {
            position: relative;
            font-weight: 800;
            font-size: 6rem;
        }
        
        span::before {
            position: absolute;
            content: '';
            top: -0.5rem;
            left: 50%;
            margin-left: -0.5rem;
            width: 1rem;
            height: 1rem;
            border-radius: 0.5rem;
            background-color: #000;
        }
    </style>

    Antwort
    0
  • 黄舟

    黄舟2017-04-17 11:49:08

    简单点的你就用图片,然后匹配显示,该不会出现兼容等问题

    Antwort
    0
  • StornierenAntwort