Základy CSS

Jak zrušit tečky kolem odkazu?

Když kliknete na blok, který má kolem sebe odkaz (cílí do nového okna), tak pokud se vrátíte do okna původního, tak daný blok má kolem sebe tečky. Jak je vyrušit?

Jak napozicovat obrázek v pozadí zprava o pár px?

Pokud potřebujete pozicovat obrázek v pozadí, tak využijete "background-position". Pokud obrázek potřebujete odsadit zleva o 30px, tak to bude například "background-position: 30px center", ale jak to udělat zprava?

Jak změnit vzhled kurzoru myši?

Je pro Vás šipka příliš tradičním ukazatelem Vaší myši? Chcete místo ní jiný tvar? Není nic jednodušího než si pohrát s CSS vlastností "cursor".

CSS3 zoom efekt obrázku v pozadí

Provést "zoom efekt" přímo na tag "img" je prosté, protože tím neovlivníte žádné další třídy (maximálně si musíte pohlídat obalovací div obrázku, aby měl "overflow: hidden;").

Pokud ovšem máte obrázek v pozadí ("background-image"), tak zoom na daný blok zvětší jak obrázek v pozadí, tak i veškerý další obsah bloku (tudíž si zvětšíte i veškeré fonty, bloky atd..). Z tohoto důvodu je třeba myslet i na HTML část a udělat daný obrázek v pozadí jako nezávislý blok.

Generátor CSS trojúhelníků

Vcelku častou potřebovou je vytvořit v CSS troojúhelníky. Nejsnadnější cesta je pomocí CSS vlastnosti "border", ale ideální stav je generátor. Kde jej najít?

jak vytvořit barevný přechod v okraji prvku

css3 gradient v border

Tvořit barevné přechody není složité, i na tomto webu je o nich článek, protože je lze generovat. Jenže jak je použít ve vlastnosti "border"? Lze to vůbec? A pokud ano tak jak?

První písmeno velké jako ve staré knize.

Ve starých knihách kapitoly začínaly výrazně velkým počátečním písmenek, které navíc bylo ještě překrásně vykresleno. Podobného efektu lze snadno docílit i v rámci webů. jak na to?

Deaktivace kliku na blok

Deaktivace může sloužit k tomu, že na klik máte napojednou nějakou Javascriptovou událost a vy i chcete deaktivovat. Tudíž si k danému bloku doplníte třídu například "deaktivuj_klik".
Ve chvíli, kdy budete chtít, aby klik na daný blok provedl danou událost, tak jen tuto třídu ("deaktivuj_klik") odeberete.

Je to rychlejší způsob než si ve skriptu plnit nějaké proměnné, které si budete po kliku kontrolovat zda již něco nastalo, či ne.

Parallax efekt bez použití Javascript/jQuery

Na Parallaxový efekt (rolujete stránkou dolů, ale určitý prvek roluje pomaleji => jede jinak) je mnoho řešení přez Javascript či jQuery, ale tento efekt lze udělat i přez "pouhé" CSS.

Jak automaticky vygenerovat stín bloku?

box-shadow

Samotná tvorba stínů kolem daného bloku (box-shadow) není složitá, ale i tak je dobré si ji nechat "vygenerovat". Důvod je ten, že u generování na webu vidíte rychle výsledek Vašich nastavení a "nerozptyluje" Vás grafika zbytku webu.