在桌面和移动设备 css

Question

它在桌面设备上运行良好，但我希望在移动设备上将每个句子放在一列中。我怎样才能用css制作它？我不想使用 flex 或其他块。

.hero__subtitle {
    word-spacing: 5em;
  }

<p class="hero__subtitle">
               Some text for test. Another text for test.  Another text for test.

Answer 1

使用媒体查询为不同的设备制作不同的显示。如果您不了解媒体查询，只需稍微搜索一下，它就可以使用给定的像素。或者您可以使用 js 将给定的字符串拆分为其单词或句子，甚至在不同的 H1 标签中打印。或者带有自定义类的标签。看你的想象力