XHTML + CSS – 20 lekcia – atribút class

Atribút “class” je veľmi dôležitá súčasť tvorby internetových stránok. Class umožňuje presne jednoducho a rýchlo špecifikovať jedno alebo niekoľko virtuálnych mien pre html tagy (značky) a tak výrazným spôsobom uľahčuje prácu s kaskádovými štýlmi (prácu s grafickým prevedením stránky).  Html atribút class môže byť použitý pri všetkých elementoch na stránke čo ale nie vždy potrebné. Výhodou tohto spôsobu označovania oproti označovaniu pomocou atribútu “id” je vlastnosť, že na jednej stránke môže byť naraz na niekoľko elementov použitá rovnaká trieda (class), kdežto pri “id” je (viac…)

XHTML + CSS – 19 lekcia – atribút id

Vždy keď na Vašej stránke potrebujete prispôsobovať pomocou kaskádových štýlov presne určený element a nechcete robiť Vašu stránku zastaralú spôsobom, že budete aplikovať CSS priamo v danom tagu. Presne vtedy je vhodné použiť HTML atribút “id” pomocou, ktorého jednoducho uvediete alternatívne meno pre Váš element, čím umožníte kvalitné prehľadné a rýchle prispôsobenie vzhľadu, funkcionality a pod. Vášho (viac…)

XHTML + CSS – 18 lekcia – div tag

V návode sa dozviete ako a prečo používať html tag <div> pri tvorbe internetových stránok. Funkcia div tagu je nesmierne dôležitá a obrovským spôsobom uľahčuje prácu programátorov pri tvorbe www stránok. Značka div sa najčastejšie používa na zoskupovanie viacerých html elementov, čo (viac…)

XHTML + CSS – 17 lekcia – Tabuľky (hlavička,telo a päta)

Jednoduchý návod ako rozdeliť tabuľku do troch častí, pričom každá umožňuje vlastné formátovanie pomocou CSS. Využitím tejto techniky je možné rýchle formátovanie troch blokov tabuľky a to hlavičky, tela a päty tabuľky. Rozdeľte Vaše tabuľky do troch základných častí a zjednodušte si tak prácu s CSS.

XHTML + CSS – Nastavenie pozadia na statické, fixované, alebo ukotvené

Ak neviete nastaviť pozadie na Vašej stránke tak aby bolo stále ukotvené na jednom mieste a pritom stránkou bolo možné posúvať hore a dolu, tak tento návod je práve pre Vás. Počas prezerania sa dozviete krok za krokom ako docieliť tento efekt.

Vo videu sa začína absolútne z prázdnej stránky takže sa nemusíte báť, že Vám niečo ujde. Ako finálny produkt dostávame základnú šablónu internetovej stánky do ktorej je možné ďalej bez problémov dopĺňať Vaše články, obrázky a podobne.

XHTML + CSS – 16. lekcia – Horizontalne polohovanie elementov

Návod zameraný na horizontálne zarovnanie obrázkov na stránke. Sú v ňom prezentované dva spôsoby ako je možné pomocou HTML a CSS upraviť polohu obrázku tak ako je potrebné. Videonévod prakticky rozširuje návod z 13. lekcie zameraný na vonkajšie a vnútorné posunutia (margin a padding).

XHTML + CSS – 13. lekcia – Posunutia Margin a Padding

Jednoduchý videonávod demonštrujúci použitie vonkajších a vnútorných posunutí, ohraničení pomocou CSS príkazov margin a padding.

Prostredníctvom video návodu sa dozvedáte o funkcii a použití  posunutí. Posunutie alebo ohraničenie je možné dvomi najpoužívanejšími spôsobmi a to vonkajím (margin) a vnútorným (padding).

XHTML + CSS – 12. lekcia – Button, Tvorba Horizontálneho menu

Postupne bola rozoberaná problematika tvorby jednoduchého tlačítka, alebo Buttonu.

Pre samotnú tvorbu tlačítka bol použitý predkreslený obrázok v striktnom formáte. Obrázok bol aplikovaný ako pozadie <a> tagu. Samotný tag odkazu bol postupne upravovaný tak aby bol dosiahnutý potrebný efekt.

Po úspešnom vykreslení tlačítka je vytvorený nezotriedený zoznam. Postupným upravovaním CSS tagov <ul> a <li> dostávame tvar jednoduchého horizontálneho menu.

Počas návodu je prezentovaný ďalší CSS príkaz to display a jeho funkcie.

XHTML + CSS – 11. lekcia – Tvorba menu – vzor Wikipedia

Za pomoci nezotriedeného zoznamu (tag <ul>) bolo vytvorené jednoduché menu. Ako vzor jednoduchého menu boli internetové stránky wikipédie. Jedná sa o ďalšiu nadstavbu nezotriedeného zoznamu, alebo skôr prezentovanie vlastnosti na ktorú sa zoznamy pri tvorbe internetových stránok veľmi často vyžívajú. (viac…)

XHTML + CSS – 8. lekcia – Google fonts, tvorba linajkovaného zošitu

Práca s Google Fonts

Implementovanie Google fonts do CSS na stránke a následné aplikovanie tohto fontu do odsekov a tým sa vytvára dojem napríklad písaného písma.

Práca s pozadím v elementoch HTML

Pomocou vybraného tagu <p> je demonštrovaná práca s pozadím aj v inom než <body> tagu. Čiže úprava pozadia je možná nie len pre celú internetovú stránku naraz, ale je možné nastaviť pre rôzne časti stránky rôzne pozadia.

Tvorba linajkovaného zošitu

V jednoduchom príklade je ukázaná práca s pozadím v odseku <p> spolu v kombinácii s Google Fonts sa docieli vzhľad podobný ručne písanému písmu v linajkovanom zošite.