Question

是否应使用容器的宽度或使用br？来设置段落断点？

示例：

<div  style="width: 30px;">
    <p>
        Foo bar test
    </p>
</div>

或者

<p>
    Foo<br>
    bar<br>
    test
</p>

我一直认为它应该是通过在容器上设置宽度来实现的。但我不是前端，而且我已经完成的很多HTML模板都使用了BR方法。

Answer 1

具体取决于您要完成的任务。如果您试图将文字换行以适应页面上的特定宽度，那么第一个示例是您应该如何处理它（作为一般规则，您应该尝试使用css调整布局问题，不标记）。

但是，如果有一个逻辑上的原因，为什么行需要在那些特定的地方中断，那么<br />方法是合适的（例如，如果你想确保每个单词都在它自己的行上无论字长如何，那么使用标记（<br>）都没问题。但是，即使在这些情况下，你也可能希望依赖更有意义的语义标记，除非有专门使用中断字符的真实逻辑。：

<p class='thin_column'>
  <span>Foo</span> 
  <span>Bar</span>
  <span>test</span>
</p>

并包含css规则：

.column {width:50px;}
.column span {display:block;}

这样你仍然可以使用CSS从根本上调整布局，但你会在每个单词后强制换行。

Answer 2

不要混合样式和结构（或在此示例内容中）！ width - 方法（在css类中使用而不是内联）是实现此目的的唯一方法。

<br>元素仅用于强制特定位置的换行符。但这取决于内容，而不是造型问题。