Písmo v CSS: Základní termíny

Choose a study mode

Play Quiz
Study Flashcards
Spaced Repetition
Chat to Lesson

Podcast

Play an AI-generated podcast conversation about this lesson

Questions and Answers

Jaké možnosti poskytuje vlastnost overflow-wrap pro žádané chování zalamování textu?

  • normal, anywhere, break-word (correct)
  • normal, break-line, wrap-words
  • nowrap, wrap, auto
  • soft, hard, normal

Jaká je funkce vlastnosti pre-wrap?

  • Odstraňuje všechny nové řádky.
  • Zabraňuje přetečení obsahu.
  • Zalomení řádků se nastavení jen na prvním znaku.
  • Zachovává sekvence prázdného místa. (correct)

Jaký význam má hodnota 'justify-all' ve vlastnosti text-align?

  • Zarovnání textu doleva
  • Zarovnání textu na střed
  • Zarovnání textu do bloku včetně posledního řádku (correct)
  • Zarovnání textu doprava

Která hodnota vlastnosti tab-size se používá pro nastavení šířky tabulátorů?

<p>Délka (C)</p> Signup and view all the answers

Jaká hodnota overflow-wrap umožňuje přerušený text kdykoli během obsahu?

<p>anywhere (C)</p> Signup and view all the answers

Jak se chová vlastnost text-align pro hodnotu 'end' ve směru zprava doleva?

<p>Zarovná text vlevo (B)</p> Signup and view all the answers

Jaká je funkce vlastnosti word-break?

<p>Určuje, zda se zalomí řádek při přetečení textu. (B)</p> Signup and view all the answers

Jaké hodnoty může nabývat vlastnost line-break?

<p>normal, strict, auto, loose (D)</p> Signup and view all the answers

Jakou funkci má vlastnost text-align-last?

<p>Nastavení zarovnání posledního řádku před zalomením (C)</p> Signup and view all the answers

Co dělá vlastnost hyphens?

<p>Automaticky vkládá pomlčky do slov pro správné dělení. (B)</p> Signup and view all the answers

Která hodnota pro text-align zajišťuje úplné zarovnání textu do bloku?

<p>justify (B)</p> Signup and view all the answers

Jaký efekt má vlastnost break-spaces?

<p>Je stejná jako pre-wrap, ale s výjimkami. (B)</p> Signup and view all the answers

Jaký efekt má hodnota 'normal' u vlastnosti overflow-wrap?

<p>Povoluje dělení řádků pouze v normálních bodech zlomu (A)</p> Signup and view all the answers

Jak se hodnoty keep-all a break-all liší ve vlastnosti word-break?

<p>keep-all zabraňuje zalomení pro všechny jazyky, break-all vždy zlomy provede. (B)</p> Signup and view all the answers

Jaké hodnoty má vlastnost text-align podle směru textu?

<p>start, end, match-parent (C)</p> Signup and view all the answers

Co znamená hodnota auto ve vlastnosti line-break?

<p>Používá výchozí pravidlo pro zalomení řádků. (A)</p> Signup and view all the answers

Jaká vlastnost CSS se používá k nastavení barvy obrysu prvku?

<p>outline-color (A)</p> Signup and view all the answers

Jaké hodnoty může nabývat vlastnost outline-width?

<p>thin, medium, thick (B)</p> Signup and view all the answers

Co se stane s obrysy, když se v dokumentu používá víceřádkový text?

<p>Obrys se vykreslí pouze jednou pro celý blok textu. (B), Všechny řádky budou mít obrys zvlášť. (D)</p> Signup and view all the answers

Jaký význam má vlastnost outline-offset?

<p>Nastavuje vzdálenost mezi obrysem a okrajem prvku. (C)</p> Signup and view all the answers

Který z následujících stylů není platnou hodnotou pro outline-style?

<p>large (D)</p> Signup and view all the answers

Jakou funkci má vlastnost resize v CSS?

<p>Umožňuje měnit velikost prvku a jeho směr. (D)</p> Signup and view all the answers

Jaký důvod je uveden pro nepřesně definovaný tvar obrysu?

<p>Zajišťuje lepší uživatelský prožitek na platformě. (A)</p> Signup and view all the answers

Jakým způsobem se chová vlastnost width, pokud je box-sizing nastavena na border-box?

