Rumah > Artikel > hujung hadapan web > Apakah atribut yang boleh digunakan dalam css untuk memusatkan imej secara mendatar?
Pemusatan mendatar imej boleh dicapai melalui jidar CSS atau sifat penjajaran teks. 1. Gunakan margin: 0 auto; untuk menetapkan margin kiri dan kanan untuk dikira secara automatik untuk mencapai pemusatan. 2. Tetapkan penjajaran teks bekas: tengah; dan paparan elemen imej: blok sebaris untuk memusatkannya sebagai elemen blok sebaris.
Atribut CSS untuk mencapai pemusatan mendatar imej
Dalam CSS, anda boleh mencapai pemusatan mendatar imej dengan menetapkan margin
atau text-align
sifat-sifat. margin
或text-align
属性来实现图片水平居中。
1. 使用margin属性
<code class="css">img { margin: 0 auto; }</code>
margin
属性设置图片元素的上下左右外边距。通过设置margin: 0 auto;
,将左右外边距设置为auto
,这意味着浏览器会自动根据容器的宽度计算左右外边距,从而实现图片水平居中。
2. 使用text-align属性
<code class="css">.container { text-align: center; } img { display: inline-block; }</code>
text-align
属性设置容器内元素的文本对齐方式。通过设置.container { text-align: center; }
,将容器的文本对齐方式设置为居中。再将图片元素设置为display: inline-block;
margin: 0 auto;
, margin kiri dan kanan ditetapkan kepada auto
, yang bermaksud bahawa penyemak imbas secara automatik akan mengira margin kiri dan kanan berdasarkan lebar bekas untuk mencapai imej mendatar. 🎜🎜🎜2 Gunakan atribut text-align🎜🎜rrreee🎜text-align
untuk menetapkan penjajaran teks elemen dalam bekas. Tetapkan penjajaran teks bekas ke tengah dengan menetapkan .container { text-align: center }
; Kemudian tetapkan elemen gambar kepada display: inline-block;
untuk menjadikannya elemen blok inline, dengan itu memusatkan gambar secara mendatar. 🎜Atas ialah kandungan terperinci Apakah atribut yang boleh digunakan dalam css untuk memusatkan imej secara mendatar?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!