CSS vlastnosti

Všechny články z kategorie

CSS backdrop-filter

CSS backdrop-filter

Vlastnost backdrop-filter dokáže uplatnit filtr pro pozadí elementu.

Jak funguje position: sticky

Jak funguje CSS position: sticky

CSS sticky posice umožňuje bez JS zafixovat element ke kraji okna při rolování.

Box-shadow

Box-shadow

Vlastnost box-shadow umí vytvořit CSS stín kolem elementu.

Zachování posice scrollování overflow-anchor

Zachování posice scrollování overflow-anchor

CSS vlastnost overflow-anchor umožňuje nastavit, jak si má prohlížeč pamatovat, kam bylo odscrollováno.

Kulaté rohy

Kulaté okraje v CSS

Jak vytvořit v CSS zaoblené okraje.

Object-fit

Object-fit

CSS vlastnost object-fit umí přizpůsobit obrázek pevné velikosti.

Text-decoration

Text-decoration

Vlastnost text-decoration slouží k „vyzdobení“ běžného textu.

Z-index

Z-index

K čemu je CSS vlastnost z-index a jak mít v jejím užívání systém.

Rychlost a náročnost transition: all

Výkon animací s transition: all

Je lepší psát transition: all, nebo vyjmenovávat vlastnosti, které se mají animovat?

CSS vlastnost appearance

CSS appearance

Systémový vzhled elementů pomocí CSS vlastnosti appearance.

Všechny CSS vlastnosti

Všechny CSS vlastnosti

Seznam (skoro) všech 207 CSS vlastností.

Přichytávací rolování v CSS

Přichytávací rolování v CSS

CSS vlastnost scroll-snap dokáže řídit rolování, aby přeskakovalo mezi jednotlivými elementy.

Vertical-align

CSS zarovnání vertical-align

Vertikální zarovnání řádku nebo buňky tabulky.

CSS výška height

CSS výška height

Nastavování výšky v CSS a proč ho raději nepoužívat.

Posicování v CSS

CSS vlastnost position

CSS rozlišuje statickou, relativní, absolutní a fixní posici. K čemu je co dobré?

Word-spacing

Word-spacing

CSS vlastnost word-spacing upravuje velikost mezer mezi slovy.

Odsazení prvního řádku text-indent

Odsazení prvního řádku text-indent

CSS vlastnost text-indent slouží k odsazení nebo předsazení prvního řádku.

Letter-spacing

Letter-spacing

CSS vlastnost letter-spacing upravuje vzdálenost mezi písmeny.

Column – obsah ve sloupcích

Vícesloupcový text a column

CSS vlastnost column umožňuje rozdělení textu do více sloupců.

Margin: auto

Psát margin: auto, nebo margin: 0 auto?

CSS konstrukce margin: auto se obvykle používá pro vodorovné centrování bloku.

Will-change

Will-change

CSS vlastnost will-change dá prohlížeči najevo, že se s elementem bude něco dělat.

Jak zakázat označování textu

Zakázání označování textu

Standardně jde na webu označovat text. Jak jeho výběru myší zabránit?

Image-rendering

Image-rendering

CSS vlastnost image-rendering ovlivňuje způsob, kterým se v prohlížeči zvětšují/zmenšují obrázky.

Styl seznamu list-style

Styl odrážkového seznamu

CSS vlastnost list-style upravuje vzhled seznamů <ul> a <ol>.

CSS zoom

Zvětšení a zmenšení v CSS

Jak v CSS zoomovat (zvětšovat a zmenšovat) elementy.

CSS mask

CSS vlastnost mask

Vlastnost mask dokáže vytvářet elementy s texturou nebo nepravidelnými tvary.

Box-reflect

Box-reflect

CSS vlastnost box-reflect umí vytvořit odraz celého boxu.

CSS filter

CSS filter

Jak vytvářet grafické filtry obrázků i jiných prvků na stránce.

Font

Font

CSS vlastnost font slouží k nastavení písma na stránce.

Font-feature-settings

Font-feature-settings

S CSS vlastností font-feature-settings lze dosáhnout zajímavější typografie u OpenType písem.

Text-align

Text-align