<p>Nastaví šířku včetně okraje. (B)</p> Signup and view all the answers

Jaké hodnoty může nabývat vlastnost empty-cells?

<p>show a hide (B)</p> Signup and view all the answers

Co se stane, když zadáte jednu délku pro border-spacing?

<p>Nastaví se jak horizontální, tak vertikální rozestup. (B)</p> Signup and view all the answers

Jaké hodnoty může mít vlastnost height?

<p>auto, procento, délka, initial a inherit (A)</p> Signup and view all the answers

Jaký efekt má vlastnost min-width?

<p>Zabraňuje zmenšení délky pod zadanou hodnotu. (A)</p> Signup and view all the answers

Jaké hodnoty může nabývat vlastnost 'vertical-align'?

<p>top, middle, bottom (C)</p> Signup and view all the answers

Jaký je výchozí režim pro vlastnost width?

<p>dynamický a závislý na obsahu (D)</p> Signup and view all the answers

Co znamená hodnota inherit pro vlastnost width?

<p>Šířka bude zděděna z nadřazeného prvku. (A)</p> Signup and view all the answers

Co se děje, když není uvedena jednotka pro číslo v CSS?

<p>Jedná se o bezrozměrné číslo. (C)</p> Signup and view all the answers

Jaký je výchozí box model pro vlastnost 'box-sizing'?

<p>content-box (D)</p> Signup and view all the answers

Jak se chová barva buněk nastavená na show u vlastnosti empty-cells?

<p>Okraje a pozadí se budou zobrazovat. (C)</p> Signup and view all the answers

Jaký je účel obrysů v CSS?

<p>Obrysy mohou sloužit jako vizuální prvek kolem objektů. (A)</p> Signup and view all the answers

Co dělá hodnota 'border-box' u vlastnosti 'box-sizing'?

<p>Zahrnuje obsah, ohraničení a padding do celkové šířky a výšky. (C)</p> Signup and view all the answers

Jaké hodnoty mohou být použity v rámci vlastnosti 'vertical-align' pro zarovnání textu?

<p>baseline, text-top, bottom (C)</p> Signup and view all the answers

Jaká hodnota způsobí, že přetečený obsah nebude oříznut a bude viditelný mimo rámeček?

<p>visible (C)</p> Signup and view all the answers

Jaká je hlavní funkce modulu 'CSS Basic User Interface Module Level'?

<p>Popisovat vlastnosti CSS pro stylizaci UI. (D)</p> Signup and view all the answers

Jaké hodnoty může nabývat vlastnost overflow-clip-margin?

<p>border-box, padding-box, length (A)</p> Signup and view all the answers

Co se stane, pokud je vlastnost overflow nastavena na 'auto'?

<p>Scrollbar se zobrazuje pouze když obsah přetéká. (D)</p> Signup and view all the answers

Jakým způsobem se liší obrys od ohraničení?

<p>Obrysy nezabírají místo kolem objektu. (B)</p> Signup and view all the answers

Jak se nastavují hodnoty overflow-x a overflow-y, pokud je zadaná pouze jedna hodnota overflow?

<p>Obě hodnoty se nastaví na stejnou hodnotu. (C)</p> Signup and view all the answers

Jak působí vlastnost scroll-behavior s hodnotou 'smooth'?

<p>Posouvá plynule podle nastavení uživatele. (D)</p> Signup and view all the answers

Co znamená, když je hodnota overflow-clip-margin vynechána?

<p>Použije se výchozí hodnota padding-box. (B)</p> Signup and view all the answers

Jaká hodnota pro overflow způsobí, že scrollbar bude skryt, dokud není obsah přetékající?

<p>auto (C)</p> Signup and view all the answers

Jaký vliv má záporná hodnota pro overflow-clip-margin?

<p>Způsobí chybu a nebude akceptována. (C)</p> Signup and view all the answers

Flashcards

Vlastnost tab-size

Určuje šířku tabulátorů v pixelech (nebo násobcích mezer).

Hodnoty tab-size

Může být číslo (násobek mezery) nebo délka (v pixelech).

Vlastnost word-break

Určuje, jak se slova zalomí na koncích řádků.

Hodnota word-break: normal

Používá výchozí pravidla pro zalomení slov.

Signup and view all the flashcards

Hodnota word-break: break-all

