hu en sv en hu it hu en hu de hu ja hu hu hu hu hu hu hu hu en hu hu hu hu en hu hu en fr hu hu hu en hu hu cs hu hu hu hu hu en hu hu en hu en hu cs en hu hu hu hu hu hu el hu hu cs en hu hu hu hu hu es es es tr en hu hu hu hu hu hu hu hu hu fr hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu hu en hu hu hu en hu it hu en hu de hu ja hu hu hu hu hu es es es tr en hu
HTML háttérkép beállítása (HTML background-image) - WEBiskola
Weboldalszerkesztő (HTML, CSS, JS kódszerkesztő) HTML-színkód generátor (Hexadecimális, RGB, HSL színkód kereső)
Tanulj meg minden információt a háttérkép beállításáról a HTML nyelvben.
Szinte minden HTML elemnek állíthatunk be háttérképet. De a leggyakrabban ezeknek szoktunk:
Háttérkép beállítása egy HTML elem számára
Ahhoz, hogy egy háttérképet adjunk egy HTML elemhez, a “style” tulajdonságot kell használnunk. Amelyet megadhatunk soron belül, illetve külső CSS fájlon keresztül is.
Code language: HTML, XML (xml)
Mással is működik, nemcsak div-vel. A szintaktika csak így nézhet ki, az url után zárójelek és aposztrófok közé helyezzük el a kép elérési útvonalát.
Háttérkép beállítása a teljes weboldal számára
Ha szeretnénk az egész weboldalnak egy háttérképet beállítani, akkor azt így tegyük meg:
Code language: HTML, XML (xml)
Ha a háttérkép túl kicsi, akkor a böngésző automatikusan beállítja, hogy a kép kitöltse az egész képernyőt, a kép ismételgetésével. Ha nekünk ez megfelel, akkor nincs teendőnk. Viszont, ha szeretnénk megtiltani az ismétlődést, akkor a kódot ki kell egészítenünk az alábbival:
background-repeat: no-repeat; Code language: HTTP (http)
background-image:url('KÉP.HELYE'); background-repeat: no-repeat; Code language: JavaScript (javascript)
Code language: HTML, XML (xml)
Felül láthatjátok, hogy mi történik, ha alapértelmezetten hagyjuk a képismétlést. A böngésző automatikusan feltölti a rendelkezésére álló helyet a kép ismételgetésével.
Alatta viszont az látható, hogy mi történik, ha megtiltjuk a böngésző számára, hogy megismételje a képet.
Ha a fentebb vázolt két megoldásból egyik sem tetszik, akkor lehetőségünk van a kép megnyújtására.
background-image:url('KÉP.HELYE'); background-size:100% 100%; Code language: JavaScript (javascript)
A kódunkat a “background-size:100% 100%;” résszel egészítettük ki, ahol meghatározzuk, hogy a háttérkép mérete, pontosabban a hossza és magassága 100% legyen. Azaz vegye fel a számára felvehető maximális méretet.
Code language: HTML, XML (xml)
Az első példán láthatod, hogy mekkora valójában a kép mérete. A második példa az első kép kis méretéből kifolyólag ilyen pixeles. Így szemléltethető kellőképpen, hogy valóban felnagyít, szétnyújt bármekkora méretű képet.
Ha hasznos volt számodra, akkor kérlek oszd meg másokkal is, hogy ezzel támogass minket!
HTML elemek: Minden, amit tudnod kell a HTML-elemekről
HTML alapok (A HTML webprogramozás alapjai)
Színek használata a HTML nyelvben (Színkódok használata)
#html #html background-image #html háttérkép #HTML ismeretek #html lecke #HTML lecke tanulás #HTML leckék #html magyar #html magyar nyelven #html magyar tananyag #html magyarul #html programozás #html tananyag #html tanulás #ingyenes html tananyag #magyar html #magyar nyelvű html tananyag #online html #online html tananyag #online html tanulás #webprogramozás alapjai #webprogramozás alapok
Mi az a HTML? (A HTML bemutatása)
HTML oldal felépítése, struktúrája (Miből áll egy HTML dokumentum?)
HTML szerkesztők (Milyen HTML szerkesztő programot használjak?)
HTML dokumentum készítése (Hogyan hozz létre olyan fájlt, amit a böngésző megtud jeleníteni)
HTML dokumentum szerkesztése, módosítása
Mi az a HTML TAG? A HTML elemek felépítése
HTML elemek: Minden, amit tudnod kell a HTML-elemekről
HTML alapok (A HTML webprogramozás alapjai)
Weboldalak forráskódjának megtekintése (Így nézd meg bármelyik oldal HTML kódját)
HTML TITLE használata (Oldal nevének megadása)
HTML címsorok (h1, h2, h3, h4, h5, h6)
HTML bekezdés (HTML p)
HTML pre használata – Hogy úgy jelenjen meg a szöveg, ahogy beírtad
Mi az a HTML span és hogyan kell használni? [HTML span útmutató]
HTML szövegszín, betűszín módosítása (HTML font color és color)
HTML háttérszín beállítása (background-color)
HTML szövegformázás (Formázás CSS nélkül)
HTML sortörés (HTML br)
HTML képek használata (HTML img)
HTML háttérkép beállítása (HTML background-image)
HTML karakterkódolás, karakterkészlet megadása (HTML meta charset)
HTML komment, azaz megjegyzés a HTML dokumentumba
HTML head – Mi megy a fej részbe?
HTML body – Mi megy a HTML törzsébe?
HTML stílus, stíluslap és CSS használata, avagy HTML style
[Színkódok] HTML színmegadási módok (Színmegadás RGB, RGBA, HEX, HSL és HSLA színkóddal)
Színek használata a HTML nyelvben (Színkódok használata)
HTML táblázat készítés (HTML table)
HTML hivatkozások, linkek (HTML a href)
HTML lista, felsorolás (HTML ol, ul, li)
HTML class – Minden, amit tudnod kell a HTML osztályokról
HTML id – Minden, amit tudnod kell a HTML azonosítóról
A HTML div elem használata
HTML űrlap elemei (HTML Forms)
Kliensoldali űrlapellenőrzés: űrlapmezők ellenőrzése HTML és JavaScript segítségével