代码之家  ›  专栏  ›  技术社区  ›  Hooman Bahreini

如何使用overflow:用header标签隐藏

  •  0
  • Hooman Bahreini  · 技术社区  · 6 年前

    我想把标题保持在单行中,如下所述:

    h2 {
        overflow: hidden;
    }
    <h2>
    I want to keep the text of this header in single-line... the extra characters should be hidden
    </h2>
    0 回复  |  直到 6 年前
        1
  •  3
  •   Torf    6 年前

    你需要一个宽度和 white-space:nowrap; 为此:

    h1 {
      white-space: nowrap;
      width: 100%;
      overflow: hidden;
    }
    <h1>This text is long. Way too long to be shown in one line. It even is that long</h1>
        2
  •  2
  •   Anh Tuan    6 年前

    h2 {
        width: 100%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    <h2>
    I want to keep the text of this header in single-line... the extra characters should be hidden
    </h2>

    您可以调整要隐藏内容的宽度