„Hlavička“alebo horná časť webovej stránky robí vašu stránku jedinečnou, umožňuje jej odlišovať sa od ostatných a odrážať špecifiká vášho internetového projektu. Pomocou originálnej a dobre urobenej hlavičky môžete zdobiť a vylepšovať ľubovoľné webové stránky. Aby ste si mohli hlavičku vyrobiť sami, musíte sa naučiť, ako tento webový prvok rozložiť.
Inštrukcie
Krok 1
Ak chcete, aby mali vaše stránky statické, stále rozmery, musíte vytvoriť statickú hlavičku, ktorá sa nezmení v závislosti od zmeny šírky obrazovky. Určte šírku a výšku hlavičky (napríklad 996x230) a vložte obrázok pozadia do horného bloku pomocou nasledujúceho kódu CSS, kde header-1.jpg
pozadie: # a6b7d3 url (img / header-1.jpg) no-repeat;
šírka: 996px;
výška: 230px;
} HTML kód hlavičky tohto typu bude vyzerať takto:
Krok 2
Ak je web zostavený takým spôsobom, že jeho rozmery sú prispôsobené šírke obrazovky, mala by sa hlavička nastaviť s prihliadnutím na všetky hlavné rozlíšenia monitora. Maximálna šírka takejto hlavičky by mala byť 1 920 pixelov. Na vloženie takejto hlavičky použite kód CSS: #header {background: # a6b7d3 url (img / header-2.jpg) no-repeat center; height: 250px;} HTML kód je v tomto prípade podobný predchádzajúcemu. Kód CSS bol v niektorých parametroch zmenený - teraz má atribút na vycentrovanie obrázka hlavičky, čo mu umožňuje prispôsobiť pozadie akejkoľvek šírke obrazovky.
Krok 3
Môžete tiež vytvoriť zložitejšiu hlavičku rozrezanú na niekoľko blokov pozadia, ktorá zmení svoju pozíciu v závislosti od veľkosti výrezu. CSS pre takúto hlavičku je zložitejšie a rozsiahlejšie a vyžaduje opakovanie niekoľkých prvkov na pozadí v súlade s plávajúcimi rozmermi okna prehliadača, v ktorom je možné zobraziť vaše stránky.
