A CSS segít nekünk a képek webalkalmazásokban való megjelenítésének szabályozásában. A képek vagy szövegek központosítása gyakori feladat a CSS-ben. A kép középpontba helyezéséhez be kell állítanunk az értékét margó-bal és margó-jobb nak nek auto és a segítségével blokk elemmé tegye kijelző: blokk; ingatlan.
int konvertálása karakterláncra
Ha a kép a div elemben van, akkor használhatjuk a szöveg igazítása: középre; tulajdonság a képnek a div közepére igazításához.
A Az elemet egy soron belüli elemnek nevezik, amely könnyen középre helyezhető a szöveg igazítása: középre; a CSS tulajdonságát az azt tartalmazó szülőelemhez.
Megjegyzés: A képet nem lehet középre igazítani, ha a szélesség 100%-ra van állítva (teljes szélesség).
Használhatjuk a gyorsírás tulajdonságot árrés és állítsa be auto a kép középre igazításához, nem pedig a margó-bal és margó-jobb ingatlan.
Nézzük meg, hogyan lehet középre igazítani egy képet az alkalmazással szöveg igazítása: középre; tulajdonságot a szülőeleméhez.
mi az az internet
Példa
Ebben a példában a képeket a segítségével igazítjuk szöveg igazítása: középre; ingatlan. A kép a div elemben található.
div { border: 2px solid red; } img{ height: 300px; width: 300px; } #center { text-align: center; } <img src="//techcodeview.com/img/css-tutorial/36/how-center-images-css.webp">Tesztelje most
Kimenet
Példa
Most a margó-bal: auto; margó-jobb: auto; és kijelző: blokk; tulajdonságait a kép középre igazításához.
body{ background-color: lightblue; } #image { display: block; margin-left: auto; margin-right: auto; border: 8px ridge blue; padding: 5px; }Tesztelje most
Kimenet