我最近讀了一個非常聰明的技巧來完成你所要求的工作。

簡而言之，你只需要使用text-align：justify;在容器元素上實現這一點，結合一個額外的不可見塊。

這是因為內聯塊元素被視為文本內容的一部分，每個元素實際上是單個單詞。

使用對齊方式將展開文本中的單詞，以便它們填充元素的整個寬度，并在單詞之間增加空格。對于內聯塊元素，這意味著它們之間具有均勻間隔。

最后我提到一個額外的看不見的塊。這是必需的，因為正常的text-align：對齊不會證明最后一行文本。對于正常文本，這正是你想要的，但是為了對齊內嵌框框，你希望它們都對齊。

解決方案是將額外的不可見但100％的寬度元素添加到內聯塊元素列表的末尾。這將成為文本的最后一行，因此，正當的技術將適用于其余的塊。

您可以使用：after pseudo-selector來創(chuàng)建不可見元素，而無需修改標記。

[編輯]

查看您添加到該問題的圖片后，最后一次更新。 (我沒有一個更好的答案，但一些額外的想法可能是有用的)。

理想情況下，您需要的是一個最后一行選擇器。然后你可以文本對齊：對齊主文本和text-align：居中的最后一行。那會做你想要的

可悲的是，最后一行不是一個有效的選擇器((第一行是但不是最后一行)，所以這是想法的結束。

更有希望的思想是text-align-last，它作為一個特征確實存在。這可以完全符合你想要的：

text-align:justify;

text-align-last:center;

完善。

除非它是非標準的，并且瀏覽器支持非常有限。

我認為最后的手段可能是您的選擇，如果您只能支持部分瀏覽器支持。至少會得到你想要的一些用戶。但這并不是一個明智的做法。

我的直覺是，盡可能接近你要得到的。非常貼近您想要的，但不完全相同。我希望我被證明是錯誤的，但我會感到驚訝。太糟糕了，因為我似乎是一個完美的邏輯的事情要做。

總結

以上是生活随笔為你收集整理的html块左右排列,html – 如何均匀地排列多个内嵌块元素？的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。