1: Úvod 9. Co a kde v knize naleznete... 9 Zdroje Doporučení pro další studium... 11

Podobné dokumenty
Ukázka knihy z internetového knihkupectví

Cascading Style Sheets CSS Selektory Selektory

CSS - stručná reference kaskádových stylů

Přehled základních html tagů

CSS vlastnosti - stručný prehľad. Vlastnosti písma. Vlastnosti farby a pozadí. font-family. font-style. font-variant. font-weight. font-size.

Kaskádové styly (CSS) Cascading Style Sheets

Blokový model v CSS:

Rozměry, okraje a rámečky

Tvorba webu. Kaskádové styly (CSS) Martin Urza

PODPORA ELEKTRONICKÝCH FOREM VÝUKY

Referenční přehled vlastností CSS1 (Cascading Style Sheets, level 1)

CSS Obsah Úvod Základy CSS Základem je dobrý dokument Vytvoření stylopisu... 26

TVORBA WEBOVÝCH STRÁNEK

CSS Obsah Úvod Základy CSS Základem je dobrý dokument Vytvoření stylopisu... 26

Jak vytvořit jednoduché webové stránky.

Káskádové styly = CSS

Přehled vlastností stylů

Referenční přehled vlastností CSS1 (Cascading Style Sheets, level 1)

CSS Obsah Úvod Základy CSS Základem je dobrý dokument Vytvoření stylopisu... 26

Škola. Téma hodiny HTML - Základní návrh stránky Informační a komunikační technologie

O CSS podrobněji. Box model Document flow Layout

TVORBA WEBOVÝCH STRÁNEK

SkautIS Remote Components absolventská práce

Internetové publikování. Doc. Ing. Petr Zámostný, Ph.D. místnost: A-72a tel.: 4222, 4167 (sekretariát ústavu 111)

CSS 1. Blokový model Každý element tvoří obdélník. Dva druhy obdélníků: - Blokové; - Vložené. Zde je dlouhý text v kterém nachazí vložené...

Historie. K čemu je to dobré? Začínáme. Úvod do CSS Historie K čemu je to dobré? Začínáme

CSS Obsah Úvod Základy CSS Základem je dobrý dokument Vytvoření stylopisu... 26

CSS (Cascading Sytle Sheets) neboli kaskádové styly vznikly jako souhrn metod pro úpravu vzhledu stránek.

CSS Cascading style sheet přehled vlastností selektory

KASKÁDOVÉ STYLY - CSS

TNPW1 Cvičení aneta.bartuskova@uhk.cz

Střední průmyslová škola a Vyšší odborná škola technická Brno, Sokolská 1

Soukromá vyšší odborná škola a Obchodní akademie s.r.o. České Budějovice Pražská 3. Absolventská práce Petra Pavlyková

selektor {vlastnost1: hodnota_vlastnosti1; vlastnost2: hodnota_vlastnosti2;}

Skripta ke školení. Základy HTML a CSS. vypracoval: Tomáš Herout. tel:

NSWI096 - INTERNET. CSS kaskádové styly. Mgr. Petr Lasák

Kaskádové styly. CSS (Cascading Sytle Sheets) neboli kaskádové styly vznikly jako souhrn metod pro úpravu vzhledu stránek.

MODUL 7: TVORBA WEBOVÝCH APLIKACÍ

Všechny značky musí být vzájemně správně vnořeny <i><b>špatně</i></b> <i><b>správně</b></i>

Mimochodem, co je CSS? Formátování HTML. Drobný problém. Základy práce se styly. Trojí použití CSS. Přímo (in-line)

Dokument XHTML. Prohlížeč. styl CSS. Výstupní dokument. Soubor DTD

Počítače přirozeně pracují pouze s čísly

HTML. Úvod do (X)HTML. Tagy značky. Slouží ke strukturování dokumentu (párové a nepárové) <tag atribut1= hodnota atributu > text </tag>

Microsoft Office SharePoint Server 2007

Základy CSS (3. přednáška)

