hu en sv en hu it hu en hu de hu ja hu hu hu hu hu hu hu hu it hu hu ceb hu en hu hu hu hu hu hu hu hu hu hu hu fr en en ceb hu hu hu hu cs en hu hu hu hu hu hu hu en hu hu cs en hu hu hu hu hu hu cs en hu hu hu hu hu hu cs en hu hu hu hu hu hu cs en hu hu hu 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 hu en hu it hu en hu de hu ja hu hu hu hu hu es es es tr en hu
CSS margó beállítása (CSS margin) - WEBiskola
Weboldalszerkesztő (HTML, CSS, JS kódszerkesztő) HTML-színkód generátor (Hexadecimális, RGB, HSL színkód kereső)
A CSS margin tulajdonság segítségével üresen hagyott területet hozhatunk létre az elemek körül. Ezt magyarul margónak nevezzük. A CSS segítségével személyre szabhatjuk az oldalunkon megjelenő margót.
Milyen értékeket vehet fel a margin?
Többféleképpen is megadhatjuk a margó értékeit. Nézzük ezeket a megoldásokat:
auto (ilyenkor a böngészőre bízzuk, hogy meghatározza a margót)
px (és a többi hosszmértékegység megadásával konkrétan meghatározhatjuk a margót)
% (ilyenkor a tartóelem méretéből számolja ki a megadott százalék figyelembevételével)
inherit (ebben az eseteben a margó mértékét a szülő elemtől örökli)
A margin értéke akár negatív is lehet.
Ahogy fentebb említettem lehetőségünk van minden egyes oldal esetében külön-külön meghatároznunk a margó méretét. A négy oldalra vonatkozó tulajdonságokat az alábbiak:
margin-*: ÉRTÉK; Code language: HTTP (http)
A * helyére kell behelyettesíteni a top, bottom, right vagy left értéket, attól függően, hogy melyik oldalra vonatkozólag szeretnénk margót meghatározni. Fontos, hogy nem szükséges az összes oldal margójának meghatározása. Az is elegendő, ha csak egy vagy két oldal margóját állítjuk meg.
p { margin-top: 50px; margin-bottom: 20px; margin-right: 70px; margin-left: 30px; } Code language: CSS (css)
>> Próbáld ki ezt a kódot az online weboldal szerkesztőnkben. <<
Margó meghatározása gyorsabb módszerrel
Nem szükséges külön-külön meghatározni az összes oldalra vonatkozó margóértéket. A fent említett négy tulajdonságot egybe is megadhatjuk az alábbi módszerrel.
margin: top right bottom left; Code language: HTTP (http)
Ebben az esetben elegendő a különálló oldalak margóit egymás után begépelnünk a fent látható sorrendben. (felső, jobb oldali, lenti, bal oldali)
p { margin: 50px 20px 70px 30px; } Code language: CSS (css)
>> Próbáld ki ezt a kódot az online weboldal szerkesztőnkben. <<
A fenti példán jól látszik, hogy az eredmény ugyanaz, mint az előző példa esetében. De itt még nincs vége: ha az utolsó értéket nem szeretnénk meghatározni, akkor nem kell beírni.
p { margin: 50px 20px 30px; } Code language: CSS (css)
>> Próbáld ki ezt a kódot az online weboldal szerkesztőnkben. <<
A fenti példában az utolsó értéket, ami a bal oldal nem határoztam meg, így egyszerűsíthettem és kihagyhattam a kódból.
p { margin: 50px 20px; } Code language: CSS (css)
>> Próbáld ki ezt a kódot az online weboldal szerkesztőnkben. <<
Ebben az esetben csak két értéket adtam meg, így a felső és alsó margó 50px lesz, míg a jobb és bal oldali 20px.
p { margin: 50px; } Code language: CSS (css)
>> Próbáld ki ezt a kódot az online weboldal szerkesztőnkben. <<
Ezzel a módszerrel mind a négy oldalra ugyanazt az 50px-es értéket fogja beállítani.
Ha hasznos volt számodra, akkor kérlek oszd meg másokkal is, hogy ezzel támogass minket!
CSS alapok (A CSS alapjainak összefoglalója)
A legfontosabb, legalapvetőbb CSS parancsok, utasítások
Mi az a CSS? A CSS bemutatása
#CSS #css kezdőknek #css magyar #css magyar nyelven #css margin #css margó #CSS programozás #css webprogramozás #magyar css #margin #margó #webfejlesztés #webprogramozás alapjai #webprogramozás alapok
Mi az a CSS? A CSS bemutatása
Mi az a CSS kijelölő, azaz szelektor? (CSS selector használata)
A legfontosabb, legalapvetőbb CSS parancsok, utasítások
CSS használatának, csatolásának módszerei
A CSS használata [CSS használati útmutató]
CSS komment, azaz megjegyzés használata (CSS comments)
Színek használata CSS segítségével (CSS colors)
Szövegszín beállítása CSS-ben (CSS color)
CSS háttérszín beállítása (CSS background-color)
CSS színátmenet (Lineáris és sugárirányú CSS gradient)
CSS háttérkép beállítása (CSS background-image)
Dőlt betű beállítása CSS-el (CSS italic)
Szöveg aláhúzás CSS segítségével (CSS underline)
CSS szövegformázás (Szövegszín, szövegigazítás, szövegátalakítás, szövegdekoráció, szövegárnyék, szöveg háttér)
CSS keretek, szegélyek használata (CSS border)
CSS margó beállítása (CSS margin)
CSS alapok (A CSS alapjainak összefoglalója)
CSS padding használata (CSS padding magyarul)
CSS hivatkozások, linkek formázása (HTML a elem formázása CSS segítségével)
CSS táblázat formázás (CSS table)
Gomb formázása CSS-el (CSS button)
CSS képigazítás (Kép igazítása középre, balra, jobbra CSS-el)
Reszponzív weboldal készítése (Viewport és CSS Media Query)
CSS pozíció (abszolút, relatív, rögzített, statikus, ragadós)
Mi az a z-index és hogyan kell használni?
CSS float használata (CSS úsztatás, lebegés)
CSS szélesség, magasság (width, height, max-width, max-height, min-width, min-height)
CSS fonts (betűkészlet, betűtípus, betűvastagság)