すべてのブラウザで Div 内のテキストの最後の行を両端揃えにするにはどうすればよいですか?

Div の最後の行を揃える

の最後の行のデフォルトのテキスト配置です。テキストの残りの部分が両端揃えであっても、多くの場合、左揃えになります。これは、特に美的または読みやすさの理由で最後の行を両端揃えにする必要がある場合にイライラする可能性があります。

クロスブラウザ ソリューション

最後の行を両端揃えにするには

IE6 を含むさまざまなブラウザーで、次の CSS を使用できます。

p, h1 {
  text-align: justify;
  text-align-last: justify;
}

p:after, h1:after {
  content: "";
  display: inline-block;
  width: 100%;
}

このメソッドは、text-align-last: justify; を組み合わせます。プロパティ。これは IE でサポートされており、:after 疑似コンテンツ メソッドのバリエーションとして使用されます。また、1 行のテキスト要素の後に追加された余分なスペースを削除する修正も含まれています。

One-Line Text Fix

If your

テキストが 1 行しか含まれていない場合は、次の CSS を使用して、前の解決策によって発生する可能性のある余分な空白行を防ぐことができます:

h1 {
  text-align: justify;
  text-align-last: justify;
  height: 1em;
  line-height: 1;
}

h1:after {
  content: "";
  display: inline-block;
  width: 100%;
}

追加リソース

Forより詳細な情報については、参照してください宛先:

• http://kristinlbradley.wordpress.com/2011/09/15/cross-browser-css-justify-last-line-paragraph-text/

以上がすべてのブラウザで Div 内のテキストの最後の行を両端揃えにするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。