3

次のことを考慮してください。

<a>a</a><a>b</a>

2番目のアンカー（b）を右に揃えるにはどうすればよいですか？

PS：フロートはこの状況での乱用です。これのために作られたものではなく、いくつかの問題を引き起こすので、他のより合理的な解決策が必要です。

4

8 に答える 8

25

これを行うだけです：

style="float:right"

好き：

<div>
   <a href="#Equipment" class="ui-btn ui-shadow ui-corner-all ui-btn-inline ui-mini">Equipment</a>
   <a href="#Model" class="ui-btn ui-shadow ui-corner-all ui-btn-inline ui-mini" style="float:right">Model</a>
</div>

http://jsfiddle.net/umerqureshi/0jx7kf1L/

于 2015-01-02T09:54:10.843 に答える
8

別のコンテナが必要になります。

<p>
    <span>
        <a>Left</a>
    </span>
    <span class="align-right">
        <a>Right</a>
    </span>
</p>

p {font-size:0; /* Fixes inline block spacing */  }
span { width:50%; display:inline-block; }
span.align-right { text-align:right; }

span a { font-size:16px; }

JSFiddleの例。

于 2013-02-21T11:25:38.717 に答える
8

このCSSを試してください

CSS3の使用nth-child（）

a:nth-child(2) {
   display: inline-block;
   text-align: right;
   width: 100%;
}

デモ： http： //jsbin.com/opexim/3/edit

注：nth-​​childはCSS3であり、IE6、7、8などの古いブラウザーでは機能しません。

古いブラウザのサポート

class2番目のアンカー要素に設定し<a>、CSSを適用します。

<a>a</a><a class="right">b</a>


a.right {
   display: inline-block;
   text-align: right;
   width: 100%;
}
于 2013-02-21T11:28:26.147 に答える
2

多分あなたはこのようなものを作ることができます：<a>a</a><a class="right">b</a>

そしてこのようなCSS：

a.right {
    position: absolute;
    right: 0;
}
于 2013-02-21T11:22:01.363 に答える
1

試して使用してください：nth-​​child（）：

a:nth-child(2) {
   display: inline-block;
   text-align: right;
   width: 100%;
}

これが古いブラウザで機能するかどうかはわかりません。

于 2021-09-17T07:32:44.597 に答える
0

以下のコードを試すことができます：

<a>a</a><a align="right">b</a>

  <a>a</a><a style="text-align:right">b</a>
于 2013-02-21T11:22:59.397 に答える
0

アンカーを含む「b」にaclassまたはを割り当てて与えます。idmargin-left:100%

例えば：

.second{margin-left:100%;}

またはその他

a:nth-child(2){margin-left:100%;}

またはその他

以下のようにすることもできます。

css

a:nth-child(1){display:inline-block;width:50%;text-align:left;float:left;}
a:nth-child(2), .second{display:inline-block;width:50%;text-align:right;}

ワーキングフィドル

于 2013-02-21T11:38:42.650 に答える
0 
<div class="mydiv">
    <a class ="mylink"> test </a>
</div>

.mydiv {
    text-align: left;
}

algin'div'に与える'a'タグのスタイルを入力する必要があります。

于 2021-05-30T14:23:47.277 に答える