Od provozovatele projektu Rychlost.CZ
WebDev.wiki > CSS > CSS vlastnosti a hodnoty

CSS vlastnosti a hodnoty

background

Background je CSS vlastnost, která přiřazuje HTML elementu určité vlastnosti jeho pozadí. Nastavuje se barva, obrázek, opakování a "chování" pozadí prvku. Jednotlivé vlastnosti se dají také použít samostatně.

border

Border slouží k definovaní okraje kolem HTML elementu. Okraj může mít různou tlouštku, styl a barvu.

border-collapse

Border-collapse definuje jednotné nebo nejednotné ohraničení pro buňky v HTML elementu table. Tzn. rámeček pro všechny sousedící buňky v tabulce buď jednotný nebo zdvojený.

border-spacing

CSS vlastnost border-spacing určuje vzájemnou vzdálenost buněk v tabulce.

bottom

CSS vlastnost bottom definuje umístění na souřadnici Y pozicovaného elementu, počítá se zdola. Elementy mohou být obecně pozicovány: top, bottom, left a right vlastnostmi. Nicméně vlastnost nefunguje není-li definována vlastnost ...

caption-side

CSS vlastnost caption-side nastavujeme umístění nadpisu HTML tabulky. Nadpis lze vložit pomocí tagu <caption>. Ten může být zobrazen buď nad tabulkou nebo pod ní. Vlastnost se dědí.

clear

CSS vlastnost clear určuje čekání na ukončení jiných obtékaných prvků. Tato vlastnost funguje pouze pokud předchozí nebo sousedící elementy mají definovanou vlastnost float. Obtékání se nastavuje vlastností float.

align-content

Vlastnost align-content zarovná flexibilní elementy podle vedlejší osy (tj osy kolmé na osu hlavní) pokud se okolo flexibilních elementů nachází volné místo. Vlastnost nemá vliv na flexibilní elementy, které nejsou zalomené na více než jeden řádek. V...

box-sizing

Vlastnost box-sizing určuje, zda je součástí šířky a výšky elementu i její vnitřní odsazení (padding) a okraj (border).

align-items

Vlastnost align-items umožňuje určovat řazení flexibilních elemetů podle vedlejší osy (tj podle osy kolmé na osu hlavní). Align-items by se dal přirovnat k CSS vlastnosti justify-content, pouze řadí elementy podle vedlejší osy. Vlastnost má efekt pou...

align-self

Vlastnost align-self se používá pro zarovnání specifického flexibilního elementu nehledě na vlastnost align-items nastavenou pro mateřský element. Vlastnost má efekt pouze na elementy, které jsou dceřinnými elementy elementu s display nastaveným na f...

clip

CSS vlastnost clip určuje viditelný výřez, přes který bude element vidět. Clip lze aplikovat pouze na elementy pozicované jako position:absolute nebo position:fixed.

flex

Vlastnost flex slouží jako zkratka pro udání hodnot flex-grow, flex-shrink a flex-basis. Určuje tedy zemnšování, růst a šířku flexibilního elementu. Vlastnost má efekt pouze na dceřinné prvky elementu s display vlastností nastavenou na flex nebo inli...

flex-basis

Vlastnost flex-basis určuje šířku flexibilního elementu. Vlastnost má efekt pouze na dceřinné prvky elementu s display vlastností nastavenou na flex nebo inline-flex.

flex-direction

CSS vlastnost flex-direction nastavuje směr flexibilních elementů. Tato vlastnost ovlivňuje pouze dceřinné elementy elementu s display hodnotou nastavenou na flex nebo inline-flex.

flex-flow

Vlastnost flex-flow je zkratkou pro vlastnosti flex-direction a flex-wrap. Lze tak pomocí jedné vlastnosti zapsat dvě vlastnosti najednou a ušetřit množství přenášených dat. Vlastnost má efekt pouze na dceřinné elementy elementu s display nastaveným ...

flex-grow

Vlastnost flex-grow určuje, kolikrát má flexibilní element vyrůst vůči ostatním flexibilním elementům. Vlastnost má efekt pouze na elementy, které jsou dceřinnými elementy elementu s display nastaveným na flex nebo inline-flex.

flex-shrink