.rohy-kulate { width: 250px; background: url(obr/rohy-spodni.gif) bottom no-repeat; border-top: 2px solid #AAA; }

Techniky rozvržení KAPITOLA 2

TNPW1 Cvičení

VYSOK ŠKOLA EKONOMICKÁ V PRAZE VYŠŠÍ ODBORNÁ ŠKOLA INFORMAČNÍCH SLUŽEB. Projekt

2.8.1 Nejdůležitější a nejpoužívanější <meta /> elementy Ostatní Znakové entity kontejnery komentáře...

absolutní (úplná) začíná lomítkem nebo pouze v odkazech na jiný web. relativní popisuje cestu od html stránky k cílovému souboru.

Tvorba webových stránek

Tvorba webových aplikací pomocí AJAX

Kaskadové styly (CSS) VOŠG Hellichova Praha 2010 Jirka Jahoda

XHTML a tvorba webu. 1. Historie a základní struktura. HTML HyperText Markup Language

Mgr. Vlastislav Kučera přednáška č. 2

Mgr. Vlastislav Kučera lekce č. 2

Vývoj Internetových Aplikací

OBALKYKNIH.CZ API 3.0, IMPLEMENTACE PRO ALEPH OPAC

Tvorba webových stránek

Manuál. pro tvorbu webu. HTML CSS JavaScript

CSS Kaskádové styly. formátování webových stránek

SLEZSKÁ UNIVERZITA V OPAVĚ Filozoficko-přírodovědecká fakulta Ústav informatiky DIPLOMOVÁ PRÁCE

CSS Stylování stránek. Zpracoval: Petr Lasák

12. Úvod do CSS (CSS styly)

Internetové publikování. Doc. Ing. Petr Zámostný, Ph.D. místnost: A-72a tel.: 4222, 4167 (sekretariát ústavu 111)

Použití CSS v dokumentech HTML

Internetové publikování

Tvorba www stránek v HTML a CSS

Kaskádové styly 4IZ228 tvorba webových stránek a aplikací

Bloky. Tag Význam Párový. p odstavec nepovinně. br řádkový zlom ne. div oddíl ano. center vycentrování ano. h1 nadpis 1.

Dokument ve formátu webové stránky vytvořený pomocí XHTML a CSS

HTML. Verze Obsah:

Tomáš Herout

CSS Kaskádní styly. Založeno na přednášce Lukáše Bařinky

Tvorba WWW stránek s využitím technologií (X)HTML, CSS, PHP a databází

Mgr. Vlastislav Kučera Header, footer, navv, article, section, boxy, margin, padding, border

Skripta ke školení. Autor: Tomáš Herout Telefon: (+420)

(X)HTML, CSS a jquery

Soukromá střední odborná škola Frýdek-Místek, s.r.o. VY_32_INOVACE_135_IVT_HTML_08_tvorba_www

CSS Selektory tříd a ID, dědičnost, další vlastnosti. Formátování HTML dokumentu, které je více či méně oddělené od obsahu Způsoby implementace

Vysoká škola báňská Technická univerzita Ostrava INTERNET A SÍTĚ. učební text. Marek Babiuch

Předmluva k druhému vydání 13. Úvod 17. ČÁST 2 Vytváření dokumentů XML 65

15. CSS styly (funkce, vývoj, využití). Práce s CSS styly (vkládání do kódu, pravidlo, selektor, dědičnost, kaskády, id a vlastní třídy)

Název modulu: XHTML a CSS pokročilé techniky tvorby webových stránek

Verze 2.1 MANUÁL. Redakční systém. REDAKTOR Junior

Mgr. Vlastislav Kučera Struktura stránky, hlavička,

Webové stránky. 8. Pozadí webové stránky. CSS pozadí. Datum vytvoření: str ánk y. Vytvořil: Petr Lerch.

Název modulu: Tvorba webu pomocí XHTML a CSS začátečníci

Tvorba stránek v HTML ve Wordu

Návrh webového obchodu

Tématická oblast: dědičnost, kaskáda. CSS a média. Stylové předpisy pro různé typy zobrazovacích zařízení

25. TVORBA HTML DIALOGŮ PRO PEVNÉ TVARY

Obrázky. Tag Význam Párový Výskyt. img obrázek ne. img video ne. map klikací mapa. area oblast v klikací mapě ne

13. Vytváření webových stránek

Tabulky. Přehled tagů z oblasti tabulek. Tag Význam Párový Výskyt. tr řádek tabulky nepovinně <table>, <tbody>, <thead>, <tfoot>

Struktura stránek. <TITLE></TITLE>... text mezi tagy je zobrazen v názvu okna. <BODY></BODY> atributy:

CSS styly - úvod. Formátování HTML - Kdy používat CSS - Nástin možností CSS - Trojí použití CSS - Příklady - Syntaxe - Příklad s nadpisem

Pseudotřídy. Střední škola informatiky, elektrotechniky a řemesel Rožnov pod Radhoštěm. Modernizace výuky s využitím ICT, CZ.1.07/1.5.00/34.

Transkript:

Obsah 3 1: Úvod 9 Dříve než začnete......................... 9 Co a kde v knize naleznete....................... 9 Zdroje............................... 10 Doporučení pro další studium..................... 11 Historie CSS.......................... 13 Význam CSS.......................... 14 Širší formátovací možnosti...................... 14 Snadná tvorba a údržba konzistentního stylu............... 15 Oddělení struktury a stylu....................... 15 Vyšší přístupnost dokumentů..................... 16 Dynamická práce se styly....................... 17 Formátování XML dokumentů..................... 17 Strategie použití CSS....................... 17 Obohacení formátovacích možností................... 17 Veškeré formátování s výjimkou rozmístění (layoutu) prvků......... 19 Formátování jen pomocí CSS, včetně rozmístění prvků.......... 20 2: Základní principy CSS 23 Vazba na (X)HTML dokument................... 23 Základní metody připojení stylů k (X)HTML............... 23 Kompatibilita a selekce prohlížečů................... 26 Syntaxe............................. 28 Struktura stylového předpisu..................... 28 Klíčová slova............................ 28 Povolené znaky........................... 29 Definice.............................. 29 At-pravidla............................. 29 Sady pravidel............................ 29 Deklarace a vlastnosti........................ 30 Hodnoty.............................. 30 Selektory............................ 36 Svazování............................. 36 Syntaxe selektorů.......................... 37 Univerzální selektor......................... 38 Typové selektory.......................... 38

4 CSS pro webdesignery Selektor následníka......................... 39 Selektor potomka.......................... 40 Selektor sousedních sourozenců.................... 41 Selektor atributu........................... 41 Selektory ID............................ 43 Pseudoprvky a pseudotřídy...................... 45 Přiřazování hodnot, kaskádování a dědičnost............. 52 Určené, vypočítané a skutečné hodnoty................. 52 Dědičnost............................. 53 Pravidlo @import.......................... 54 Kaskádování............................ 55 Média............................. 58 Jak definovat stylové předpisy pro určitá média.............. 59 Typy médií............................. 60 Koncepce boxů......................... 62 Rozměry boxu........................... 62 Vlastnosti okrajů, výplně a orámování.................. 66 Koncepce vizuálního formátování.................. 67 Úvod do koncepce vizuálního formátování................ 67 Generování boxů.......................... 68 Polohování............................. 73 Další detaily vizuálního formátování................... 91 3: Referenční přehled CSS 99 Rozměry............................ 99 Výplň............................. 100 Orámování........................... 100 Okraje............................. 102 Pozadí............................. 103 Umístění............................ 103 Ohraničení........................... 104 Písmo............................. 105 Text............................. 106 Seznamy a odrážky....................... 107 Tabulka............................ 108 Generovaný obsah....................... 108 Klasifikační vlastnosti a různé................... 109 Stránkovaná média....................... 109 Hlasový výstup......................... 110

Obsah3 5 4: Detailní popis vlastností 113 Vlastnost Background...................... 113 Vlastnost Background-attachment................. 115 Vlastnost Background-color.................... 116 Vlastnost Background-image................... 118 Vlastnost Background-position.................. 121 Vlastnost Background-repeat................... 123 Vlastnost Border........................ 125 Vlastnost Border-bottom..................... 126 Vlastnost Border-bottom-color.................. 127 Vlastnost Border-bottom-style................... 128 Vlastnost Border-bottom-width.................. 129 Vlastnost Border-collapse..................... 129 Vlastnost Border-color...................... 132 Vlastnost Border-left....................... 134 Vlastnost Border-left-color.................... 136 Vlastnost Border-left-style..................... 137 Vlastnost Border-left-width.................... 138 Vlastnost Border-right...................... 139 Vlastnost Border-right-color.................... 140 Vlastnost Border-right-style.................... 141 Vlastnost Border-right-width................... 142 Vlastnost Border-spacing..................... 142 Vlastnost Border-style...................... 143 Vlastnost Border-top....................... 147 Vlastnost Border-top-color.................... 148 Vlastnost Border-top-style.................... 149 Vlastnost Border-top-width.................... 150 Vlastnost Border-width...................... 151 Vlastnost Bottom........................ 153 Vlastnost Caption-side...................... 155 Vlastnost Clear......................... 157 Vlastnost Clip......................... 162 Vlastnost Color......................... 163 Vlastnost Content........................ 164 Vlastnost Counter-increment................... 165 Vlastnost Counter-reset..................... 166

6 CSS pro webdesignery Vlastnost Cursor........................ 167 Vlastnost Direction....................... 169 Vlastnost Display........................ 169 Vlastnost Empty-cells...................... 171 Vlastnost Float......................... 172 Vlastnost Font......................... 176 Vlastnost Font-family...................... 179 Vlastnost Font-size....................... 183 Vlastnost Font-size-adjust..................... 186 Vlastnost Font-stretch...................... 187 Vlastnost Font-style....................... 188 Vlastnost Font-variant...................... 189 Vlastnost Font-weight...................... 190 Vlastnost Height........................ 191 Vlastnost Left.......................... 193 Vlastnost Letter-spacing..................... 195 Vlastnost Line-height...................... 196 Vlastnost List-style........................ 198 Vlastnost List-style-image..................... 199 Vlastnost List-style-position.................... 200 Vlastnost List-style-type..................... 205 Vlastnost Margin........................ 208 Vlastnost Margin-bottom..................... 212 Vlastnost Margin-left....................... 213 Vlastnost Margin-right...................... 214 Vlastnost Margin-top....................... 215 Vlastnost Marker-offset...................... 216 Vlastnost Marks......................... 216 Vlastnost Max-height...................... 217 Vlastnost Max-width....................... 218 Vlastnost Min-height....................... 220 Vlastnost Min-width....................... 220 Vlastnost Orphans........................ 221 Vlastnost Outline........................ 222 Vlastnost Outline-color...................... 223 Vlastnost Outline-style...................... 224 Vlastnost Outline-width...................... 225

Obsah3 7 Vlastnost Overflow....................... 226 Vlastnost Padding........................ 230 Vlastnost Padding-bottom.................... 234 Vlastnost Padding-left...................... 235 Vlastnost Padding-right...................... 236 Vlastnost Padding-top...................... 237 Vlastnost Page......................... 238 Vlastnost Page-break-after.................... 239 Vlastnost Page-break-before.................... 239 Vlastnost Page-break-inside.................... 240 Vlastnost Position........................ 241 Vlastnost Quotes........................ 242 Vlastnost Right......................... 243 Vlastnost Size......................... 245 Vlastnost Table-layout...................... 246 Vlastnost Text-align....................... 247 Vlastnost Text-decoration..................... 251 Vlastnost Text-indent...................... 252 Vlastnost Text-shadow...................... 253 Vlastnost Text-transform..................... 254 Vlastnost Top......................... 255 Vlastnost Unicode-bidi...................... 257 Vlastnost Vertical-align...................... 258 Vlastnost Visibility........................ 261 Vlastnost White-space...................... 262 Vlastnost Widows........................ 264 Vlastnost Width......................... 265 Vlastnost Word-spacing..................... 267 Vlastnost Z-index........................ 268 A: Slovníček pojmů 271 B: Výchozí stylový předpis pro HTML 4 275