Slova se zalomí kdekoliv, aby se zabránilo přetečení.

Signup and view all the flashcards

Vlastnost line-break

Ovlivňuje zalomení řádků CJK textu (čínský, japonský, korejský).

Signup and view all the flashcards

Hodnota line-break: auto

Používá výchozí pravidla pro zalomení CJK textu.

Signup and view all the flashcards

Vlastnost hyphens

Určuje, jak se slova dělí při zalomení na více řádků.

Signup and view all the flashcards

Vlastnost line-height

Nastavuje výšku řádku v textu. Může nabývat hodnot jako normal, číslo, procento, délka, bezrozměrné číslo. Normal se nastaví na základě uživatelského agenta.

Signup and view all the flashcards

Vlastnost outline

Definuje vizuální obrys kolem prvků, jako jsou tlačítka, textová pole nebo mapy. Nezabírá místo a liší se od borderu.

Signup and view all the flashcards

Modul CSS Basic User Interface Module

Specifikuje vlastnosti CSS pro stylovaní uživatelského rozhraní. Rozšiřuje funkce z CSS 2.1 a umožňuje ovlivňovat prvky uživatelského rozhraní.

Signup and view all the flashcards

border-spacing

Nastavuje horizontální a vertikální rozestup mezi buňkami v tabulce. Můžete zadat jednu hodnotu pro stejný rozestup v obou směrech, nebo dvě hodnoty pro různé rozestupy.

Signup and view all the flashcards

empty-cells

Určuje, zda se okraje a pozadí zobrazí kolem buněk v tabulce, které nemají žádný viditelný obsah.

Signup and view all the flashcards

width

Nastavuje šířku prvku. Výchozí hodnota auto automaticky stanoví šířku. Můžete zadat hodnotu border-box pro zahrnutí okraje do šířky prvku.

Signup and view all the flashcards

height

Nastavuje výšku prvku. Výchozí hodnota auto automaticky stanoví výšku. Můžete zadat hodnotu border-box pro zahrnutí okraje do výšky prvku.

Signup and view all the flashcards

min-height

Nastavuje minimální výšku prvku, která se nemůže zmenšit pod zadanou hodnotu.

Signup and view all the flashcards

auto

Výchozí hodnota pro width a height, která určuje, že prohlížeč automaticky stanoví konečnou šířku nebo výšku.

Signup and view all the flashcards

border-box

Nastavení pro box-sizing, které zahrnuje okraje do výpočtu výšky a šířky prvku.

Signup and view all the flashcards

Obrys

Čára, která se vykresluje okolo prvku mimo ohraničení. Nezabírá místo a nemá vliv na rozvržení dokumentu.

Signup and view all the flashcards

Vlastnost outline-color

Určuje barvu obrysu. Může nabývat hodnoty konkrétní barvy nebo invert (pro inverzi barvy pozadí).

Signup and view all the flashcards

Vlastnost outline-width

Nastavuje tloušťku obrysu. Může nabývat hodnoty konkrétní délky, thin, medium nebo thick.

Signup and view all the flashcards

Vlastnost outline-style

Nastavuje styl obrysu. Může nabývat hodnoty auto, none, dotted, dashed, solid, double, groove, ridge, inset a outset.

Signup and view all the flashcards

Vlastnost outline-offset

Nastavuje vzdálenost mezi obrysem a okrajem prvku. Může nabývat hodnoty délky.

Signup and view all the flashcards

Vlastnost resize

Určuje, zda je možné změnit velikost prvku a v jakých směrech.

Signup and view all the flashcards

Obrysy a vícerádkový text

Některé prohlížeče vykreslují obrysy pro každý řádek textu zvlášť, zatímco jiné ho zalomí jedním obrysem.

Signup and view all the flashcards

Manuální zalamování řádků

Zalamování řádků se provádí pouze v místech, kde znaky ve slově naznačují možnost zlomu (např. pomlčka).

Signup and view all the flashcards

Automatické zalamování řádků

Prohlížeč automaticky zalomí řádky v místech, která považuje za vhodné, a to podle interních pravidel.

Signup and view all the flashcards

Vlastnost overflow-wrap

Určuje, jak se má prohlížeč vypořádat s textem, který přesahuje rámec boxu.

Signup and view all the flashcards

Hodnota overflow-wrap: normal

