# 117: Egyedi fejléc ajánlatokhoz - CSS-trükkök

Anonim

Az utolsó videó furcsa zavara után, hogy melyik fejlécet csináltuk valójában, ezúttal valóban az Ügyletek oldal egyéni fejlécét fogjuk megvalósítani! Ezt Meg Hunt csinálta.

Mint minden fejléc, mi is töltöttünk egy kis időt az eredeti fájlok megnézésével, és kitaláltuk, hogyan fog a legjobban ülni az oldalon. Kipróbálunk néhány lehetőséget, de végül úgy döntünk, hogy a legjobb egy zárt dobozba tenni (szemben a Demos fejléccel, ahol a fejléc a tartalom köré olvad.

Exportálásakor sokféle grafikus formátummal játszunk. Ez a sajátos stílus érdekes módon a PNG és JPG.webp minőségében és fájlméretében egyaránt megegyezik. 2000px szélességben adjuk ki, amelynek minden képernyőn jól kell kinéznie. Kb. 150 ezer találatot is elértünk, ami nagy, de egy ilyen hős számára egy jó célpont.

Kezdjük sorrendben beszerezni az ügyletek sablonját, beleértve annak megvizsgálását, hogy az egyes egyedi mezők az ügyletek miként véletlenszerűek, mielőtt kimenetre kerülnének. Több időt fogunk tölteni erre a jelölésre és minden későbbre, de mivel ebben a sablonban készítjük elő a dolgokat a fejléchez, akkor akár tisztíthatjuk is.

Számos különböző lehetőséget vizsgálunk az egyéni fejlécgrafika oldalra helyezésére. A háttérkép a legérzékenyebb, mivel szemantikát használunk

cím és kép pótlására. Használatával background-sizemegnézzük cover, de ez elvágásokat okozhat. Megnézzük a tartalmaz, de ez lehetővé teszi a helyet a külső. 100%csinálja a trükköt, de készítenünk kell egy képarányú stílusdobozt, hogy ez szépen működjön. Ez mindazonáltal egyszerű, csak a magasságot 0-ra tesszük, és egy százalékos felső párnázást használunk a működéshez (párnázott doboz).

Ez a hetedik egyéni fejléc, amelyet elvégeztünk, és mindegyikük másképp történt. Webdesign, mi? Milyen utazás.