Podcast
Questions and Answers
Jaké jsou dva hlavní obory typografie?
Jaké jsou dva hlavní obory typografie?
- Grafická úprava a font design
- Digitální typografie a tisková typografie
- Mikrotypografie a makrotypografie (correct)
- Webová typografie a klasická typografie
Která vlastnost určuje prioritu rodiny písem?
Která vlastnost určuje prioritu rodiny písem?
- font-weight
- font-style
- font-size
- font-family (correct)
Jaký styl písma má čisté linie bez malých tahů?
Jaký styl písma má čisté linie bez malých tahů?
- Serif
- Monospace
- Sans-serif (correct)
- Cursive
Jaký vzhled vytvářejí patková písma?
Jaký vzhled vytvářejí patková písma?
O jakou vlastnost se jedná, pokud se nastavuje tučnost písma?
O jakou vlastnost se jedná, pokud se nastavuje tučnost písma?
Které z následujících písmen se nepovažuje za generickou rodinu písem?
Které z následujících písmen se nepovažuje za generickou rodinu písem?
Jaký typ typografie se zaměřuje na umístění písma na stránce?
Jaký typ typografie se zaměřuje na umístění písma na stránce?
Jaký je mechanický vzhled, který se vytváří pomocí monospace písem?
Jaký je mechanický vzhled, který se vytváří pomocí monospace písem?
Jaký je účel vlastnosti border-spacing?
Jaký je účel vlastnosti border-spacing?
Jaké hodnoty může nabývat vlastnost empty-cells?
Jaké hodnoty může nabývat vlastnost empty-cells?
Co určuje vlastnost width, pokud je box-sizing nastavena na border-box?
Co určuje vlastnost width, pokud je box-sizing nastavena na border-box?
Jaká výchozí hodnota se používá pro vlastnost height?
Jaká výchozí hodnota se používá pro vlastnost height?
Co dělá vlastnost text-align s hodnotou justify?
Co dělá vlastnost text-align s hodnotou justify?
Jaká hodnota vlastnosti text-justify zajistí, že zarovnání textu bude vypnuto?
Jaká hodnota vlastnosti text-justify zajistí, že zarovnání textu bude vypnuto?
Jaký vliv má vlastnost min-width na chování prvku?
Jaký vliv má vlastnost min-width na chování prvku?
Jaké hodnoty mohou být přiřazeny vlastnosti height?
Jaké hodnoty mohou být přiřazeny vlastnosti height?
Jaký je efekt kladné hodnoty vlastnosti letter-spacing?
Jaký je efekt kladné hodnoty vlastnosti letter-spacing?
Jaké hodnoty může nabývat vlastnost word-spacing?
Jaké hodnoty může nabývat vlastnost word-spacing?
Jaká podmínka ovlivňuje hodnotu vlastnosti width?
Jaká podmínka ovlivňuje hodnotu vlastnosti width?
Jaký význam má procentuální hodnota pro vlastnost width?
Jaký význam má procentuální hodnota pro vlastnost width?
Jaký je účel vlastnosti text-indent?
Jaký je účel vlastnosti text-indent?
Jaká hodnota vlastnosti text-justify se snaží dosáhnout rovnováhy mezi výkonem a kvalitou?
Jaká hodnota vlastnosti text-justify se snaží dosáhnout rovnováhy mezi výkonem a kvalitou?
Jaká je hodnota text-indent, když je nastavena na 20px?
Jaká je hodnota text-indent, když je nastavena na 20px?
Co znamená hodnota inter-word u vlastnosti text-justify?
Co znamená hodnota inter-word u vlastnosti text-justify?
Jaká je funkce vlastnosti font-size-adjust?
Jaká je funkce vlastnosti font-size-adjust?
Které z následujících vlastností jsou součástí zkráceného zápisu vlastnosti font?
Které z následujících vlastností jsou součástí zkráceného zápisu vlastnosti font?
Jaký je primární účel vlastnosti font-variant-numeric?
Jaký je primární účel vlastnosti font-variant-numeric?
Jaký typ písma je považován za webové písmo?
Jaký typ písma je považován za webové písmo?
Jaké jsou preferované formáty pro webová písma?
Jaké jsou preferované formáty pro webová písma?
Co řídí vlastnost font-variant-ligatures?
Co řídí vlastnost font-variant-ligatures?
Jakým způsobem se vypočítává upravená velikost písma?
Jakým způsobem se vypočítává upravená velikost písma?
Co se stane, když není uvedena metrika pro velikost písma?
Co se stane, když není uvedena metrika pro velikost písma?
Jakou vlastnost používáme k nastavení maximální šířky prvku?
Jakou vlastnost používáme k nastavení maximální šířky prvku?
Která z následujících hodnot není platná pro vlastnost max-height?
Která z následujících hodnot není platná pro vlastnost max-height?
Co určuje vlastnost line-height?
Co určuje vlastnost line-height?
Jaká hodnota zabrání tomu, aby se šířka prvku zvětšila nad zadanou velikost v případě min-height?
Jaká hodnota zabrání tomu, aby se šířka prvku zvětšila nad zadanou velikost v případě min-height?
Která z následujících hodnot pro vlastnost max-width umožňuje využít veškerý dostupný prostor?
Která z následujících hodnot pro vlastnost max-width umožňuje využít veškerý dostupný prostor?
Jaká vlastnost nastavuje minimální výšku prvku?
Jaká vlastnost nastavuje minimální výšku prvku?
Jakou hodnotu může nabývat vlastnost max-width kromě délky a procenta?
Jakou hodnotu může nabývat vlastnost max-width kromě délky a procenta?
Jaký je účel vlastnosti none v kontextu maximální šířky a výšky?
Jaký je účel vlastnosti none v kontextu maximální šířky a výšky?
Jaké hodnoty může mít vlastnost outline-color?
Jaké hodnoty může mít vlastnost outline-color?
Jaký je účel vlastnosti outline-width?
Jaký je účel vlastnosti outline-width?
Co se děje s obrysy u víceřádkového textu v závislosti na prohlížeči?
Co se děje s obrysy u víceřádkového textu v závislosti na prohlížeči?
Která z následujících hodnot není možnou hodnotou vlastnosti outline-style?
Která z následujících hodnot není možnou hodnotou vlastnosti outline-style?
Jaké jsou možné hodnoty pro vlastnost outline-offset?
Jaké jsou možné hodnoty pro vlastnost outline-offset?
Proč se obrysy nevykreslují v rámci rámce ohraničení?
Proč se obrysy nevykreslují v rámci rámce ohraničení?
Jaký je význam nastavení vlastnosti resize?
Jaký je význam nastavení vlastnosti resize?
Jakým způsobem může být definována vlastnost outline?
Jakým způsobem může být definována vlastnost outline?
Flashcards
Rodina písem (font-family)
Rodina písem (font-family)
Prioritní seznam názvů písem pro webový prohlížeč.
Generická rodina písem
Generická rodina písem
Obecný typ písma (např. sans-serif, serif).
Serif písmo
Serif písmo
Písmo s patkami na koncích písmen.
Sans-serif písmo
Sans-serif písmo
Signup and view all the flashcards
Monospace písmo
Monospace písmo
Signup and view all the flashcards
Kurzívní písmo (cursive)
Kurzívní písmo (cursive)
Signup and view all the flashcards
Fantasy písmo
Fantasy písmo
Signup and view all the flashcards
Vlastnost font-weight
Vlastnost font-weight
Signup and view all the flashcards
Vlastnost text-align
Vlastnost text-align
Signup and view all the flashcards
Hodnota text-align: justify
Hodnota text-align: justify
Signup and view all the flashcards
Hodnota text-align: auto
Hodnota text-align: auto
Signup and view all the flashcards
Vlastnost text-justify
Vlastnost text-justify
Signup and view all the flashcards
Hodnota text-justify: none
Hodnota text-justify: none
Signup and view all the flashcards
Hodnota text-justify: auto
Hodnota text-justify: auto
Signup and view all the flashcards
Vlastnost word-spacing
Vlastnost word-spacing
Signup and view all the flashcards
Vlastnost letter-spacing
Vlastnost letter-spacing
Signup and view all the flashcards
Vlastnost font-size-adjust
Vlastnost font-size-adjust
Signup and view all the flashcards
Hodnota „none“ u font-size-adjust
Hodnota „none“ u font-size-adjust
Signup and view all the flashcards
Hodnota „metrika a číslo“ u font-size-adjust
Hodnota „metrika a číslo“ u font-size-adjust
Signup and view all the flashcards
Hodnota „from-font“ u font-size-adjust
Hodnota „from-font“ u font-size-adjust
Signup and view all the flashcards
Vlastnost font-variant
Vlastnost font-variant
Signup and view all the flashcards
Vlastnost font
Vlastnost font
Signup and view all the flashcards
Vlastnost max-width
Vlastnost max-width
Signup and view all the flashcards
Webové písmo
Webové písmo
Signup and view all the flashcards
Hodnota 'none' u max-width
Hodnota 'none' u max-width
Signup and view all the flashcards
Formáty webových písem
Formáty webových písem
Signup and view all the flashcards
Hodnota 'max-content' u max-width (nebo min-width)
Hodnota 'max-content' u max-width (nebo min-width)
Signup and view all the flashcards
Hodnota 'min-content' u max-width (nebo min-width)
Hodnota 'min-content' u max-width (nebo min-width)
Signup and view all the flashcards
Hodnota 'fit-content' u max-width (nebo min-width)
Hodnota 'fit-content' u max-width (nebo min-width)
Signup and view all the flashcards
Vlastnost min-height
Vlastnost min-height
Signup and view all the flashcards
Vlastnost max-height
Vlastnost max-height
Signup and view all the flashcards
Vlastnost line-height
Vlastnost line-height
Signup and view all the flashcards
Obrys
Obrys
Signup and view all the flashcards
Vlastnost outline
Vlastnost outline
Signup and view all the flashcards
outline-color
outline-color
Signup and view all the flashcards
outline-width
outline-width
Signup and view all the flashcards
outline-style
outline-style
Signup and view all the flashcards
outline-offset
outline-offset
Signup and view all the flashcards
resize
resize
Signup and view all the flashcards
Agenti často vykreslují obrysy na prvcích ve stavu :focus.
Agenti často vykreslují obrysy na prvcích ve stavu :focus.
Signup and view all the flashcards
Vodorovná a svislá mezera mezi buňkami tabulky
Vodorovná a svislá mezera mezi buňkami tabulky
Signup and view all the flashcards
Zobrazení prázdných buněk
Zobrazení prázdných buněk
Signup and view all the flashcards
Co je 'width'?
Co je 'width'?
Signup and view all the flashcards
Nastavení šířky prvku
Nastavení šířky prvku
Signup and view all the flashcards
Co je 'height'?
Co je 'height'?
Signup and view all the flashcards
Nastavení výšky prvku
Nastavení výšky prvku
Signup and view all the flashcards
Co je 'min-width'?
Co je 'min-width'?
Signup and view all the flashcards
Co je 'box-sizing'?
Co je 'box-sizing'?
Signup and view all the flashcards
Study Notes
Písmo v CSS
- Práce s písmem v CSS je popsána v modulu „CSS Fonts Module Level 3“.
- Znak (character) – nejmenší složka psaného jazyka s sémantickou hodnotou. Není konkrétním vykreslením. Nejčastěji se používá standard Unicode s kódy pro znaky.
- Glyf (glyph) – konkrétní vizuální reprezentace znaku. Může jeden znak reprezentovat více glyfů nebo jeden glyf vícero znaků (např. ligatury).
- Font (písmo) – sada znaků jedné velikosti a stylu. Obsahuje glyfy mapované na znaky.
- Rodina písma (font family) – skupina řezů jednoho typu písma. Řez je grafickou variantou (např. tučné, kurzíva). Některá písma mají pouze jeden řez. Rodina písma zajišťuje jednotný vzhled.
- Řez písma (font-weight) – typ řezu, který slouží k zvýraznění textu. Může být kurziva, polotučný, tučný apod.
- Grafém (grapheme) – nejmenší nedělitelná jednotka v pravopisu konkrétního jazyka. Často synonymum pro znak.
- Kapitálky (capitals) – menší verzále (velká písmena).
Vlastnosti CSS pro písma
font-family: Určuje prioritní seznam rodin písem. (např.Helvetica, Verdana, sans-serif).font-weight: Nastavuje tučnost písma (od 100 - Thin do 900 - Black), např.bold,normal.font-style: Určuje styl písma (normal,italic,oblique).font-size: Nastavuje velikost písma. Lze použít jednotky jakopx,em,%.font-stretch: Nastavuje šířku písma (normal,condensed,expanded).font-size-adjust: Umožňuje optimalizovat poměr mezi velkými a malými písmeny v textu.font-variant: Řídí alternativní glyfy pro specifické symboly (normal,small-caps,lining-nums,oldstyle-nums).letter-spacing: Nastavuje mezeru mezi písmeny.word-spacing: Nastavuje mezery mezi slovy.white-space: Spravuje, jak je bílý prostor v prvku interpretován (normal,pre-wrap,nowrap).text-align: Nastavuje zarovnání textu (left,right,center,justify).text-decoration: Dekorace textu (underline,overline,line-through).text-transform: Nastavuje transformaci písmen (none,capitalize,uppercase,lowercase,full-width).text-indent: Nastavuje odsazení prvního řádku.table-layout: Nastavuje způsob rozložení buněk v tabulce (auto,fixed).border-collapse: Určuje, zda se okraje buněk v tabulce sloučí (collapse,separate).border-spacing: Nastavuje rozestup mezi okraji buněk v tabulce.empty-cells: Nastavuje zobrazování prázdných buněk v tabulce (show,hide).
Písmo
- Fonty mohou být v různých formátech (např. WOFF, TTF, OTF).
Uživatelské rozhraní
- Vlastnost
box-sizing: Definuje, jak se počítá celková šířka a výška prvku (content-box,border-box). - Vlastnost
cursor: Nastavuje typ kurzoru pro prvek.
Vizuální efekty
- Přetečení – nastavení chování obsahu, který přetéká rámeček prvku (
visible,hidden,clip,scroll). - Maskování – částečné nebo úplné skrytí obsahu pomocí masky (
mask). - Ořezávání – definování oblasti pro zobrazení obsahu (
clip-path).
Tabulky CSS
- Definují strukturu a styly tabulek.
table-layout: určuje způsob výpočtu šířky a výšky sloupců a řádků (auto,fixed).border-collapse: sloučí okraje buněk v tabulce.border-spacing: nastavení rozestupu me-zi okraji buněk.
Studying That Suits You
Use AI to generate personalized quizzes and flashcards to suit your learning preferences.
Related Documents
Description
V tomto kvízu se zaměříme na základní koncepty spojené s písmem v CSS podle modulů CSS Fonts Module Level 3. Prozkoumáme pojmy jako znak, glyf, font a rodina písma, které jsou klíčové pro efektivní práci s textem na webových stránkách.