Vlastnost flex-shrink určuje, jak se bude flexibilní element zmenšovat vůči ostatním flexibilním elementům, pokud to bude potřeba. Vlastnost má efekt pouze na elementy, které jsou dceřinnými elementy elementu s display nastaveným na flex nebo inline-...

flex-wrap

Vlastnost flex-wrap určuje, zda se mají flexibilní elementy webu zalamovat nebo ne. Vlastnost má efekt pouze na dceřinné elementy elementu s display hodnotou nastavenou na flex nebo inline-flex.

justify-content

Vlastnost justify-content vám pomůže zarovat vaše flexibilní prvky podle hlavní osy. Vlastnost má efekt pouze na elementy, které jsou dceřinnými elementy elementu s display nastaveným na flex nebo inline-flex.

order

CSS vlastnost order slouží k řazení flexibilních prvků na stránce. Vlastnost má efekt pouze na dceřinné prvky elementu s display vlastností nastavenou na flex nebo inline-flex.

border-radius

Border-radius určuje poloměr zakulacení rohů prvků.

box-shadow

Box-shadow umožňuje přidat stín pod prvek a to buď vnitřní stín a nebo vnější.

color

Color definuje barvu písma daného elementu. Pokud není barva písma elementu zadaná, záleží na prohlížeči, jaká bude, ale defaultně bývá černá. Barva písma je dědičná, takže např. stačí nastavit písma elementu "body" ...

text-shadow

CSS vlastnost text-shadow nastavuje stín textu.

content

CSS vlastnost content přidává před nebo za stylovaný prvek HTML obsah. Selektor pro vlastnost content se musí zapsat pomocí pseudotříd ::after a ::before. Vlastnost content je docela netradiční, protože narozdíl od všech jiných CSS vlastností um...

counter-increment

CSS vlastnost counter-increment definuje pojmenované počítadlo a při výskytu ho navýší, lze ho následně použít pomocí vlastnosti counter. Používá se při nastavování nadpisů a jeho číslování.

counter-reset

CSS vlastnost counter-reset resetuje pojmenované počítadlo, používá se, aby správně fungovala vlastnost counter-increment.

cursor

CSS vlastnost cursor definuje vzhled kurzoru myši při najetí na daný prvek nebo element.

direction

CSS vlastnost direction definuje směr toku textu či psaní.

display

CSS vlastnost display určuje zobrazení HTML elementu. Pro tabulkové zobrazení mají smysl akorát hodnoty table a table-cell.

empty-cells

CSS vlastnost empty-cells definuje zda se mají nebo nemají zobrazovat ohraničení a pozadí u prázdné buňky v tabulce.

float

CSS vlastnost float určuje obtékání HTML elementů. Daný prvek je "vyjmut" z toku textu a stává se z něj blokový element.

font

CSS vlastnost font určuje vlastnost písma a může určovat všechny css vlastnosti najednou.

font-family

CSS vlastnost font-family definuje použití fontů písma v dokumentu. Pokud je definován font, který u sebe nemáte nainstalovaný, prohlížeč použije další definovaný. Když font není v dokumentu definovaný, prohlížeč použije základní písmo daného systému...

font-size

CSS vlastnost font-size definuje velikost fontu písma. Udává se v jednotkách, ale i v definovaných konstantách a stupních.

font-style

CSS vlastnost font-style definuje styl písma. Skloněné (italic a oblique) a normální (normal). Přičemž hodnota oblique se skoro nepoužívá.

font-variant

CSS vlastnost font-variant definuje transformaci fontu, že velká písmena jsou zmenšena na malá písmena. Tzv. určuje kapitálky.

font-weight

CSS vlastnost font-weight definuje podporovaný řez písma. Základní jsou normální (normal), tučný (bold). Pak záleží na podpoře řezu písma u konkrétního, definovaného fontu.

height

CSS vlastnost height definuje výšku HTML elementu.

left

CSS vlastnost left definuje pozici prvku na ose x, počítáno zleva.

letter-spacing

CSS vlastnost letter-spacing definuje mezery mezi jednotlivými písmeny.

line-height

CSS vlastnost line-height definuje výšku řádku daného elementu či prvku.

list-style

CSS vlastnost list-style určuje všechny vlastnosti odrážek nebo číslování najednou. Jedná se o úspornější formu zápisu vzhledu odrážek a číslování.

