Javascript 如何使用文本换行将div放置在一行中？

我正在制作一个应用程序，可以将标签添加到帖子中，很像stackoverflow的标签系统。我想显示所有常用标签的列表，每个标签都放在一个小框中，与标签完全匹配，就像标签拉伸以适合单词大小一样。我如何才能做到这一点，并使s与包含div中的文本换行水平对齐？也就是说，像这样，每个单词都有：

---

最简单的解决方案是使用display:inline块设置标记元素的样式，该块允许文本换行，同时防止页边距折叠

---

最简单的解决方案是使用display:inline块设置标记元素的样式，该块允许文本换行，同时防止页边距折叠

---

我不确定我是否完全理解你的问题，但有不同的方法来实现这种标签效应

您可以将div设置为float:left，clear:left，并在所有边上加上5px的填充。然后把你所有的标签放在一个固定宽度的容器中，它们应该水平平铺，直到它们用完空间，在这一点上，它们将被包装到下面的下一行

一种更简单的方法是只使用内联元素，例如锚定标记，它们正在这个站点上使用。这些元素自然水平流动，直到它们用完空间，然后包裹起来。如果你检查他们，你会发现他们的风格没有太多变化。它们的行为方式与内联元素的行为方式相同

---

有时候解决方案比你想象的要简单。您可能不需要为div或floating而烦恼。但是如果没有更多的信息，很难说什么对你有效。

我不确定我是否完全理解你的问题，但是有不同的方法来实现这种标签效应

display:inline-block

您可以将div设置为float:left，clear:left，并在所有边上加上5px的填充。然后把你所有的标签放在一个固定宽度的容器中，它们应该水平平铺，直到它们用完空间，在这一点上，它们将被包装到下面的下一行

一种更简单的方法是只使用内联元素，例如锚定标记，它们正在这个站点上使用。这些元素自然水平流动，直到它们用完空间，然后包裹起来。如果你检查他们，你会发现他们的风格没有太多变化。它们的行为方式与内联元素的行为方式相同

有时候解决方案比你想象的要简单。您可能不需要为div或floating而烦恼。但是如果没有更多的信息，很难说什么对你有效

display:inline-block

不适用于所有浏览器或旧版本的IEs。。。包括7个

请尝试以下方法：

标记是内联的，但带有空白：nowrap；并设置了适当的线条高度

希望这有帮助

不适用于所有浏览器或旧版本的IEs。。。包括7个

请尝试以下方法：

标记是内联的，但带有空白：nowrap；并设置了适当的线条高度

---

希望这对您有所帮助

+1-它还允许您通过设置text align:center，将元素置于其父元素的中心；在父母身上。一些漂浮的元素是不允许的。这正是我想要的，谢谢！有没有办法用css在所有这些div之间添加填充？我的标签上的边框相互碰撞。请使用边距将它们隔开，如演示中所示。padding用于填充元素边框的内部文本。+1-通过设置text align:center，还可以使元素在其父元素内居中；在父母身上。一些漂浮的元素是不允许的。这正是我想要的，谢谢！有没有办法用css在所有这些div之间添加填充？我的标签上的边框相互碰撞。请使用边距将它们隔开，如演示中所示。填充用于填充元素边框的内部文本。