Css3 stílusok képekhez

Az előző leckek egyikében a jQuery bizonyította a megoldást arra a feladatra, hogy néhány böngészőben megjelenik az árnyék és a sugarak határainak helytelen megjelenítése egy képelem számára. A képet háttérként használják egy külső tároló számára, amelyre bármilyen stílus alkalmazható. Ez a lecke bemutatja azokat a képmódokat, amelyeket a háttérrel való trükk használatával kaphat.

Css3 stílusok képekhez
Css3 stílusok képekhez

A demóoldalon az első képsorozat nem használja a trükköt a háttérrel. Ha különböző böngészőkben nyitja meg, akkor láthatjuk, hogy egyeseknél a radiális határok és az árnyékok () hibásan vannak megjelenítve.

Css3 stílusok képekhez

A kép háttérként jelenik meg egy külső tároló számára, amelyre az összes szükséges stílus érvényes.

Dinamikus megoldás

A jQuery segítségével minden képelem dinamikusan konvertálható. Az alábbiakban olyan kód található, amely a kép egyes elemeit egy span-címkével borítja, és háttérként használja a képet.

A szkript eredményeként létrejön a következő HTML kód:

Az alábbiakban számos olyan stílust lehet használni, amelyet a projektekben felhasználhat felület vagy galéria létrehozásához.

Css3 stílusok képekhez
Css3 stílusok képekhez

Css3 stílusok képekhez

Az információk azonnali megszerzésére két csatorna (látás és hallás) révén a tanítás hatékonysága sokkal nagyobb, mint a könyvek tanulása. És a házi feladatok és az online tesztek lehetővé teszik, hogy folyamatosan gondolkodj a tanult nyelvben, és azonnal ellenőrizd a tudását!

Css3 stílusok képekhez

Css3 stílusok képekhez

Ha sokáig szeretné megtanulni a HTML-t, akkor remek hírekkel szolgálok neked!

Css3 stílusok képekhez

Ha már megtanulta a HTML-t, és tovább akar lépni, a következő lépés a CSS-technológia megtanulása.

Css3 stílusok képekhez

Ha azt szeretnénk, hogy megértsék a fogalmak domain és tárhely, megtanulják, hogyan kell létrehozni egy adatbázist, feltölteni a fájlokat a honlapon keresztül FTP szerver, hozzon létre aldomain konfigurálja a postaládákat a helyszínen, és ellenőrzi a részvétel, a tanfolyam kifejezetten az Ön számára!

Kapcsolódó cikkek