Igazítson és hozzon létre úszó képeket css, css segítségével
Az html összehangolásával a képeket elrendezheti és igazíthatja úgy, hogy egy bizonyos hely legyen az oldalon. A kép megjelenítésének módja határozza meg, hogy igazítja-e a képet vagy lebeg.
Az összehangolt képeket nem körbeveri a szöveg körül. Az igazítás a képet balra, jobbra vagy középre helyezi, és a szöveget a kép előtt és után helyezik el. Az igazítás egy kis üres helyet hagy a webhelyen.
A lebegő kép lehetővé teszi, hogy a szöveg magához térjen, mint egy rendszeres könyvben vagy újságban. A képeket vízszintesen lehet elhelyezni. Ez alkalmas a képek galériában való megjelenítésére. Az alábbiakban bemutatjuk, hogyan kell a CSS-hez lebegő képeket összehangolni.
Balra, jobbra és középre igazításra
A képek balra, jobbra és középre igazíthatók a div tag és a beépített CSS stílus között. A szöveg nem kerüli el azokat a képeket, amelyek tárolóeszközei a HTML szöveges igazítási tulajdonsággal rendelkeznek.
Bal összehangolás
Az alábbi kód igazítja a képet balra:

Központ összehangolása
A következő kód a kép központosítására szolgál:

Jobb összehangolás
A következő kód CSS-t tartalmaz a jobb oldali igazításhoz (HTML align right):

Lebegő képek a CSS használatával
Lebegő képek készítése lehetővé teszi a képek vízszintes elrendezését. A szöveg a kép körül folyik.
Tekerje a szöveget a bal oldali szöveggel

Fontos! A lebegő képek átfedik egymást, ha az úszó tulajdonság nincs törölve. Győződjön meg róla, hogy helyezi a kódot, hogy törölje az úszót minden olyan szakasz után, amelyikben a kép található. Itt van a kód az úszó tulajdonság értékének visszaállításához:
Szöveg wrap kép jobbra

Helyezze a képeket vízszintesen
Ez ugyanazt a HTML-igazítási kódot fogja használni. mint korábban (lásd alább). A képeket egyszerűen egymás után helyezzük el, hogy az illesztést vízszintesen hozzuk létre:

Az egymás után elhelyezett, lebegő képek remek módja a képek galériában való megjelenítésének. Ezzel egy cikk jelenik meg, amely a CSS használatával igazítja és állítja be a képeket.
A "CSS-hez igazítás és lebegés" c. Cikk fordítását a Saitostroenie projekt A-tól Z-ig terjedő barátságos csapata készítette el.