☰

text-align center を使用して画像を中央揃えにしますか? 質問する

tag-icon • tag-icon html css
text-align center を使用して画像を中央揃えにしますか? 質問する

このプロパティは、text-align: center;CSS を使用して画像を中央に配置するのに適した方法でしょうか?

img {
    text-align: center;
}

ベストアンサー1

text-alignこのプロパティはインライン要素ではなくブロックコンテナに適用され、imgインライン要素であるため、これは機能しません。W3C仕様。

代わりにこれを使用してください:

img.center {
    display: block;
    margin: 0 auto;
}
<div style="border: 1px solid black;">
<img class="center" src ="https://cdn.sstatic.net/Sites/stackoverflow/company/img/logos/so/so-icon.png?v=c78bd457575a">

</div>

おすすめ記事