在响应式设计中指定 HTML 文本中的首选换行点 [英] Specifying a preferred line break point in HTML text in a responsive design

问题描述

我想知道是否有 CSS 或 javascript 魔法可以在 html 文本中放置标记，以便浏览器知道当文本变得狭窄时在哪里创建换行符.有这种东西吗?

I was wondering if there is a CSS or javascript magic that could place a marker in an html text so that the browser know where the line break creation is preffered when the text gets cramped. Is there such thing?

推荐答案

我认为这很有效:

span.line {
  display: inline-block;
}

<p>
  <span class="line">This text should break</span>
  <span class="line">after the word "break"</span>
</p>

当空间不足时，文本仍会在其他地方中断:

The text still breaks on other places when there is not enough space:

打开演示

这篇关于在响应式设计中指定 HTML 文本中的首选换行点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！