Készítsen kettős háttérképet
Ebben a leckében megmutatom, hogyan lehet kettős háttérképet létrehozni a CSS használatával.
Ezt a leckét az amerikai blogger készítette el www.SohTanaka.com. Az eredeti itt van.
Általában, ha feszített háttérképet készítünk a CSS használatával, rögzített méretű háttérképről kell képet készíteni, és ismételni azt X-szer, mielőtt a teljes oldalt vízszintesen feltöltenénk. Természetesen az ideális eredmény elérése érdekében a webhelyfejlécnek mindkét oldal hátterét össze kell ötvöznie.
Tipikus nyújtási technika
A képnek ez a része megismétlődik, amíg az oldal meg nem telik.
Példánkban olyan háttérképre van szükségünk, amelyet meg kell ismételni a sapkák bal és jobb oldalán. Hogyan érjük el ezt?
Kettős háttérkép technika
Mindkét rajzot (bal és jobb) meg kell ismételnünk e hatás elérése érdekében.
Sajnos a CSS jelenlegi verziója nem képes dupla háttérképekkel szembenézni. Remélem, hogy a jövőben ez megváltozik.
Dupla háttérhatás
A megoldás 2 ismétlődő kép használata (egy a jobb oldali és a bal oldalon).
A bal oldali duplikált képhez hozzáadunk háttérképet a címkéhez
. Ezután a jobb oldali probléma megoldásához további réteget adunk hozzászerv <>
Itt állítottuk be a hátteret a bal oldalon
#bg_wrap <>
Ezután létrehozzuk a második felét, hozzáadva az abszolút pozíciót, amelyet jobbra kell felhelyezni
.konténer
Ez az osztály lesz az összes tartalom tartálya. Itt határozzuk meg a szélességet, a háttérszínt, a középső igazítást és a "relatív" pozíciót.
Mindez készen áll! Sok szerencsét!

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!


Ha sokáig szeretné megtanulni a HTML-t, akkor remek híreket kaptam neked!

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.

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!