Články autora Redakce Interval.cz
Horizontální obrázkové menu
Klasické float-menu s obrázkovým pozadím a hover efektem. Za zmínku stojí zde použité vertikální vycentrování jednořádkového odkazu s využitím CSS vlastnosti height a line-height.
Simulace rámců 2
Pokud jste někdy chtěli skloubit výhody framu s výhodami CSS layoutu toto řešení by vám mohlo dopomoci ke kýženému cíli. Celý obsah webu je umístěn v jednom souboru, načte se tedy celá
Onclick menu bez reloadu i JS
Menu je zaměřeno na využití málo známé vlastnosti HTML odkazů. Opera si s tímto řešením příliš nerozumí, proto je zde použit hack, který způsobí zobrazení posuvníku. Ten je zde nežádoucí, ale
Vertikální dvouúrovňové obrázkové menu
Toto řešení využijeme, pokud chceme položky menu ozdobit obrázkovým pozadím. Využijeme CSS vlastnosti background-image a background-position.
Tečkovaný rámeček i pro IE
Toto řešení ukazuje, jak obejít chybu v Internet exploreru, který při malých tloušťkách zobrazuje tečkovaný okraj chybně jako čárkovaný.
Horizontální záložkové obrázkové menu
Toto řešení ukazuje, jak vytvořit působivé a plasticky působící horizontální menu, které využívá třech obrázků jako pozadí. Koncepce rozdělení obrázku na pozadí na tři části umožňuje mimo jiné využít i
Formátování tabulek
Toto řešení ukazuje běžné i méně obvyklé způsoby formátování tabulek. Zajímavá je například možnost formátovat sloupce tabulky.
Horizontální menu s šířkou nadřazeného bloku
Toto řešení ukazuje, jak vytvořit vizuálně jednoduché, ale efektní horizontální menu s šířkou přizpůsobující se šířce nadřazeného bloku.
Odrážkové horizontální menu
Toto řešení ukazuje, jak vytvořit jednoduché horizontální menu s odrážkami různých tvarů jakoby s efektem známých „tabů“. Jeho hlavní využití je v základní navigaci nebo u jednodušších layoutů.
Horizontalní menu se zvětšením
Toto řešení ukazuje, jak vytvořit horizontální menu s efektem zvětšení při najetí kurzoru myši. Jsou zde dva příklady jeden s použitím poloprůhledného obrázku jako stínu a druhý bez jakéhokoli obrázku.
Obsah dokumentu
Toto řešení ukazuje, jak vytvořit jednoduchý obsah dokumentu. Jako základu využívá tabulky a dolní podtržení jako vodící linku. Řešení je dále možno použít i jako jídelní lístek.
Vysouvací menu – rozcestník
Toto menu využijeme, pokud potřebujeme do navigace umístit velké množství odkazů, například na různé servery, které obsahují podkategorie.
Horizontalní stínované menu
Tento příklad ukazuje jednoduché horizontální menu s efektem stínu v textu odkazů. Menu je tvořeno pouze textem bez využití obrázků. Znak oddělující odkazy v řádku může být jednoduše nahrazen jiným.
Hrátky s okrajem textu
Někdy se může hodit poněkud netypické formátování plovoucích objektů v textu. Denně takové formátování můžeme vidět například v tištěných novinách. Toto řešení ukazuje, jak podobného efektu dosáhnout na webových stránkách pomocí CSS.