list-style-image

CSS vlastnost list-style-image určuje orázek místo odrážky.

list-style-position

CSS vlastnost list-style-position určuje, jestli bude odrážka v textu nebo vedle něj.

list-style-type

CSS vlastnost list-style-type určuje vzhled odrážky nebo čísla seznamu.

margin

Vlastnost margin udává vzdálenost elementu od vnějšího okraje.

max-height

CSS vlastnost max-height definuje maximální výšku HTML elementu či prvku.

max-width

CSS vlastnost max-width definuje maximální šířku HTML elementu či prvku.

min-height

CSS vlastnost min-height definuje minimální výšku HTML elementu či prvku.

min-width

CSS vlastnost min-width definuje minimální šířku HTML elementu či prvku.

opacity

CSS vlastnost opacity definuje míru průhlednosti daného prvku či elementu.

orphans

CSS vlastnost orphans definuje minimální počet řádků, které mohou zůstat a být ponechány na předchozí stránce. Platí pro tisk nebo náhled před tiskem.

outline

Outline se zobrauje těsně vně rámečku (elementu border), pokud existuje. Outline má stejné hodnoty jako border. Outline narozdíl od border nezabírá žádný prostor, kreslí se přes okolní obsah.

outline-color

CSS clastnost outline-color určuje barvu elementu outline.

outline-style

Outline-style definuje styl elementu outline.

outline-width

CSS vlastnost elementu outline určující jeho tloušťku.

overflow

CSS vlastnost overflow definuje jak se bude chovat obsah, který vyteče z rozměru elementu či prvku.

padding

Vlastnost padding udává vzdálenost elementu od vnitřního okraje.

page-break-after

Vlastnost page-break-after definuje jak nebo zda vůbec se má při tisku za daným prvkem ukončit stránka.

page-break-before

Vlastnost page-break-before definuje jak nebo zda vůbec se má při tisku před daným prvkem ukončit stránka.

page-break-inside

Vlastnost page-break-inside definuje jak nebo případně zda vůbec se uvnitř elementu zalomí stránka.

position

CSS vlastnost position definuje způsob počítání polohy prvku nebo elementu. Position rozlišujeme na statickou, relativní, fixní a absolutní.

quotes

CSS vlastnost quotes definuje jak bude na webu prezentovan (interpretován) prvek <q> neboli citace v textu a zda bude obsahovat úvozovky potažmo jiné znaky definované v css.

right

CSS vlastnost right definuje pozici prvku na ose x, počítáno zprava.

table-layout

CSS vlastnost table-layout určuje způsob výpočtu šířky buněk.

text-align

CSS vlastnost text-align určuje zarovnání textu odstavce nebo jiného bloku.

text-decoration

CSS vlastnost text-decoration definuje dekorování (efekty) textu, jako je podtržení, přeškrtnutí atd.

text-indent

CSS vlastnost text-indent definuje míru odsazení prvního řádku odstavce od levého okraje bloku.

text-transform

CSS vlastnost text-transform definuje velikost písmen v daném elementu či prvku.

top

CSS vlastnost top definuje pozici prvku na ose y, počítáno shora.

unicode-bidi

CSS vlastnost unicode-bidi umožňuje obrátit tok textu v rámci prvku či elementu, jednoduše řečeno lze text zobrazit po písmenech odzadu.

vertical-align

CSS vlastnost vertical-align definuje jak bude element či prvek zarovnán na výšku.

visibility

CSS vlastnost visibility definuje zda daný prvek bude zobrazen nebo skryt.

white-space

CSS vlastnost white-space definuje princip způsobu práce s řádkovými zlomy.

widows

CSS vlastnost widows definuje minimální počet řádků, které mohou pokračovat na další (nové) stránce. Platí pro tisk nebo náhled před tiskem.

width

CSS vlastnost width určuje šířku elementu

word-spacing

CSS vlastnost word-spacing definuje mezery mezi jednotlivými slovy.

z-index

CSS vlastnost z-index definuje umístění prvku nebo elementu na ose z. Zjednodušeně řečeno určuje jaký prvek bude zobrazen v popředí a který naopak v pozadí (za jinými prvky či elementy).