HTML如何在同一行中不同地對齊兩個單詞

Question

我在同一行上有兩個字。 我希望第一個單詞和第二個單詞在同一行上分別向左和向右對齊。 有誰知道如何做到這一點？ 謝謝

Answer 1

將帶有float: left的<span>用於左邊的單詞，將帶有float: right <span>用於右邊的單詞。 還有其他對齊技術，但我認為如果不將單詞分成自己的元素就不可能。

Answer 2

除了Agop所說的那樣，另一種方法是將兩個元素都絕對定位在具有相對位置的父<div>中。 這樣，絕對位置將基於父級。 所以right: 0和left: 0將分別位於父<div>的左側和右側。

看到這個JSFiddle： http : //jsfiddle.net/3ebrcnoL/

Answer 3

您可以嘗試以下方法：

<style type="text/css">
    .maindiv{width:1000px;height:auto;}
    .float_left{float:left;}
    .float_right{float:right;}
</style>
<div class="maindiv">
    <span class="float_left">Leftside</span>
    <span class="float_right">Rightside</span>
</div>