# A Haladó fül beállításai

> A widgetek Haladó füle: elrendezés, mozgási hatások, átalakítás, háttér, szegély, maszk, reszponzív elrejtés, attribútumok és egyedi CSS.

A **Haladó** fül minden widgeten és konténeren ott van, és a **Tartalom** és a **Stílus** fül mellett a ritkábban használt, de erősebb beállításokat gyűjti. A panelen a szekciók sorrendje: **Elrendezés**, **Mozgási hatások**, **Átalakítás**, **Háttér**, **Szegély**, **Maszk**, **Reszponzív**, **Attribútumok** és **Egyedi CSS**.

![A Címsor widget Haladó füle, a szekciók összecsukva](./kepek/stilus-halado-ful.webp)

*A Címsor widget Haladó füle, a szekciók összecsukva* (https://minta-bolt.hu/wp-admin/post.php?post=24&action=elementor)

A képen a Címsor widget **Haladó** füle látszik, az **Elrendezés** szekció megnyitva.

## Elrendezés

Az **Elrendezés** szekció a térközöket, a méretet, a pozíciót és az azonosítókat tartalmazza. A beállításait (margó, padding, szélesség, saját igazítás, sorrend, méret, pozíció, Z-Index, CSS ID és osztályok) a [A konténer Haladó fülének beállításai](https://hub.hellowp.io/hu/plugins/elementor/kontenerek-halado-beallitasai/) fejezet írja le részletesen. Röviden:

| Beállítás | Mit csinál |
|---|---|
| **Margó** | Az elem külső helye PX, EM, REM vagy % egységben, négy oldalra külön. A pozitív érték térközt ad, a negatív csökkenti. |
| **Padding** | Az elem belső helye: a tartalom és az elem széle közti térköz. |
| **Szélesség** | **Teljes szélesség** (100%), **Beágyazott** (auto) vagy **Egyéni** (PX, % vagy VW). |
| **Saját elem igazítása** | Az elem igazítása a tárolóban: kezdet, közép, vég, alapvonal vagy nyújtott. Rugalmas tárolóban különösen hasznos. |
| **Sorrend** | Az elem helye a rugalmas tároló elemei között. A kisebb szám előbb jelenik meg. |
| **Méret** | A növekedés és zsugorodás: **Nincs**, **Növekedés**, **Zsugorítás** vagy **Egyéni** (egyéni növekedés és zsugorodás értékkel). |
| **Pozíció** | **Alapértelmezett** (a természetes folyás), **Abszolút** (az első pozicionált szülőhöz képest) vagy **Rögzített** (a böngészőablakhoz képest, görgetéskor is a helyén marad). Abszolút és rögzített pozíciónál megadhatod a vízszintes és függőleges tájolást (kezdet vagy vég), és az eltolást számmal. |
| **Z-Index** | Az egymásra rakódás sorrendje: a nagyobb érték előrébb kerül. Lásd: [Rögzített pozíció widgetekhez](https://hub.hellowp.io/hu/plugins/elementor/kontenerek-fix-pozicio/). |
| **CSS ID** | Egyedi azonosító, amellyel az elemre egyedi CSS-szabállyal vagy horgonylinkkel hivatkozhatsz. |
| **CSS-osztályok** | Egy vagy több egyedi osztály az elemhez, hogy egyedi CSS-ből stílust adhass neki. |

A **Megjelenítési feltételek** a tartalom láthatóságát a megadott feltételekhez köti.

## Mozgási hatások

![A Mozgási hatások szekció](./kepek/stilus-halado-mozgas.webp)

*A Mozgási hatások szekció* (https://minta-bolt.hu/wp-admin/post.php?post=24&action=elementor)

A szekcióban ezek a beállítások vannak:

- **Görgetési effektusok:** animációk és kölcsönhatások, amelyek akkor indulnak, amikor a látogató görgeti az oldalt. Bekapcsolva választhatsz a hatások közül. (Elementor Pro funkció.)
- **Egérhatások:** az egér mozgásához kötött hatások, például a döntés és a követés. Az elem az egér mozgására reagál. (Elementor Pro funkció.)
- **Tapadó:** a widget görgetés közben a képernyő szélén marad. Fejléc, lábléc vagy oldalsáv rögzítésére jó. (Elementor Pro funkció.)
- **Belépési animáció:** az elem animációval jelenik meg, amikor a látogató képernyőjén láthatóvá válik. Választhatsz például áttűnést, nagyítást, pattanást vagy fordulást. Az animáció akkor indul, amikor az elem láthatóvá válik.

## Átalakítás

![Az Átalakítás szekció](./kepek/stilus-halado-atalakitas.webp)

*Az Átalakítás szekció* (https://minta-bolt.hu/wp-admin/post.php?post=24&action=elementor)

Az **Átalakítás** szekció a **Normál** és a **Rámutatás** fülön külön állítható, így az elem az egérrel fölé mutatva is átalakulhat. A beállítások:

- **Forgatás:** az elem forgatása a középpontja körül fokban. A pozitív érték óramutató járásával megegyezően, a negatív azzal ellentétesen forgat.
- **Eltolás:** az elem eltolása a normál helyétől vízszintesen és függőlegesen.
- **Méretezés:** az elem méretének változtatása. Az 1-es érték az eredeti méretet jelenti.
- **Ferdítés:** az elem megdöntése a vízszintes és függőleges tengely mentén. Az X és Y értéket külön adhatod meg, a pozitív és a negatív érték ellenkező irányba dönt.
- **Vízszintes tükrözés:** az elem tükrözése a függőleges tengelyen, mintha tükörben látnád.
- **Függőleges tükrözés:** az elem tükrözése a vízszintes tengelyen.

## Háttér

![A Háttér szekció Normál és Rámutatás füllel](./kepek/stilus-halado-hatter.webp)

*A Háttér szekció Normál és Rámutatás füllel* (https://minta-bolt.hu/wp-admin/post.php?post=24&action=elementor)

A **Normál** és a **Rámutatás** fülön külön állítható, hogyan néz ki a háttér alapállapotban és egérrel fölé mutatva. A **Háttér típusa** lehet klasszikus (egyszínű vagy kép) vagy színátmenet. A háttértípusokról a [Háttér létrehozása](https://hub.hellowp.io/hu/plugins/elementor/stilus-hatter-tipusok/) fejezet szól.

## Szegély

![A Szegély szekció](./kepek/stilus-halado-szegely.webp)

*A Szegély szekció* (https://minta-bolt.hu/wp-admin/post.php?post=24&action=elementor)

A **Normál** és a **Rámutatás** fülön külön adható meg:

- **Szegély típusa:** nincs, folytonos, dupla, pontozott, szaggatott vagy barázda.
- **Sarkok lekerekítése:** minél nagyobb az érték, annál kerekebb a sarok.
- **Dobozárnyék:** árnyék az elem körül. Beállíthatod a színét, az elmosását, a kiterjedését és a helyzetét.

Részletek: [Szegély és sarkok lekerekítése](https://hub.hellowp.io/hu/plugins/elementor/stilus-szegely-es-lekerekites/).

## Maszk

![A Maszk szekció kikapcsolva](./kepek/stilus-halado-maszk.webp)

*A Maszk szekció kikapcsolva* (https://minta-bolt.hu/wp-admin/post.php?post=24&action=elementor)

A **Maszk** kapcsolóval megadhatod, hogy az elemnek csak egy alakzaton belüli része látszódjon. Bekapcsolva a következő beállítások jelennek meg:

- **Forma:** a listából választhatsz előre elkészített alakzatot (kör, virág, vázlat, háromszög, folt és hatszög), vagy az **Egyéni maszk** gombbal feltölthetsz saját alakzatot PNG vagy SVG formátumban. A maszkkal stílusos kialakítást adhatsz bármely elemnek, például képnek, videónak vagy Google Térképnek.
- **Méret:** **Illesztés**, **Kitöltés** vagy **Egyéni**.
- **Pozíció:** hol áll a maszk az elemen belül, például **Középen középen**, **Fent középen**, **Bal felső** vagy **Egyéni**.
- **Ismétlés:** hogyan ismétlődjön a maszk mintája: **Nincs ismétlés**, **Ismétlés**, **Vízszintes ismétlés**, **Függőleges ismétlés**, **Kerek** vagy **Térköz**.

Saját szövegmaszk készítéséről a [Egyéni szövegmaszk készítése](https://hub.hellowp.io/hu/plugins/elementor/stilus-szoveg-maszk/) fejezetben olvashatsz.

## Reszponzív

![A Reszponzív szekció az elrejtés kapcsolóival](./kepek/stilus-reszponziv-elrejtes.webp)

*A Reszponzív szekció az elrejtés kapcsolóival* (https://minta-bolt.hu/wp-admin/post.php?post=24&action=elementor)

Az elemet eszközönként elrejtheted:

- **Elrejtés Asztali gép esetén:** az elem nem látszik az asztali gépen böngésző látogatóknak.
- **Elrejtés Álló tájolású táblagép esetén:** az elem nem látszik álló tájolású táblagépen.
- **Elrejtés Álló tájolású mobil esetén:** az elem nem látszik álló tájolású mobilon.

Az elrejtésről részletesen: [Elemek megjelenítése vagy elrejtése eszközönként](https://hub.hellowp.io/hu/plugins/elementor/kontenerek-elrejtes-eszkozonkent/).

## Attribútumok

Az **Attribútumok** szekcióban egyedi HTML-attribútumokat adhatsz az elemhez „attribútum=érték” formában, például adatattribútumokat. Ezek bekerülnek a widget HTML-kimenetébe. (Elementor Pro funkció.)

## Egyedi CSS

Az **Egyedi CSS** szekcióba közvetlenül CSS-kódot írhatsz, amellyel felülírhatod vagy kiegészítheted az Elementor alap stílusait: színeket, méreteket, margót, paddinget és egyebeket. (Elementor Pro funkció.) A szekció használatára példát a [Linkek színének módosítása](https://hub.hellowp.io/hu/plugins/elementor/stilus-linkek-szine/) fejezetben találsz.