-1

モバイル サイトのテーブル セルで、一部のテキストを左に配置し、他のテキストを右に配置しようとしていますが、成功しません。提案をいただければ幸いです：

html:

ブロックを定義した次のコードは、矢印を右に揃えますが、矢印の前に改行を追加するため、行が 2 行になり、良くありません。

<table></tr>
<td><a href="listproducts.php">Products<span style="display: block" style="text-align:right">>></span></a></td>
</tr></table>

このコードは、Products という単語の直後に矢印を表示しますが、矢印は同じ行に留まります。

<table></tr>
<td><a href="listproducts.php">Products<span style="display: inline" style="text-align:right">>></span></a></td>
</tr></table>

同じ行の左にテキスト、右に矢印を表示するにはどうすればよいですか? 注：レイアウトが台無しになるため、2つのセルに移動したくありません。また、大量のリンクがあるため、これらのリンクごとに画像を作成する必要はありません。

ところで：テーブルのないレイアウトを行うCSSの知識がないため、これにはテーブルレイアウトを使用しています。

ありがとう。

4

2 に答える 2

1

さて、これを試してみてください。

<table style="width:100%;">
    <tr>
        <td>
            <a href="listproducts.php">Products<span style="float:right;">>></span></a>
        </td>
    </tr>
</table>
于 2013-04-03T17:52:28.370 に答える
0

フローティングさせたいテキストは純粋に装飾的なものなので、CSS で生成されたコンテンツにするのが最善でしょう。使用するコンテナー タグはそれほど重要ではありませんが、ここでは見出しタグが最も適しているようです。

http://jsfiddle.net/Jk8gq/

h1.decorative:after {
    content: '>>';
    float: right;
}

h1.non-decorative span {
    float: right;
}

<h1 class="decorative"><a href="listproducts.php">Products</a></h1>

<h1 class="non-decorative"><a href="listproducts.php">Products</a> <span><a href="#">See All</a></span></h1>
于 2013-04-03T17:53:26.963 に答える