親divですべての子要素を中央に配置できることはわかっていますtext-align: center;
が、すべての子要素を中央に配置したくない場合はどうなりますか?たとえば、親に対して中央に配置された1つの子要素が必要です。
ラッパーdiv内にすべてがあるとします。いくつかのヘッダー、フォームなど。しかし、下部に、何かをクレジットするテキストの小さな行を中央に配置したいと思います。その階層がbody>div.wrapper>div.creditである場合、どうすればそれを達成できますか?
では、なぜここでCSSを複雑にしているのでしょうか。そのテキストをdivでラップし、text-align: center;
その特定のdivに使用するだけで、完了です。
また、CSS階層方式で宣言する場合は、これを使用してください
body div:last-child {
text-align: center;
}
注:中央に配置するテキストが、使用している最後のdivであることを確認してください。そうでない場合は、最後の子セレクターを使用しないでください。クラスを宣言することをお勧めします。
どのdivを中央に配置するかを指定するには、次のいずれかを指定します。
div {
text-align:/* whatever align for the rest */
}
div:credit {
text-align:center;
}