HTML/CSS：如何将文本在段落中左右对齐

在一个段落中有两个文本位，一个左对齐，另一个右对齐，最好的代码是什么

• 尽可能少的代码
• 客户端最容易渲染（即使用最少的资源）

我添加最后一个是为了确保

被排除在外。这不仅是一个代码野兽相比，一对夫妇的风格正确的

，

或

，它也是一个野兽，如果你知道什么是HTML渲染引擎必须加载和计算，以决定单元格大小之前，它甚至得到的绘画文本在他们

---

如果你不确定我的意思，这里有一个例子：页脚左对齐当前登录用户的姓名，同一行右对齐当前日期和时间和/或网站版本。

唯一正确的方法是

<p>
  <span style="float: right">Text on the right</span>
  <span style="float: left">Text on the left</span>
</p> 

右边的文字
左边的文字

但是，如果文本溢出，这将给您带来麻烦。如果可以，请使用

div

s（块级元素），并为它们指定固定的

宽度

事实上，一个表（或一系列具有相应的
显示：表/表行/表单元格
属性的
div
s）将是最安全的解决方案-即使您有很多困难的内容，也不可能破坏它。
我不会将它放在同一个
中，因为IMHO这两个信息在语义上太不同了。如果必须的话，我建议：

<p style="text-align:right">
 <span style="float:left">I'll be on the left</span>
 I'll be on the right
</p>


我在左边
我在右边

尽可能少的标记（您只需要一个跨度）：


如果文本大小不同，且必须加下划线，这就是解决方案：

<table>
  <tr>
    <td class='left'>January</td>
    <td class='right'>2014</td>
  </tr>
</table>

我过去曾使用过：

html

好的，您可能想要的将通过以下方式提供给您：

在CSS中：

div{
列数：2；
}

在html中：

一些文字，等等等等

在CSS中，您可以使用div将段落拆分为列，也可以使用3、4

如果你想有很多这样的不同段落，那么把id或类放在你的div中：
没错。它们不是同一段落。与其关注渲染所用的微秒，不如想出一个漂亮的、语义正确的标记来支持文本浏览器、屏幕阅读器和可能更好的搜索引擎评级？不是相反，我认为这两者都很重要，所以在HTML代码中，左边和右边以相同的顺序出现也很好。这很奇怪，a并强制它显示：block，为什么不使用？（嗨：）因为这是语义。您想拆分一个段落，因此我建议使用段落元素。不能在段落中放置像div这样的块元素，因为这是无效的。所以，
是最好的标记。事实上，现在我注意到了，我看到你实际上没有拆分一个段落！所以一个
div
会更好！我特别不想要，而且LR
解决方案也允许我应用不同的字体大小。@StijnSanders您能用该解决方案在同一基线上实现不同的字体大小吗？
<table>
  <tr>
    <td class='left'>January</td>
    <td class='right'>2014</td>
  </tr>
</table>

table{
    width: 100%;
    border-bottom: 2px solid black;
    /*this is the size of the small text's baseline over part  (≈25px*3/4)*/
    line-height: 19.5px; 
}
table td{
    vertical-align: baseline;
}
.left{
    font-family: Arial;
    font-size: 40px;
    text-align: left;

}
.right{
    font-size: 25px;
    text-align: right;
}

January<span class="right">2014</span>

.right {
    margin-left:100%;
}