CSS vlastnost text-align nastavuje zarovnání písma.

Border-image

Border-image

CSS vlastnost border-image slouží k vytváření obrázkových rámečků.

Background-clip

Background-clip

CSS vlastností background-clip jde omezit místo, kde zobrazí obrázek na pozadí.

CSS cursor

Kursor myši

Jak pomocí CSS měnit kursor myši nebo si vytvořit kursor vlastní.

Oříznutí CSS clip

Oříznutí CSS vlastností clip

CSS vlastnost clip slouží k oříznutí obsahu elementu.

CSS blend

CSS blend

CSS vlastnost background-blend-mode slouží ke smíchání barvy s obrázkem.

Box-decoration-break

Box-decoration-break

Vlastnost box-decoration-break upravuje chování stylu elementu při zalomení řádku.

Text-shadow

Text-shadow

CSS vlastnost text-shadow přidává textu stín.

Flow

Flow

Vlastnosti flow-from a flow-into umožňují pohodlně přeskupovat obsah mezi elementy.

CSS display

CSS display

CSS vlastnost display ovlivňuje způsob vykreslování HTML elementu.

Text-stroke

Text-stroke

CSS vlastnost text-stroke vytváří okraj písmen podobně jako vlastnost border u boxů.

CSS counter

CSS counter

Automatické číslování v CSS za pomocí counter-increment, counter-reset a counter.

CSS content

CSS vlastnost content

CSS vlastnost content slouží k zapisování obsahu do stránky z kaskádových stylů.

Mezery mezi písmeny a slovy

Odsazení písmen a slov

Nastavení odsazení jednotlivých písmen (letter-spacing) a mezer mezi slovy (word-spacing).

Margin

Margin v CSS

CSS vlastnost margin slouží k vytvoření odsazení kolem elementu, který má margin nastavený.

Box-sizing

Box-sizing

CSS vlastnost box-sizing dokáže změnit vypočítávání rozměrů boxu.

CSS vlastnost all

CSS vlastnost all

Resetování CSS pravidel vlastností all.

CSS pointer-events

CSS pointer-events

Vlastnost pointer-events umožňuje zrušit reakci na události vyvolané myší.

CSS hyphens

CSS hyphens

Vlastnosti hyphens ovlivňuje rozdělování slov spojovníkem na konci řádku.

CSS tab-size

Šířka tabulátoru tab-size

Jak pomocí CSS změnit šířku tabulátoru ve zdrojovém kódu.

CSS quotes

Uvozovky v CSS

Vlastnost quotes umožňuje nadefinovat uvozovky, které se okolo značky objeví.

CSS resize

CSS resize

Možnost roztahovat element pomocí CSS vlastnosti resize.

Filtr blur

Rozmazání obsahu

Rozmazávání obsahu v různých prohlížečích.

CSS průhlednost (opacity)

Průhledný obsah v CSS

Pro zprůhlednění obsahu existují různé možnosti. Nejen CSS vlastnost opacity.

CSS animace

CSS vlastnost animation

Animování prvků na stránce pomocí čistého CSS s využitím @keyframes.

Float v CSS

Obtékání v CSS

Detailní popis obtékání (float) a clearování v CSS, stavba stránky pomocí obtékání, vysvětlení možných risik a úskalí.

Četnost CSS vlastností

Nejpoužívanější CSS vlastnosti

Žebříček CSS vlastností dle jejich četnosti na webových stránkách.

Rotace

Rotace obsahu

Napříč prohlížeči funkční řešení vytvoření svislého textu (otočeného o 90 stupňů).

Box model

Box model

Co je to a jaký box-model si vybrat. Jaké jsou výhody a nevýhody.

CSS flex

Flexboxy

Flexibilní stylování boxů je jednoduší a schopnější alternativa k obtékání (float), ale zatím hudba budoucnosti…

CSS transition

Animace v CSS pomocí transition

CSS vlastností transition lze na stránce docílit přechodových animací bez JavaScriptu.

CSS vlastnosti content a attr

Úprava obsahu pomocí content a attr

Pomocí CSS vlastnosti content a funkce attr lze ovlivňovat z CSS výsledný textový obsah webu.