html - 如果屏幕太小，我怎样才能破坏 H1 标题

Question

我想让我的网站响应。 我已经修复了 div 和段落标签。

我试过断字和空格之类的东西，但没有用。

如果屏幕较小，段落标签会自动转到下一行。但我无法让 H1 这样做。

我将在下面添加我的 html 代码，并添加截图和 CSS 代码的链接。

手机大小:https://gyazo.com/dd12083cba1261160d945cc64cb57ad7
Jfiddle(Html Css):https://jsfiddle.net/ofdtedtx/

        <div class="content">
          <div class="article">
            <h1>Introductie</h1>
            <p>Informatie over de site en toegepaste kennis:</p><br>
            <div class="infobox">
                <h1>Html 5</h1>
                    <ul>
                        <li>Standaard Toepassingen</li>
                        <li>Forms</li>
                        <li>Input Types</li>
                        <li>Divs</li>
                    </ul>
            </div>
          </div>

Answer 1

在 .article h1 处，给它一个 line-height:1，应该可以。

.article h1 {
    color: #4e4e4e;
    font-family: Sans-serif;
    font-size: 4rem;
    line-height: 1;
}