Řádky se zalomí pouze v místech, kde je to běžné (např. mezera mezi slovy).

Signup and view all the flashcards

Hodnota overflow-wrap: anywhere

Text se může zalomit kdekoliv, aby se zabránilo přetečení, i když to není běžné (např. uprostřed slova).

Signup and view all the flashcards

Hodnota overflow-wrap: break-word

Stejné jako anywhere, ale ignoruje měkký zlom.

Signup and view all the flashcards

Vlastnost text-align

Nastavuje vodorovné zarovnání textu v bloku nebo buňce tabulky.

Signup and view all the flashcards

Hodnota text-align: justify

Text se zarovná do bloku, včetně poslední řádky.

Signup and view all the flashcards

Vlastnost overflow

Určuje, jak se bude chovat obsah, který přesahuje rozměry prvku. Může být skrytý, oříznutý nebo posouvatelný.

Signup and view all the flashcards

Hodnoty vlastnosti overflow

Může nabývat hodnot visible, hidden, clip, scroll, auto.

Signup and view all the flashcards

Výchozí hodnota overflow

Pokud je zadaná pouze jedna hodnota, nastaví se overflow-x i overflow-y na stejnou hodnotu.

Signup and view all the flashcards

Vlastnost overflow-clip-margin

Určuje, jak daleko mimo své hranice může být prvek s přetékajícím obsahem.

Signup and view all the flashcards

Hodnoty overflow-clip-margin

Může nabývat hodnot content-box, padding-box, border-box, délka.

Signup and view all the flashcards

Vlastnost scroll-behavior

Nastavuje, jak se bude chovat scrolling boxu, když je rolování spuštěno navigací.

Signup and view all the flashcards

Hodnoty scroll-behavior

Může nabývat hodnot auto, smooth.

Signup and view all the flashcards

Plynulé rolování

Posuvný box se posouvá plynule a pohodlně, s efektem náběhu.

Signup and view all the flashcards

Study Notes

Písmo v CSS

  • Znak (character) je nejmenší sémanticky významná jednotka psaného jazyka. Není konkrétně vykreslen, ale odkazuje na standard Unicode s přiřazeným kódem.
  • Glyf (glyph) je konkrétní vizuální reprezentace znaku. Jeden znak může mít více glyfů (např. ligatury).
  • Font je sada znaků stejné velikosti a stylu. Obsahuje glyfy mapované na znaky.
  • Rodina písem je skupina řezů odvozených z jednoho typu písma. Každý řez (např. tučný, kurzíva) je grafická varianta základního typu písma.

Základní termíny v CSS Fonts Module Level 3

  • Znak (character): Nejjednodušší sémantická složka psaného jazyka. Abstraktní, nikoli vykreslený.
  • Glyf (glyph): Konkrétní vizuální tvar znaku, může existovat více glyfů pro jeden znak.
  • Font: Sada znaků jedné velikosti a stylu, obsahující glyfy mapované na znaky.
  • Rodina písem: Skupina řezů jednoho typu písma. Řez je grafická varianta (např. tučný, kurzíva).

Vlastnosti fontu

  • font-family: Prioritní seznam názvů rodin písem. Může obsahovat konkrétné názvy (např. Arial) nebo generické (serif, sans-serif).
  • font-weight: Nastavuje tučnost písma (100-900). Normal = 400, Bold = 700.
  • font-style: Určuje styl písma (normal, italic, oblique).
  • font-size: Udává velikost písma (např. 16px, 1.2em).
  • font-stretch: Nastavuje rozšíření, zhuštění nebo normální řez písma (condensed, normal, expanded).
  • font-size-adjust: Nastavuje poměr velikosti malých a velkých písmen, aby se zachovala čitelnost.
  • font-style: Nastavuje styl písma (normal, italic, oblique).

Studying That Suits You

Use AI to generate personalized quizzes and flashcards to suit your learning preferences.

Quiz Team

Related Documents

04_WWW_výukový text PDF

More Like This

Písmo v CSS
48 questions

Písmo v CSS

ForemostCanto5845 avatar
ForemostCanto5845
CSS Fonts Module Level 3
48 questions

CSS Fonts Module Level 3

MarvelousQuartz4654 avatar
MarvelousQuartz4654
Font Styling and CSS Properties
10 questions
Use Quizgecko on...
Browser
Browser