テンプレート:Float right

{{{1}}}

テンプレートの解説[表示] [編集] [履歴] [キャッシュを破棄]

使い方

このテンプレートは、テキストを右側に浮かせて配置しますが、テキストの水平位置は変更しません。 テキスト自体を右揃えにしたい場合は {{right}} を使用してください。

パラメーター

• 1 または text：右に浮かせて配置する内容。
• 2 または offset：右マージンからの距離（ページ右端からブロックを内側に押し込む値）。既定値は 0。
• 3：浮動ブロックの上下マージン。既定値は 0。
• 4 または gutter：浮動ブロックの左側に設ける余白（ガター）。既定値は 0。

距離のパラメーターには必ず単位を含めて指定してください（例：2em）。 テキストを含むブロックでは px 単位の使用は避け、em などの相対単位を使用することを推奨します（詳細は H:PXWIDTH を参照）。

オフセット

offsetパラメーターを使用することで、テキストがページの右端まで張り付かないように調整できます。

このテキストは浮動スパンの外側にあります。 
{{float right|'''このテキストはオフセットなしで右に浮かせています。'''}} 
<br>このテキストも浮動スパンの外側にあります。

出力結果：

このテキストは浮動スパンの外側にあります。 このテキストはオフセットなしで右に浮かせています。

このテキストも浮動スパンの外側にあります。

次に、オフセットを設定した例です

このテキストは浮動スパンの外側にあります。 
{{float right|offset=3em|'''このテキストは 3em のオフセットを付けて右に浮かせています。'''}} 
<br>このテキストも浮動スパンの外側にあります。

出力結果：

このテキストは浮動スパンの外側にあります。 このテキストは 3em のオフセットを付けて右に浮かせています。

このテキストも浮動スパンの外側にあります。

また、上下に等しい 2em のマージンを付けた例です

このテキストは浮動スパンの外側にあります。 
{{float right|'''このテキストは 3em のオフセットと、上下に 2em のマージンを付けて右に浮かせています。'''|offset=3em|2em}} 
<br>このテキストも浮動スパンの外側にあります。

出力結果：

このテキストは浮動スパンの外側にあります。 このテキストは 3em のオフセットと、上下に 2em のマージンを付けて右に浮かせています。

このテキストも浮動スパンの外側にあります。

{{right}} と {{float right}} の違い

このテンプレート {{float right}} は、テキストブロックを文の流れ（通常のテキストフロー）から外し、可能な限り右側に「浮かせ」ます。 揃え方自体は変わらず、他のテキストが画像や図のようにその周囲を回り込みます。 一方、{{right}} はテキストを通常のフロー内に残したまま、右端に沿って配置します。

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. このテキストは 右揃えで {{right}} によって配置されています。 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. このテキストは 右に浮かせて {{float right}} によって配置されています。 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

関連テンプレート

• {{float left}}
• {{float right/s}}
• {{block right}} — コンテンツ自体がブロック内で独自に整列する場合に使用
• {{block center}}

テキストブロックをページ右側に浮かせて配置します。

テンプレートパラメーター[テンプレートデータを編集]

このテンプレートは、パラメーターを1行で記述することが推奨されています。

パラメーター		説明	型	状態
内容	1 content	右に浮かせて配置するコンテンツ。	内容	省略可能
オフセット（右マージンからの距離）	offset 2	右マージンからのオフセット値。 既定 0 例 2em	不明	推奨
左側のマージン	4 gutter	浮動ブロックの左余白（ガター）。 既定 0 例 1em	短いテキスト	省略可能
上下のマージン	3	浮動ブロックの上下マージン。 既定 0 例 1em	短いテキスト	省略可能
スタイル	style	追加の CSS スタイル。	短いテキスト	省略可能
ID	id	CSS ID。	不明	省略可能

この解説は、テンプレート:Float right/docから呼び出されています。 (編集 | 履歴)
編集者は、このテンプレートをサンドボックス (作成 | 複製)とテストケース (作成)で試すことができます。（解説）
/docのサブページにカテゴリを追加してください。 このテンプレートのサブページ一覧。