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

Rozměr: px
Začít zobrazení ze stránky:

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

Transkript

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

2 SLEZSKÁ UNIVERZITA V OPAVĚ Filozoficko-přírodovědecká fakulta Ústav informatiky Pavol Hudran Bakalářská diplomová práce CSS v praxi (Practical Cascading Style Sheets) vedoucí práce Mgr. Michaela Ačová OPAVA 2007

3 Prohlášení studenta Prohlašuji, že jsem diplomovou práci včetně příloh vypracoval samostatně pod vedením vedoucí diplomové práce a uvedl jsem všechnu použitou literaturu. V Opavě dne Pavol Hudran

4 Poděkování Děkuji především Mgr. Ačové, vedoucí diplomové práce, za její odbornou pomoc a cenné připomínky při vypracování této diplomové práce. Pavol Hudran

5 1. Úvod Tabulky kaskádových stylů (Cascading Style Sheets = CSS) jsou nadstavbou jazyků HTML, XHTML a XML. Slouží k popisu prezentace dokumentů, aniž by jakkoli ovlivňovali jejich obsah a strukturu. Vývoj spravuje a specifikaci jednotlivých verzí publikuje organizace World Wide Web Consorcium (= W3C) Původně formátování dokumentu HTML záviselo na výstupním zařízení. Kvůli rychle se vyvíjejícím potřebám uživatelů a vylepšením výrobců prohlížečů bylo HTML obohaceno příkazy (= tagy) nad rámec původního HTML standardu a jeho logické struktury, což přináší mnoho problémů: špatnou čitelnost kódu pro vyhledávače, ekonomickou zátěž velké množství přenesených kb, špatnou čitelnost pro zařízení postižených lidí i ztrátu nezávislosti a přenositelnosti dokumentu mezi zařízeními. Řešením je návrat k standardizovanému HTML dokumentu s formátováním definovaným odděleně pomocí CSS stylů, čemuž se přizpůsobují i prohlížeče s větší, či menší úspěšností. Prohlížeče rozeznávají několik druhů HTML dokumentů (např. HTML 4.0, HTML 4.0 Transitional, nebo XHTML 1.0) s významem, že dokumenty mohou být formátovány starým, přechodovým, nebo novým způsobem. Starý upřednostňuje formátování formátovacími příkazy jazyka HTML s obohacením formátovacích možností jazykem CSS, to však jen minimálně. Styly jsou často definované přímo v dokumentu tabulkou stylů, nebo přímými styly. Rozvržení layoutu a prvků na stránce je řešené pomocí tabulek - dochází k vnořování tabulek. Přechodový toleruje většinu původních formátovacích příkazů a taktéž nabízí většinu možnosti formátování pomocí CSS s výjimkou rozvržení layoutu, který je stále řešený tabulkou. Styly můžou být do dokumentu začleněné připojením externího souboru. Nový nepodporuje staré formátování, ale plně uplatňuje formátování CSS styly, včetně rozvržení stránky a pozicování jednotlivých prvků. Nový přístup nevytváří HTML dokument jako důsledek navrženého vzhledu, ale postupuje se přesně opačně. Vychází se z obsahu, který má dokument sdělit. Snaží se o co nejlepší strukturování dokumentu: určí se pořadí jednotlivých částí, jejich hiarerchie a vzájemné vazby. Cílem je přehlednost dokumentu, aby začínal nejdůležitějšími informacemi a postupoval k méně důležitým a aby struktura odpovídala sdělovanému obsahu. To přináší výhody: širší formátovací možnosti snadná tvorba a údržba jednotného stylu celého webu (pro celý web stačí jediný soubor s tabulkou stylů) oddělení struktury a stylu (důsledky: přehlednost; obsah a vzhled mohou tvořit různí lidé, což je v praxi často potřeba; tentýž obsah lze beze změny logické struktury naformátovat více [1]

6 způsoby; stylové pravidla je možné tvořit pro obecnou strukturu obsahu ještě dříve, než skutečný obsah vznikne) vyšší přístupnost dokumentů (pro osoby s různými hendikepy, libovolné koncové zařízení např. prohlížeč, tiskárna, zvukový styl pro čtecí zařízení, atd.) dynamická práce se styly (různé efekty jako popup menu, atd.) formátování XML dokumentů Až s takovýmto dokumentem pracuje grafik, který do něj zasahuje jen přidáváním neškodných příkazů <div> a <span>, pro uzavření částí dokumentu do jednotlivých celků, které mu pomáhají realizovat grafický návrh. Ten by měl být navržen s ohledem na současné možnosti formátování, neboť ačkoli je v souhrnu nový způsob formátování alespoň tak silný jako tradiční způsoby, je natolik odlišný, že s tím musí grafik dopředu počítat. Slovo autora Mým cílem bylo vytvořit příručku, která Vám pomůže svou stručností a přehledností v práci. Nejedná se tedy o obsáhlou kuchařku, určenou pro začátečníky, která by Vás vedla krok po kroku, naopak je určená pro mírně pokročilého čtenáře v oblasti webových technologií. Rozdělil jsem práci do několika kapitol, které postupně seznámí čtenáře s jazykem CSS - verzemi a. V současné době je aktuálním tématem verze CSS3, ta je však prohlížeči podporována s obtížemi a jen částečně, proto se o ní v mé práci zmiňuji okrajově. Kapitola 3. Nutná teorie jazyka CSS, jak už název napovídá, seznámí čtenáře s definicí jazyka CSS, tak aby byl schopen dál s jazykem pracovat s jasnou představou o jeho fungování, ale aby nebyl teorií přílišně zatěžován. V kapitole 4. Přehled funkcí a vlastností CSS uvádím seznam vlastností jazyka CSS se základními sledovanými parametry. Podrobnější popis k jednotlivým vlastnostem by však byl nad rámec této práce, proto odkazuji čtenáře na použitou literaturu. Kapitolou 5. CSS v praxi dovršuji svou práci a předkládám čtenáři řešení pokročilých formátovacích situací větší část této kapitoly obsahuje příloha č. 1 na CD ve formátu HTML a CSS pro snadnější manipulaci. 2

7 2. Obsah 1. ÚVOD OBSAH NUTNÁ TEORIE JAZYKA CSS PODPORA CSS PROHLÍŽEČI VAZBA CSS NA (X)HTML A XML DOKUMENTY Vazba na HTML dokumenty Vazba na XHTML dokumenty Vazba na XML dokumenty SYNTAXE CSS Symbolický popis syntaxe Speciální znaky Symboly v zápisu syntaxe Definice CSS Hodnoty a jednotky Média Použití médií v tabulkách stylů Strom dokumentu Vztahy mezi prvky: Selektory v tabulkách stylů Kombinování selektorů Pseudo-prvky a pseudo-třídy Dědičnost a kaskáda CSS Postup hledání optimální hodnoty Dědičnost Kaskádování Hodnota a a!important Vizuální formátovací model Koncepce boxů Generování boxů Poziční schéma Výpočet rozměrů prvků KRÁTCE O CSS PŘEHLED FUNKCÍ A VLASTNOSTÍ CSS CSS V PRAXI OBECNÉ POSTUPY CHYBY PROHLÍŽEČŮ USPOŘÁDÁNÍ STRÁNKY SEZNAMY FORMULÁŘE A TABULKY FORMÁTOVÁNÍ TEXTU

8 5.7. VIZUÁLNÍ EFEKTY UŽITEČNÉ RADY ZÁVĚR LITERATURA PŘÍLOHY

9 3. Nutná teorie jazyka CSS 3.1. Podpora CSS prohlížeči Jazyk CSS je v jednotlivých prohlížečích implementován v rozdílném rozsahu, nebo různým způsobem. To znamená, že ne všechny definice a vlastnosti (popř. jejich hodnoty) jsou podporovány jednotlivými prohlížeči podle W3C specifikace jazyka a jeho verzí. Některé vlastnosti buďto nejsou podporované vůbec, nebo je prohlížeče pojímají po svém a tím se odklánějí od W3C spefifikace. Většinou je oním problémovým prohlížečem MS InternetExplorer 1. Naštěstí, řešit tyto problémy bude čím dál míň potřeba, protože současné prohlížeče se čím dál víc přibližují specifikacím. Stále však přetrvává nutnost mít znalost, které definice a vlastnosti (popř. jejich hodnoty) jsou podporované jakým prohlížečem. 2 1 Více v kapitole 5.2. Chyby prohlížečů. 2 Více v kapitolách Selektory v tabulkách stylů a 4. Přehled funkcí a vlastností CSS, popř. v použité literatuře. 5

10 3.2. Vazba CSS na (X)HTML a XML dokumenty Vazba na HTML dokumenty a) Připojením externího souboru Připojení externího souboru k dokumentu s tabulkou stylů se provádí vložením příkazu <link> do hlavičky dokumentu. K dokumentu může být takto připojeno více externích souborů. Tento způsob důsledně naplňuje ideu oddělení formátování od struktury dokumentu a přináší výhody s tím spojené (např. po prvním načtení dokumentu daného webového místa se stylový soubor ukládá do paměti a načítání dalších dokumentů se tím podstatně urychlí). Tabulka 1: popis vlastnosti link [2, str ] Příkaz <link> má atributy: href: URL adresa k externímu souboru s tabulkou stylů type: Content-type, neboli typ obsahu vždy text/css rel: typ vazby k externímu zdroji, vždy stylesheet pro základní tabulky stylů, resp. alternate stylesheet pro alternativní tabulky stylů media: druh média, pro který je tabulka stylů určena; nepovinný atribut; implicitní hodnota all, viz část Média title: titulek k tabulce stylů; praktický význam jen u alternate stylesheet Příklad 1: [1, str. 37] <head> <link rel="stylesheets" type="text/css" href="<uri>"> </head> b) Tabulkou stylů v dokumentu Vložení tabulky stylů přímo do hlavičky dokumentu se provádí pomocí příkazu <style>. Je zřejmé, že se tabulka stylů načítá s každým načtením dokumentu to vede ke zvýšení objemu přenesených dat (oproti předchozímu přístupu), také je náročnější přestylování webu. Ovšem hodí se tam, kde z nějakého důvodu potřebujeme definovat styly přímo v dokumentu. Tabulka stylů je určená seznamem pravidel složených ze selektorů a k nim příslušných seznamu definic stylů, popř. doplněná komentáři. Stejného efektu předchozího přístupu docílíme pomocí vepsání do tabulky stylů. Příkaz <style> má atributy: type, media, title viz. Připojením externího souboru. 6

11 Příklad 2: [1, str. 36] <head> <style type="text/css"> <!-- tabulka_stylů //--> </style> </head> c) Přímým stylem Styly lze přiřadit i jednotlivým prvkům dokumentu prostřednictvím atributu style. Hodnotou atributu je definice stylu (resp. seznamu definic stylu). Tento způsob je nevhodný a v novějších verzích XHTML dokonce nepřípustný. Často se používá pro testování vzhledu během vývoje webu. Příklad 3: <značka style="seznam_definic"> d) Dynamicky klientským skriptováním a DOM Načtené CSS definice jsou uloženy v poli document.stylesheets[], kde každá položka v poli odpovídá jedné sekci <STYLE>, včetně externích souborů načtených nebo pomocí příkazu <LINK>. Pořadí položek v poli pak odpovídá pořadí načítání CSS. Obecně podporovaná je pouze vlastnost disabled, která (de)aktivuje daný stylesheet. Příklad 4: [4)] document.stylesheets[n].disabled = true false Vazba na XHTML dokumenty Vložení stylů do dokumentu se provádí především připojením externího souboru jako u HTML dokumentu, nebo tabulkou stylů v dokumentu (od tohoto způsobu se upouští). Příklad 5: [1), str. 37] <head> <style type="text/css"> /* <![CDATA[ */ tabulka_stylů /* ]] */ </style> </head> Vazba na XML dokumenty V jazyce XML se externí soubory s CSS načítají do dokumentu pomocí deklarace: Příklad 6: [1), str. 38] <?xml stylesheet type="text/css" tref="url"> 7

12 3.3. Syntaxe CSS Symbolický popis syntaxe Používají se znaky podle normy ISO v českém prostředí jsou doporučené pouze znaky ASCII. U názvů prvků, jež jsou součástí jazyka CSS, nezáleží na velikosti písmen. Kdežto u názvů prvků dokumentu záleží na velikosti písmen v závislosti na specifikaci jazyka dokumentu. Např. pro HTML nezáleží, kdežto pro XML záleží na velikosti písmen Speciální znaky uvozovky ( " = ASCII 34), ( = 39), mezera, tj. libovolně velká posloupnost mezer (mezera = 32, CR = 12, LF = 10, FF = 12, TAB = 9) čárka (, = 44) a středník ( ; = 59) pro oddělovaní seznamu Význam speciálních znaků může být změněn zpětným lomítkem \, který také slouží k zápisu znaku v dekadickém nebo hexadecimálním tvaru Symboly v zápisu syntaxe Tyto symboly se budou používat v příkladech pro jednodušší pochopení platnosti zápisu syntaxe: Tabulka 2: symboly v zápisu syntaxe [1), str. 39] symbol [ ] [X] * [X] + [X]? [X]{m,n} [X Y Z] [X Y Z] mezera Popis hranaté závorky uzavírají položku pro následující varianty. Výraz X se může vyskytovat v lib. počtu 0 až n-krát. Výraz X se může vyskytovat v lib. počtu, ale alespoň jednou (1 až n-krát). Výraz X se může i nemusí vyskytovat (0 nebo 1-krát). Výraz X se opakuje nejméně m-krát a nejvýše n-krát. Seznam alternativ, vyskytuje se právě jedna z uvedených položek. Seznam alternativ, vyskytuje se jedna či více z uvedených položek v lib. pořadí. Všude kde je mezera může být lib. prázdný prostor. Některé znaky (, [, ], {, },?, *, +, mezera ) mají zvláštní význam - pokud se tento znak vyskytne v textu, bude uveden v uvozovkách. 8

13 Definice CSS Vlastnosti můžou být jednoduché nebo sdružené. Jednoduché vlastnosti mají definici stylu ve tvaru vlastnost: hodnota;, kde mezera je nepovinná a středník za hodnotou se zapisuje vždy, když existuje vlastnost ležící za uvažovanou vlastností v seznamu definic stylu. Sdružené vlastnosti umožňují v jedné definici stylu nastavit více vlastností najednou, zadáním seznamu hodnot oddělených mezerami a to: sdružená_vlastnost: hodnota[ hodnota]*. Kde při vynechání libovolné hodnoty seznamu se příslušná vlastnost nenastaví, ale zdědí z nejbližšího nadřízeného prvku. Definice stylu je přiřazením hodnoty (resp. seznamu hodnot) vlastnosti (resp. sdružené vlastnosti). Definice se mohou spojovat do seznamu definic stylu, který je ve tvaru definice[; definice]*, neboli vlastnost: hodnota[; vlastnost: hodnota]*. Tabulka stylů definuje styly pro celý dokument. Je určena seznamem pravidel a atp. rozšiřující CSS o další funkce viz dále v textu). pravidlo = selektor { seznam_definic }, kde selektor je symbolický popis prvku, či skupiny prvků. Rozvoj pravidla: { seznam_definic; }, { definice[; definice]* }, { vlastnost: hodnota[; vlastnost: hodnota]* }, Popř. { sdružená_vlastnost: hodnota[; hodnota]* }. Příklad 7: /* ukázka možných zápisů pravidel url("styly.css"); P { font-weight: bold; font-size: 12pt; } P { font: bold 12pt; } komentář at-pravidlo pravidlo se seznamem definic pravidlo se sdruženými vlastnostmi Samozřejmě je víc možností, jak zapisovat pravidla do tabulky stylů (viz dále v textu). Mezi jednotlivými pravidly píšeme mezeru. Identifikátory pravidel (názvy prvků) nemohou začínat pomlčkou nebo číslem Hodnoty a jednotky Tabulka 3: typy hodnot i jednotek a jejich charakteristika [1), str ; 2, str ] hodnota popis příklad <klíčová slova> <číslo> obvykle zastupuje jinou hodnotu, na níž se dané klíčové slovo převede; zapisujeme bez uvozovek celé [+ -]<číslo> přirozenému číslu může předcházet symbol +, - (bez mezery) color: yellow kde yellow = rgb(100%,100%,0%)) 0, 1, 10,

14 reálné [+ -]<číslo>[.<číslo>]? jsou buď celá, nebo desetinná čísla; desetinná část se odděluje. 0, 1, 10, -156, , -2.1,.3 <velikost> relativní jednotky em ex vypočítaná hodnota vlastnosti fontsize aktuálního prvku; při použití v samotné vlastnosti font-size se hodnota vztahuje k vlastnosti fontsize rodičovského prvku výška malého písmene x zvoleného písma; často prohlížeče mylně interpretují jako 1ex = 0.5em line-height: 1.2em font-size: 1.2em font-size: 1.2ex px obrazový bod, jehož velikost závisí na zobrazovacím zařízení: obrazovka, tiskárna, projektor, atp. width: 780px absolutní jednotky mm milimetr width: 100mm cm centimetr width: 10cm in palec (angl. inch) 25,4mm width: 3.94in pt typografický bod (angl. point) 1/72 in, především při výstup na tiskárnu 72pt = 1in, 1pt = mm pc typografická jednotka pica 1pc = 12pt 1in = 6pc = 72pt <%> zapisujeme: <číslo>% (bez mezery); procenta se vztahují k jiné hodnotě, kterou je nutno uvést - např. jiná hodnota stejného prvku, stejná hodnota předchůdce, nebo hodnota formátovacího kontextu 100%, 33.33%, -10%,.5% <uri> platná adresa nějakého zdroje na webu; je uzavřená v, nebo "; zapisujeme absolutně (včetně názvu protokolu), nebo relativně (pokud se nacházíme v aktuálním nebo vnořeném adresáři); musí být kódována UTF-8 url("http://bouse. blbeckove.com/ ebook/css.pdf") url(../css.pdf) url(../css.pdf ) url("../css.pdf")../css.pdf "../css.pdf " <barva> číselně hexadecimálně #[RRGGBB RGB] kde R červená, G zelená, B modrá #B1F836 (kde R = B1, G = F8, B = 36 ), #BB5588 (resp. #B58) dekadicky a procentuálně pomocí funkce rgb(r,g,b), kde R, G, B musí být uvedené buď shodně dekadicky, nebo shodně procentuálně. rgb(127, 0, 255) tj. rgb(50%,0%,100%) 10

15 klíčová slova AliceBlue (#F0F8FF), AntiqueWhite (#FAEBD7), Aqua (#00FFFF), Aquamarine (#7FFFD4), Azure (#F0FFFF), Beige (#F5F5DC), Bisque (#FFE4C4), Black (#000000), BlanchedAlmond (#FFEBCD), Blue (#0000FF), BlueViolet (#8A2BE2), Brown (#A52A2A), BurlyWood (#DEB887), CadetBlue (#5F9EA0), Chartreuse (#7FFF00), Chocolate (#D2691E), Coral (#FF7F50), CornflowerBlue (#6495ED), Cornsilk (#FFF8DC), Crimson (#DC143C), Cyan (#00FFFF), DarkBlue (#00008B), DarkCyan (#008B8B), DarkGoldenRod (#B8860B), DarkGray (#A9A9A9), DarkGrey (#A9A9A9), DarkGreen (#006400), DarkKhaki (#BDB76B), DarkMagenta (#8B008B), DarkOliveGreen (#556B2F), Darkorange (#FF8C00), DarkOrchid (#9932CC), DarkRed (#8B0000), DarkSalmon (#E9967A), DarkSeaGreen (#8FBC8F), DarkSlateBlue (#483D8B), DarkSlateGray (#2F4F4F), DarkSlateGrey (#2F4F4F), DarkTurquoise (#00CED1), DarkViolet (#9400D3), DeepPink (#FF1493), DeepSkyBlue (#00BFFF), DimGray (#696969), DimGrey (#696969), DodgerBlue (#1E90FF), FireBrick (#B22222), FloralWhite (#FFFAF0), ForestGreen (#228B22), Fuchsia (#FF00FF), Gainsboro (#DCDCDC), GhostWhite (#F8F8FF), Gold (#FFD700), GoldenRod (#DAA520), Gray (#808080), Grey (#808080), Green (#008000), GreenYellow (#ADFF2F), HoneyDew (#F0FFF0), HotPink (#FF69B4), IndianRed (#CD5C5C), Indigo (#4B0082), Ivory (#FFFFF0), Khaki (#F0E68C), Lavender (#E6E6FA), LavenderBlush (#FFF0F5), LawnGreen (#7CFC00), LemonChiffon (#FFFACD), LightBlue (#ADD8E6), LightCoral (#F08080), LightCyan (#E0FFFF), LightGoldenRodYellow (#FAFAD2), LightGray (#D3D3D3), LightGrey (#D3D3D3), LightGreen (#90EE90), LightPink (#FFB6C1), LightSalmon (#FFA07A), LightSeaGreen (#20B2AA), LightSkyBlue (#87CEFA), LightSlateGray (#778899), LightSlateGrey (#778899), LightSteelBlue (#B0C4DE), LightYellow (#FFFFE0), Lime (#00FF00), LimeGreen (#32CD32), Linen (#FAF0E6), Magenta (#FF00FF), Maroon (#800000), MediumAquaMarine (#66CDAA), MediumBlue (#0000CD), MediumOrchid (#BA55D3), MediumPurple (#9370D8), MediumSeaGreen (#3CB371), MediumSlateBlue (#7B68EE), MediumSpringGreen (#00FA9A), MediumTurquoise (#48D1CC), MediumVioletRed (#C71585), MidnightBlue (#191970), MintCream (#F5FFFA), MistyRose (#FFE4E1), Moccasin (#FFE4B5), NavajoWhite (#FFDEAD), Navy (#000080), OldLace (#FDF5E6), Olive (#808000), OliveDrab (#6B8E23), Orange (#FFA500), OrangeRed (#FF4500), Orchid (#DA70D6), PaleGoldenRod (#EEE8AA), PaleGreen (#98FB98), PaleTurquoise (#AFEEEE), PaleVioletRed (#D87093), PapayaWhip (#FFEFD5), PeachPuff (#FFDAB9), Peru (#CD853F), Pink (#FFC0CB), Plum (#DDA0DD), PowderBlue (#B0E0E6), Purple (#800080), Red (#FF0000), RosyBrown (#BC8F8F), RoyalBlue (#4169E1), SaddleBrown (#8B4513), Salmon (#FA8072), SandyBrown (#F4A460), SeaGreen (#2E8B57), SeaShell (#FFF5EE), Sienna (#A0522D), Silver (#C0C0C0), SkyBlue (#87CEEB), SlateBlue (#6A5ACD), SlateGray (#708090), SlateGrey (#708090), Snow (#FFFAFA), SpringGreen (#00FF7F), SteelBlue (#4682B4), Tan (#D2B48C), Teal (#008080), Thistle (#D8BFD8), Tomato (#FF6347), Turquoise (#40E0D0), Violet (#EE82EE), Wheat (#F5DEB3), White (#FFFFFF), WhiteSmoke (#F5F5F5), Yellow (#FFFF00), YellowGreen (#9ACD32) <řetězec> reprezentuje nějaký text, který vpisujeme mezi, nebo "; možný zápis: " "; výskyt znaků, jimiž je řetězec omezen: \, "\"", "\\", odřádkování: "\n", popř. rozepsání ve zdroji na více řádků: "...\..." <audio> <úhel> <čas> <číslo>[deg rad grad], kde číslo je kladné, deg jsou stupně (v tom případě může být číslo i záporné automaticky se přepočítává, rozmezí: 0º- 360º), rad radiany, grad grady (360º = 400gradů) <číslo>[s ms], kde číslo je kladné a s jsou sekundy, ms milisekundy P.pozn:before { content: "citace odřádkovaného textu \n na výstupu " } A[title="velmi dlou\ hý titulek] {... } 10deg = 350deg = rad = 388.9grad 120ms, 5s <frekvence> <číslo>[hz khz], kde číslo je kladné a Hz jsou hertze, khz kilohertze 2400Hz, 4.2kHz 11

16 Média Jedním z hlavních úkolů CSS je určit, jakým způsobem se má zobrazit dokument na různých typech koncových zařízení (médiích), tj. definovat pro ně rozdílné styly prezentace dokumentu. Média jsou určené typem a mají přiřazenou minimálně jednu skupinu médií, do které náleží. Příslušnost ve skupině přiřazuje médiu množinu vlastností, definovanou pro tuto skupinu. Proto se jednotlivé typy médií vyznačují rozdílnou množinou vlastností (popř. hodnot těchto vlastností). Tabulka 4: typy médií a jejich charakteristika [1), str ; 2), str ] typ média popis stránkovaná plynulá zvuková vizuální hmatová znaková grafická interaktivní statická all všechny typy médií aural zvukový výstup na klávesovém syntetizátoru braille braillova dotyková zařízení embossed stránka zobrazená plastickým tiskem na braillově tiskárně handheld obrazovka kapesního počítače print náhled tisku, stránky tištěné na tiskárně projeciton promítané prezentace (např. projektory) screen obrazovka počítače tty neproporční znakový výstup (dálnopisy, terminály, atp.) tv televizní obrazovky a podobné zařízení Použití médií v tabulkách stylů Připojení tabulky stylů do hlavičky dokumentu, která má platit pouze pro dané médium: Příklad 8: [1), str ] <link rel="stylesheet" type="text/css" href="styl.css" media="seznam_medií"> <style type="text/css" media="seznam_medií"> <!-- tabulka_stylů //--> </style> <style url("url"): seznam_medií; </style> kde seznam médií obsahuje názvy médií oddělené čárkou. Implicitně je nastaveno all. Pro definování médií přímo v tabulce stylů : Příklad 9: [1), str. seznam_medií { /* pravidla platná pro tato média */ } 12

17 uvnitř bloku nesmíme importovat další tabulky stylů Strom dokumentu HTML i XML popisují dokument pomocí stromové struktury. Kořenový prvek, který je jediný (př. <html> ), obsahuje všechny ostatní prvky. Ty jsou uzavřené do jednotlivých celků větví, vytvářejících hierarchii dokumentu. Možné vztahy mezi prvky stromové struktury ilustruje příklad: Příklad 10: [1), str. 49] <html> <head> <title>titulek stránky</title> </head> <body> <h1>nadpis1</h1> <p>odstavcový text</p> <ul> <li>položka seznamu1</li> <li>položka seznamu2</li> </ul> </body> </html> Vztahy mezi prvky: Tabulka 5: demonstrace vztahů mezi prvky [1, str ] Každý prvek kromě kořenového obsahuje právě jeden rodičovský prvek. Každý rodič má množinu potomků, tj. prvky, které bezprostředně obsahuje. Prvky, které rodič obsahuje, ale ne bezprostředně (jsou hlouběji vnořené), jsou jeho následovníci. Potomci stejného rodiče jsou sourozenci. Předcházející sourozenec je prvek, který předchází uvažovanému prvku a je současně sourozenec. např. pro 4. je rodič 1. např. pro 4. jsou potomci 5.,6., 7. např. pro 4. jsou následovníci 8., 9. např. 5., 6., 7. jsou sourozenci např. pro 6. je předcházející sourozenec 5. Obdobně následující sourozenec. např. pro 6. je následující sourozenec 7. Předcházející prvek je prvek, který je předcházející sourozenec nebo předek. Následující prvek je prvek, který je následující sourozenec nebo následovník. např. pro 6. jsou předcházející prvky 5., 4., 1. např. pro 6 jsou následující prvky 7., 8., Selektory v tabulkách stylů Mějme: pravidlo = selektor {seznam_definic} Selektor je přepínač pravidla je to symbolický popis prvku nebo skupiny prvků, které se v dokumentu mohou vyskytovat. Pokud selektor vyhovuje prvku, potom se prvku přiřazuje seznam definic pravidla. Ovšem prvek může vyhovovat více pravidlům, což řeší kaskádování a dědičnost (viz dále). Selektorů je více druhů a existuje i několik operátorů. 13

18 Tabulka 6: typy selektorů a jejich charakteristika [1), str ; 2), str ] skupina typ selektoru popis příklad podpora základní univerzální označuje se symbolem * a vyhovují mu všechny prvky dokumentu rozšířené s atributy typový existence atributu atribut dané hodnoty atribut obsahující danou hodnotu atribut obsahující danou podhodnotu vícenásobné atributy vyhovují mu všechny prvky daného typu značky označuje se x[atribut] a vyhovují mu všechny prvky typu x (i pro * ), které mají (jakkoli) definovaný zvolený atribut označuje se x[atribut=hodn] a vyhovují mu prvky typu x (i pro * ), jejichž atribut má hodnotu přesně rovnu hodn. Hodnotami jsou buď id, nebo jméno třídy nebo řetězce označuje se x[atribut~=hodn[ hodn] * ] (ekvivalentně x.hodn[.hodn] * ) a vyhovují mu prvky typu x (i pro * ), jejichž atribut je atribut=hodn resp. atribut=hodn[ hodn] * pro vícenásobné třídy označuje se x[atribut =hodn] a vyhovují mu prvky typu x (i pro * ), jejichž atribut obsahuje seznam hodnot oddělených spojovníkem (znak - ), a první z nich je právě hodnota hodn označuje se x[atribut[=hodn]? ] + a vyhovují mu prvky typu x (i pro * ), jež odkazuje na více atributů prvku, nebo na více možných hodnot jednoho atributu vlastní třídy označuje se x[class~=hodn[ hodn] * ] (ekvivalentně x.hodn[.hodn] * ) a vyhovují mu prvky typu x (i pro * ), jejichž atribut je class=hodn, resp. class=hodn[ hodn] * pro vícenásobné třídy * {font-size: 10pt} IE5.0 img {border: 1px solid #FF0000} *[alt] {... } img[title] {... } *[alt="popis1"] {...} img[title="titul1"] {...} p[id="odstavec1"] {...} div[class="box1"] {...} *[class~="nadpis"] {...} pro <h1 class="nadpis"> <h1 class="cervena nadpis kurziva"> platí, kdežto pro <h1 class="cervenanadpi s"> neplatí a[lang="en-us"] {...} a[lang="cs"][title] {...} h1[class~="nadpis"] {...} h1[class~="cerveny nadpis kurzivou"] {...} ekvivalentně h1.nadpis {...} h1.cerveny.nadpis.k urzivou {...} NN4.0 IE4.0 OP5.0 IE5.0 resp. 14

19 id označuje se x[id~=hodn] (ekvivalentně x#hodn ) a vyhovují mu prvky typu x (i pro * ), jejichž atribut je id=hodn, hodn musí nabývat unikátních hodnot h1#nadpis {...} *#nadpis {...} #nadpis {...} NN4.0 IE4.0 resp. Kdy použít atribut id a kdy class : to vychází z povahy atributu id z jeho unikátnosti. Atribut id tedy používáme u prvku, o němž víme, že se v dokumentu vyskytuje pouze jednou, a class naopak u prvku, o němž víme, že se vyskytuje vícekrát Kombinování selektorů Selektory je možné vícenásobně kombinovat pomocí operátorů a podle jejich kontextu a vazeb na okolí ve stromu dokumentu, což umožňuje vytvářet velmi složité i podrobné selektory, a tím rozšířit jejich pole působnosti. Tabulka 7: relační operátory mezi selektory [1), str ; 2), str ] operátor popis příklad podpora, mezera slučování umožňuje do jednoho pravidla sloučit více selektorů, které mají mít shodnou definici stylu; dál v kódu je možné pravidla samostatně (pře)definovat následnictví definice stylu pro potomka, nebo následníka uvažovaného prvku > potomek definice stylu pro přímého potomka uvažovaného prvku + sousední sourozenci definice stylu pro následujícího sourozence uvažovaného prvku (časté využití pro oddělovače mezi stejnými prvky) h1, h2 {color: blue} h1 {font-size: 12pt} h1 strong {color: blue}... <h1><strong>nadpis1 </strong></h1> h1>strong {color: blue} platí pro <h1><strong> nadpis1</strong></h1> ale neplatí pro <h1><i><strong> nadpis1</strong></i></h1> li+li { border-top: 1px solid black } NN4.0 IE4.0 IE4.4, Pseudo-prvky a pseudo-třídy Pseudo-prvky a pseudo-třídy umožňují formátování na základě informací existujících mimo strom dokumentu. Pseudo-prvky rozšiřují strom dokumentu o prvky, které v dokumentu neexistují. Pseudo-třídy umožňují rozlišit prvky podle jiných charakteristik, než je jméno a atribut - tedy takových, které nelze odvodit přímo ze stromu dokumentu. Mohou být i dynamické prvky díky aktivitě uživatele do třídy střídavě patří nebo nepatří. Každý klient je interpretuje po svém, proto jimi není vhodné definovat důležité informace pro použití stránky. Pseudo-prvky a pseudo-třídy mohou být uvedeny jen za názvem selektoru. Na velikosti písmen v jejich názvech nezáleží. Některé z nich lze volně kombinovat, zatímco jiné se vylučují. 15

20 Tabulka 8: typy pseudo-prvků i pseudo-tříd a jejich charakteristika [1), str ; 2), str ] kategorie prvky/třídy popis příklad podpora pseudo-prvky pseudo-třídy textové (blokové) vkládání nového obsahu hypertextové odkazy dynamické :first-line :first-letter :before :after :first-child :link :visited :hover :active definice stylu pro první řádek odstavce (může být přiřazen pouze blokovému prvku) definice stylu pro první znak textu iniciála (může být přiřazen pouze blokovému prvku; pokud není vlastnost float: none, tak se chová jako plovoucí prvek) vkládání dat obsahu před prvek (pomocí vlastnosti content ) vkládání dat obsahu za prvek (pomocí vlastnosti content ) vztahuje se k prvku daného typu, který je prvním potomkem nějakého prvku vztahuje se k dosud nenavštíveným odkazům vztahuje se k navštíveným odkazům, s pseudo-třídou :link se vylučuje vztahuje se k prvku, na něhož uživatel ukázal zařízením, ale neaktivoval jej (např. myší) vztahuje se k prvku, jenž byl aktivován (např. v době mezi stiskem a uvolněním tlačítka myši) :focus vztahuje se k prvku, jenž získal zaměření akcí uživatele (např. z klávesnice tabulátor); většinou má uplatnění u formulářových prvků jazykové :lang(jaz) definice jazyka prvku; za jaz dosadíme zkratku zvoleného jazyka (pro stránku definujeme jazyk v meta příkazu a hlavičce protokolu HTTP) p:first-line { font-variant: small-claps } p:first-letter { float:left; fontsize: 18pt } p:before { content: "hlavička"} p:after {content: "hlavička" } div>p:first-child {text-indent: 0px} uvádíme pravidla ve vhodném pořadí od nejobecnějších k nejkonkrétnějším tj. např. pro značku a : a:link {color: red} a:visited {color: green} a.externi:visited {color: purple} a:hover {color: yellow} a:active {color: lime} je možné kombinovat pseudo-třídy: input:focus:hover {...} q:lang(en) {quotes: } q:lang(cs) {quotes: } q:lang(fr) {quotes: } IE5.5 OP5.0 IE4.0 OP5.0 IE4.0 OP Dědičnost a kaskáda CSS Každý prvek dokumentu může vyhovovat více definicím stylu najednou definovaných (i) v několika tabulkách stylů, nebo jako důsledek dědičnosti. Při správném výběru hodnoty se uplatňuje základní princip CSS: kaskádování (viz dále). 16

TVORBA WEBOVÝCH STRÁNEK

TVORBA WEBOVÝCH STRÁNEK TVORBA WEBOVÝCH STRÁNEK Výukový modul TWS_03c Ing. Pavel Chmiel, Ph.D. UNIV 2 - KRAJE Osnova výukového modulu TWS_03c 1. Box model v CSS 2. Obtékání blokových (X)HTML elementů 3. Pozicování blokových (X)HTML

Více

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

Tématická oblast: dědičnost, kaskáda. CSS a média. Stylové předpisy pro různé typy zobrazovacích zařízení Tématická oblast: dědičnost, kaskáda CSS a média Stylové předpisy pro různé typy zobrazovacích zařízení Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je ( Ing. Petr Měrka). VY_32_INOVACE_185

Více

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

Dokument XHTML. Prohlížeč. styl CSS. Výstupní dokument. Soubor DTD CSS 1 Výhody: Udřování prezentace oddělené od dokumentu znamená, že můžete nastavit styly dokumentu pro různá média; Oddělení dokumentu od jeho prezentace znamená menší dokument, což dále znamená, že se

Více

Přehled základních html tagů

Přehled základních html tagů Přehled základních html tagů h1... hlavní nadpis h2... podnadpisy h3... podnadpisy další úrovně p... odstavec strong... tučné písmo b... tučné písmo em... kurzíva i... kurzíva br... zalomení řádku ol...

Více

Rozměry, okraje a rámečky

Rozměry, okraje a rámečky Rozměry, okraje a rámečky 185 Jaké jednotky délky lze v CSS použít Jednotky délky slouží k zapisování vzdálenosti a definují se jimi jak rozměry elementů, tak rozměry okrajů či rámečků. Zapisují se hned

Více

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

Internetové publikování. Doc. Ing. Petr Zámostný, Ph.D. místnost: A-72a tel.: 4222, 4167 (sekretariát ústavu 111) e-mail: petr.zamostny@vscht. Internetové publikování Doc. Ing. Petr Zámostný, Ph.D. místnost: A-72a tel.: 4222, 4167 (sekretariát ústavu 111) e-mail: petr.zamostny@vscht.cz Internetové publikování CSS 4. Formátovací model, pozicování

Více

(X)HTML, CSS a jquery

(X)HTML, CSS a jquery Prezentační vrstva webové aplikace (X)HTML, CSS a jquery jquery Java Scriptová knihovna Ing. Martin Dostal (X)HTML první stránka Textový soubor s příponou.htm nebo.html: moje

Více

O CSS podrobněji. Box model Document flow Layout

O CSS podrobněji. Box model Document flow Layout O CSS podrobněji Box model Document flow Layout O CSS podrobněji Box model Každý element má: -obsah (content) -spadávku (padding) -rámeček (border) -okraj (margin) O CSS podrobněji http://www.w3.org/tr/css21/box.html

Více

Tvorba webových stránek

Tvorba webových stránek Tvorba webových stránek Kaskádové styly Úprava vzhledu webové stránky pomocí atributů má několik nevýhod a úskalí. Atributy nabízejí málo možností úprav. Obtížně se sjednocují změny na různých částech

Více

Vývoj Internetových Aplikací

Vývoj Internetových Aplikací 2 Vývoj Internetových Aplikací HTML a CSS Ing. Michal Radecký, Ph.D. www.cs.vsb.cz/radecky HTML a CSS - Tvorba webových stránek - Struktura - Obsah - Vzhled - Funkcionalita zdroj: http://www.99points.info

Více

Tvorba www-stránek. Příkazy jazyka HTML. Budeme pracovat následovně: Základní struktura webové stránky. Příkazy sekce HEAD

Tvorba www-stránek. Příkazy jazyka HTML. Budeme pracovat následovně: Základní struktura webové stránky. Příkazy sekce HEAD Tvorba www-stránek Webové stránky jsou napsané pomocí jazyka HTML (HyperText Markup Language). Ke tvorbě webových stránek potřebujeme - speciální program umožňuje tvořit stránku bez znalostí HTML-kódu

Více

Zá klady HTML. Tag HTML Párová značka, který definuje webovou stránku. Obsah stránky končí značkou

Zá klady HTML. Tag HTML <HTML> Párová značka, který definuje webovou stránku. Obsah stránky končí značkou Zá klady HTML Jazyk HTML (Hypertext Markup Language) - jedná se o souhrn pravidel pro formatování textu, obrázků atd. pro použítí na webových stránekách. Webovou stránku tvoří prvky, které jsou definovány

Více

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

CSS (Cascading Sytle Sheets) neboli kaskádové styly vznikly jako souhrn metod pro úpravu vzhledu stránek. Kaskádové styly CSS (Cascading Sytle Sheets) neboli kaskádové styly vznikly jako souhrn metod pro úpravu vzhledu stránek. CSS se využívá k formátování obsahu HTML, XHTML a XML dokumentů. Ve srovnání s

Více

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)

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) 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) Formátování HTML Každý text má obsah a formu. Když mluvím o formátu

Více

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é...

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é... Blokový model Každý element tvoří obdélník. Dva druhy obdélníků: - Blokové; - Vložené. CSS 1 blokové To je blokové Zde je dlouhý text v kterém nachazí vložené... vložené Vnější okraje umožňují nastavovat

Více

HTML Hypertext Markup Language

HTML Hypertext Markup Language HTML Hypertext Markup Language je jazyk určený na publikování a distribuci dokumentů na Webu velmi jednoduchý jazyk používá ho mnoho uživatelů má výkonné prostředky (příkazy) k formátování dokumentů (různé

Více

Ukázka knihy z internetového knihkupectví www.kosmas.cz

Ukázka knihy z internetového knihkupectví www.kosmas.cz Ukázka knihy z internetového knihkupectví www.kosmas.cz U k á z k a k n i h y z i n t e r n e t o v é h o k n i h k u p e c t v í w w w. k o s m a s. c z, U I D : K O S 1 8 0 6 5 9 U k á z k a k n i h

Více

Tvorba webových stránek

Tvorba webových stránek Tvorba webových stránek HTML Hypertext Markup Language jazyk pro tvorbu webových stránek Rozšíření: JavaScript, CSS Dynamické stránky: PHP, ASP(X), JSP Prohlížeče: IE, Firefox, Opera, Google Chrome mohou

Více

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

TNPW1 Cvičení 6 24.3.2015 aneta.bartuskova@uhk.cz 6 24.3.2015 aneta.bartuskova@uhk.cz Layout 24.3.2015 aneta.bartuskova@uhk.cz Layout stránky = strukturní i vizuální rozvržení webové stránky Stránka je chápána jako skupina oblastí, každá oblast má svůj

Více

Kaskádové styly (CSS) Cascading Style Sheets

Kaskádové styly (CSS) Cascading Style Sheets CSS verze 22.11. 2007 1 Kaskádové styly (CSS) Cascading Style Sheets Existují 3 druhy zápisu CSS do webové stránky a) Vložením tagu STYLE do hlavičky dokumentu ...definice stylu atributy: type...

Více

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

Mgr. Vlastislav Kučera přednáška č. 2 Mgr. Vlastislav Kučera přednáška č. 2 Struktura stránky hlavička meta tagy titulek stránky připojení stylů,... CSS

Více

Tvorba webových stránek

Tvorba webových stránek Tvorba webových stránek 1 HTML Hyper Text Markup Language = hypertextový značkovací jazyk Slouží pro tvorbu webových stránek, které jsou propojeny hypertextovými odkazy HTML soubor je obyčejný text obalený

Více

Mgr. Vlastislav Kučera lekce č. 2

Mgr. Vlastislav Kučera lekce č. 2 Mgr. Vlastislav Kučera lekce č. 2 Struktura stránky hlavička meta tagy titulek stránky připojení stylů,... CSS to je to, co se

Více

HTML - Úvod. Zpracoval: Petr Lasák

HTML - Úvod. Zpracoval: Petr Lasák HTML - Úvod Zpracoval: Petr Lasák Je značkovací jazyk, popisující obsah HTML stránek Je z rodiny SGML jazyků, jako např. XML, DOCX, XLSX Nejedná se o programovací ale značkovací jazyk Dynamičnost dodávají

Více

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

Tvorba webu. Kaskádové styly (CSS) Martin Urza Tvorba webu Kaskádové styly (CSS) Martin Urza Motivace Proč používat kaskádové styly k formátování HTML? Dovolují více možností formátování než klasické HTML atributy a stále přibývají další (možnosti).

Více

Základy HTML. Autor: Palito

Základy HTML. Autor: Palito Základy HTML Autor: Palito Zobrazení zdrojového kódu Zobrazení zdrojového kódu Každá stránka je na disku nebo na serveru uložena ve formě zdrojového kódu. Ten kód je psaný v jazyce HTML. Když si chcete

Více

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

Název modulu: Tvorba webu pomocí XHTML a CSS začátečníci Název modulu: Označení: C7 Stručná charakteristika modulu Modul vznikl za účelem úvodního seznámení zájemců o problematiku tvorby moderních webových stránek podle standardů W3C. Zahrnuje základní nezbytné

Více

22. Tvorba webových stránek

22. Tvorba webových stránek 22. Tvorba webových stránek Webové stránky jsou spolu s elektronickou poštou nejpoužívanější prostředky internetu. Brouzdáme li internetem používáme nějaký prohlížeč. To, co vidíme na obrazovce v prohlížeči

Více

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

Bloky. Tag Význam Párový. p odstavec nepovinně. br řádkový zlom ne. div oddíl ano. center vycentrování ano. h1 nadpis 1. Bloky Tu se popisuji blokové tagy, což jsou všechny, za kterými se zalamuje řádka. Jde o různé oddíly textu a odstavce. Opakem blokových tagů jsou řádkové (in-line) tagy na značkování textu. Tag Význam

Více

Název: VY_32_INOVACE_PG4119 Tipy a triky, rozdíly mezi prohlížeči

Název: VY_32_INOVACE_PG4119 Tipy a triky, rozdíly mezi prohlížeči Název: VY_32_INOVACE_PG4119 Tipy a triky, rozdíly mezi prohlížeči Autor: Mgr. Tomáš Javorský Datum vytvoření: 06 / 2012 Ročník: 3 Vzdělávací oblast / téma: webdesign, počítačová grafika Anotace: DUM seznamuje

Více

Zobrazování bannerů podporují pouze nově vytvořené šablony motivů vzhledu.

Zobrazování bannerů podporují pouze nově vytvořené šablony motivů vzhledu. Bannerový systém ProEshop od verze 1.13 umožňuje zobrazování bannerů na popředí e-shopu. Bannerový systém je přístupný v administraci e-shopu v nabídce Vzhled, texty Bannerový systém v případě, že aktivní

Více

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

CSS vlastnosti - stručný prehľad. Vlastnosti písma. Vlastnosti farby a pozadí. font-family. font-style. font-variant. font-weight. font-size. Page 1 of 6 CSS vlastnosti - stručný prehľad Vlastnosti písma font-family rodina písma font-style styl písma font-variant varianta písma font-weight duktus písma font-size veľkosť písma font písmo

Více

Kaskádové styly základy grafiky

Kaskádové styly základy grafiky 1 Kaskádové styly základy grafiky Vymezení pojmů Historie Základy stylů 2 Co je to CSS? Vznik CSS a je možné zařadit přibližně do roku 1997. Pojem CSS by se dal shrnout definicí :"souhrn pravidel a metod

Více

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

Referenční přehled vlastností CSS1 (Cascading Style Sheets, level 1) Stránka č. 1 z 9 Referenční přehled CSS1 (Cascading Style Sheets, level 1) Tento dokument shrnuje jdůležitější informace o káskadových stylech dokumentů. Informace vycházejí z oficialního doporučení konsorcia

Více

ŠKODA Portal Platform

ŠKODA Portal Platform ŠKODA Portal Platform Struktura LESS stylů Jan Obrátil Účel dokumentu Účelem tohoto dokumentu je vysvětlit strukturu stylů v Portálové Platformě tak, aby bylo možné je správně použít a rozšířit je pro

Více

PŘÍRUČKA. Správa obsahu webové prezentace. Formátování textu

PŘÍRUČKA. Správa obsahu webové prezentace. Formátování textu PŘÍRUČKA Správa obsahu webové prezentace Formátování textu Verze: 6.2 Datum: 4.12.2009 Autor: Ing. Michal Šídlo, michal.sidlo@netgenium.com Společnost: NetGenium s.r.o., www.netgenium.com Obsah 1. Základní

Více

Tvorba WWW stránek. přehled technologií používaných na webu principy jednotlivých technologií a možnosti jejich vzájemného kombinování

Tvorba WWW stránek. přehled technologií používaných na webu principy jednotlivých technologií a možnosti jejich vzájemného kombinování Tvorba WWW stránek přehled technologií používaných na webu principy jednotlivých technologií a možnosti jejich vzájemného kombinování HTML/XHTML kaskádové styly PHP spolupráce PHP s databázemi Technologie

Více

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

CSS - stručná reference kaskádových stylů 1. font a parametry písma font, font-family, font-size, font-style, font-variant, font-weight 1.1 font Nastavuje většinu parametrů textu najednou. Jednotlivé atributy naleznete v kapitolách 1.2-1.6 a line-height

Více

Styly odstavců. Word 2010. Přiřazení stylu odstavce odstavci. Změna stylu odstavce

Styly odstavců. Word 2010. Přiřazení stylu odstavce odstavci. Změna stylu odstavce Styly odstavců V textu, který přesahuje několik stránek a je nějakým způsobem strukturovaný (což znamená, že se dá rozdělit na části (v knize jim říkáme kapitoly) a jejich podřízené části (podkapitoly),

Více

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

Internetové publikování. Doc. Ing. Petr Zámostný, Ph.D. místnost: A-72a tel.: 4222, 4167 (sekretariát ústavu 111) e-mail: petr.zamostny@vscht. Internetové publikování Doc. Ing. Petr Zámostný, Ph.D. místnost: A-72a tel.: 4222, 4167 (sekretariát ústavu 111) e-mail: petr.zamostny@vscht.cz Internetové publikování CSS 3. část Vztahy mezi elementy»

Více

================================================================================ =====

================================================================================ ===== Název: VY_32_INOVACE_PG4101 Základní struktura HTML stránky Datum vytvoření: 01 / 2012 Anotace: DUM seznamuje se základní strukturou a členěním HTML stránky, s jednotlivými složkami - HTML, CSS, externí

Více

Název: VY_32_INOVACE_PG4113 Relativní pozicovaní a jeho využití

Název: VY_32_INOVACE_PG4113 Relativní pozicovaní a jeho využití Název: VY_32_INOVACE_PG4113 Relativní pozicovaní a jeho využití Autor: Mgr. Tomáš Javorský Datum vytvoření: 05 / 2012 Ročník: 3 Vzdělávací oblast / téma: webdesign, počítačová grafika Anotace: Seznámení

Více

Jazyk XSL XPath XPath XML. Jazyk XSL - rychlá transformace dokumentů. PhDr. Milan Novák, Ph.D. KIN PF JU České Budějovice. 9.

Jazyk XSL XPath XPath XML. Jazyk XSL - rychlá transformace dokumentů. PhDr. Milan Novák, Ph.D. KIN PF JU České Budějovice. 9. Jazyk XSL - rychlá transformace dokumentů 9. prosince 2010 Osnova 1 Jazyk XSL Úvod Princip zpracování pomocí stylů Formátování dokumentu pomocí XSL FO Osnova 1 Jazyk XSL Úvod Princip zpracování pomocí

Více

Tvorba stránek v HTML ve Wordu

Tvorba stránek v HTML ve Wordu Tvorba stránek v HTML ve Wordu HTML (hypertext markup language hypertextový značkovací jazyk). Internetová stránka jako soubor s příponou htm nebo html. Je to skoro obyčejný textový soubor obohacený o

Více

Kódy pro formát čísla

Kódy pro formát čísla Kódy pro formát čísla y pro formát čísel se mohou skládat až z tří částí oddělených středníkem (;). Pokud formátovací kód obsahuje dvě části, první část se použije pro kladné hodnoty a nulu, druhá část

Více

Reliance 3 design OBSAH

Reliance 3 design OBSAH Reliance 3 design Obsah OBSAH 1. První kroky... 3 1.1 Úvod... 3 1.2 Založení nového projektu... 4 1.3 Tvorba projektu... 6 1.3.1 Správce stanic definice stanic, proměnných, stavových hlášení a komunikačních

Více

. Grafika a plovoucí prostředí. Zpracování textů na počítači. Ing. Pavel Haluza, Ph.D. ústav informatiky PEF MENDELU v Brně haluza@mendelu.

. Grafika a plovoucí prostředí. Zpracování textů na počítači. Ing. Pavel Haluza, Ph.D. ústav informatiky PEF MENDELU v Brně haluza@mendelu. Grafika a plovoucí prostředí Zpracování textů na počítači Ing Pavel Haluza, PhD ústav informatiky PEF MENDELU v Brně haluza@mendelucz Kreslení vektorových obrazů Příklad \unitlength=1mm \begin{picture}(50,30)(10,20)

Více

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

Název modulu: XHTML a CSS pokročilé techniky tvorby webových stránek Název modulu: XHTML a CSS pokročilé techniky tvorby webových stránek Označení: C8 Stručná charakteristika modulu Modul si klade za cíl seznámit detailněji s tvorbou webových stránek pomocí kódovacího jazyka

Více

Přehledy pro Tabulky Hlavním smyslem této nové agendy je jednoduché řazení, filtrování a seskupování dle libovolných sloupců.

Přehledy pro Tabulky Hlavním smyslem této nové agendy je jednoduché řazení, filtrování a seskupování dle libovolných sloupců. Přehledy pro Tabulky V programu CONTACT Professional 5 naleznete u firem, osob a obchodních případů záložku Tabulka. Tuto záložku lze rozmnožit, přejmenovat a sloupce je možné definovat dle vlastních požadavků

Více

Internetový přístup do databáze FADN CZ - uživatelská příručka Modul FADN RESEARCH / DATA

Internetový přístup do databáze FADN CZ - uživatelská příručka Modul FADN RESEARCH / DATA Internetový přístup do databáze FADN CZ - uživatelská příručka Modul FADN RESEARCH / DATA Modul FADN RESEARCH je určen pro odborníky z oblasti zemědělské ekonomiky. Modul neomezuje uživatele pouze na předpřipravené

Více

PODPORA ELEKTRONICKÝCH FOREM VÝUKY

PODPORA ELEKTRONICKÝCH FOREM VÝUKY I N V E S T I C E D O R O Z V O J E V Z D Ě L Á V Á N Í PODPORA ELEKTRONICKÝCH FOREM VÝUKY CZ.1.07/1.1.06/01.0043 Tento projekt je financován z prostředků ESF a státního rozpočtu ČR. SOŠ informatiky a

Více

FORMÁTOVÁNÍ 2. Autor: Mgr. Dana Kaprálová. Datum (období) tvorby: září, říjen 2013. Ročník: sedmý. Vzdělávací oblast: Informatika a výpočetní technika

FORMÁTOVÁNÍ 2. Autor: Mgr. Dana Kaprálová. Datum (období) tvorby: září, říjen 2013. Ročník: sedmý. Vzdělávací oblast: Informatika a výpočetní technika Autor: Mgr. Dana Kaprálová FORMÁTOVÁNÍ 2 Datum (období) tvorby: září, říjen 2013 Ročník: sedmý Vzdělávací oblast: Informatika a výpočetní technika 1 Anotace: Žáci se seznámí se základní obsluhou tabulkového

Více

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

Dokument ve formátu webové stránky vytvořený pomocí XHTML a CSS Výstupový indikátor 06.43.19 Motivační název: Autor: Vzdělávací oblast: Vzdělávací obory: Ročník: Časový rozsah: Pomůcky: Projekt Integrovaný vzdělávací systém města Jáchymov - Mosty Tvorba webu I Petr

Více

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.

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. Pseudotřídy Využití pseudotříd pro stylování odkazů ve webových dokumentech Pseudotřídy VY_32_INOVACE_01_03_01 Vytvořeno březen 2013 Žák se naučí smysluplně využívat pseudotříd pro stylování odkazů ve

Více

Vkládání prvků do dokumentu MS Word

Vkládání prvků do dokumentu MS Word Vkládání prvků do dokumentu MS Word 1. Vkládání Do dokumentu můžeme vložit celou řadu prvků, počínaje čísly stránek a obrázky konče. 1.1. Konec stránky Pokud chceme, aby odstavec byl vždy posledním na

Více

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

Škola. Téma hodiny 08.08 HTML - Základní návrh stránky Informační a komunikační technologie Škola Střední odborná škola a Střední odborné učiliště, Hustopeče, Masarykovo nám. 1 Autor Ing. Jiří Tinka Číslo projektu CZ.1.07/1.5.00/34.0394 Číslo DUM VY_32_INOVACE_18_ICT_08.08a Název Tvorba webu

Více

INTERSTENO 2013Ghent Mistrovstvísvta v profesionálním word processingu

INTERSTENO 2013Ghent Mistrovstvísvta v profesionálním word processingu POUŽITÝ OPERAČNÍ SYSTÉM POUŽITÝ SOFTWARE PRO WORD PROCESSING SOUTĚŽNÍ ID A 1 Instrukce pro účastníky Otevřete dokument TRANSPORT.DOC, ihned uložte jako TRANSPORTXXX.DOCneboDOCX,kde XXX je Vašesoutěžní

Více

APLIKACE XML PRO INTERNET

APLIKACE XML PRO INTERNET APLIKACE XML PRO INTERNET Jaroslav Ráček Fakulta Informatiky, Masarykova Universita Brno Abstrakt Text je věnován možnostem využití XML technologie pro prezentaci dokumentů pomocí Internetu. V úvodu je

Více

TVORBA TEXTOVÉHO DOKUMENTU PROSTŘEDKY, PŘENOSITELNOST

TVORBA TEXTOVÉHO DOKUMENTU PROSTŘEDKY, PŘENOSITELNOST TVORBA TEXTOVÉHO DOKUMENTU PROSTŘEDKY, PŘENOSITELNOST 1 Tvorba dokumentu - prostředky Psací stroj Od psaní na stroji pochází pojem normostrana Textové editory (např. T602) Slouží k tvorbě textu členěného

Více

Tvorba fotogalerie v HTML str.1

Tvorba fotogalerie v HTML str.1 Tvorba fotogalerie v HTML str.1 obr. A obr. B 1) Spustíme PsPad, vytvoříme nový dokument a otevře se nám okno nový soubor, kde si můžeme zvolit jaký chceme typ. My označíme HTML a potvrdíme. 2) Pro správné

Více

K 2 - Základy zpracování textu

K 2 - Základy zpracování textu Radek Maca Makovského 436 Nové Město na Moravě 592 31 tel. 0776 / 274 152 e-mail: rama@inforama.cz http://www.inforama.cz K 2 - Základy zpracování textu Mgr. Radek Maca Word I 1 slide ZÁKLADNÍ POJMY PRVKY

Více

1. Začínáme s FrontPage 2003 11

1. Začínáme s FrontPage 2003 11 Úvod 9 1. Začínáme s FrontPage 2003 11 Instalace programu 12 Spuštění a ukončení programu 15 Základní ovládání 16 Hledání souborů 30 Najít a nahradit 31 Tisk 32 Schránka sady Office 34 Nápověda 36 Varianty

Více

Tvorba WWW stránek. Mojmír Volf mojmir.volf@tul.cz https://www.nti.tul.cz/wiki/wikiuser:mojmir.volf 485 353 675

Tvorba WWW stránek. Mojmír Volf mojmir.volf@tul.cz https://www.nti.tul.cz/wiki/wikiuser:mojmir.volf 485 353 675 Tvorba WWW stránek Mojmír Volf mojmir.volf@tul.cz https://www.nti.tul.cz/wiki/wikiuser:mojmir.volf 485 353 675 Zdroje KRUG: Web design - nenuťte uživatele přemýšlet.. Computer Press, 2003. PROKOP M.: CSS

Více

SkautIS Remote Components absolventská práce

SkautIS Remote Components absolventská práce MUŠKA Moravská úřednická škola SkautIS Remote Components absolventská práce Martin Jašek Jedlík středisko Prof. Skoumala Přerov MUŠKA 2010/11 Obsah Úvod... 3 1. Seznámení se SkautIS komponentami... 3 1.1.

Více

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

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 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 Formátování HTML Každý text má obsah a formu. Když mluvím o formátu

Více

Informatika pro moderní fyziky (8) Javascript, CSS - stylování dokumentů, SVG - tvorba obrázků, složitější interaktivní dokument

Informatika pro moderní fyziky (8) Javascript, CSS - stylování dokumentů, SVG - tvorba obrázků, složitější interaktivní dokument Informatika pro moderní fyziky (8) Javascript, CSS - stylování dokumentů, SVG - tvorba obrázků, složitější interaktivní dokument František HAVLŮJ e-mail: haf@ujv.cz ÚJV Řež oddělení Reaktorové fyziky a

Více

Inovace výuky prostřednictvím šablon pro SŠ

Inovace výuky prostřednictvím šablon pro SŠ Název projektu Číslo projektu Název školy Autor Název šablony Název DUMu Stupeň a typ vzdělávání Vzdělávací oblast Vzdělávací obor Tematický okruh Inovace výuky prostřednictvím šablon pro SŠ CZ.1.07/1.5.00/34.0748

Více

Webová aplikace Znalostní testy online UŽIVATELSKÁ PŘÍRUČKA

Webová aplikace Znalostní testy online UŽIVATELSKÁ PŘÍRUČKA Webová aplikace Znalostní testy online UŽIVATELSKÁ PŘÍRUČKA 2005 Lukáš Trombik OBSAH ÚVOD... 1 SPUŠTĚNÍ... 1 POPIS OVLÁDÁNÍ INFORMAČNÍHO SYSTÉMU... 1 POPIS KLIENTSKÉ ČÁSTI... 1 POPIS ADMINISTRÁTORSKÉ ČÁSTI...

Více

Jazyky pro popis dat

Jazyky pro popis dat Realizováno za finanční podpory ESF a státního rozpočtu ČR v rámci v projektu Zkvalitnění a rozšíření možností studia na TUL pro studenty se SVP reg. č. CZ.1.07/2.2.00/29.0011 Jazyky pro popis dat Pavel

Více

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

Předmluva k druhému vydání 13. Úvod 17. ČÁST 2 Vytváření dokumentů XML 65 7 Stručný obsah Předmluva k druhému vydání 13 Úvod 17 ČÁST 1 Začínáme 27 Kapitola 1 Proč XML 29 Kapitola 2 Vytváření a zobrazení vašeho prvního dokumentu XML 45 ČÁST 2 Vytváření dokumentů XML 65 Kapitola

Více

KAPITOLA 3 - ZPRACOVÁNÍ TEXTU

KAPITOLA 3 - ZPRACOVÁNÍ TEXTU KAPITOLA 3 - ZPRACOVÁNÍ TEXTU KLÍČOVÉ POJMY textové editory formát textu tabulka grafické objekty odrážky a číslování odstavec CÍLE KAPITOLY Pracovat s textovými dokumenty a ukládat je v souborech různého

Více

Internetový přístup do databáze FADN CZ - uživatelská příručka Modul FADN BASIC

Internetový přístup do databáze FADN CZ - uživatelská příručka Modul FADN BASIC Internetový přístup do databáze FADN CZ - uživatelská příručka Modul FADN BASIC Modul FADN BASIC je určen pro odbornou zemědělskou veřejnost bez větších zkušeností s internetovými aplikacemi a bez hlubších

Více

Výukový materiál KA č.4 Spolupráce se ZŠ

Výukový materiál KA č.4 Spolupráce se ZŠ Výukový materiál KA č.4 Spolupráce se ZŠ Modul: Téma workshopu: Výpočetní technika Co je to internet? Jak si udělat vlastní www stránku? Vypracovala: Ing. Lenka Hellová Termín workshopu: 30. říjen 2012

Více

Základy WWW publikování

Základy WWW publikování Ing. Igor Kopetschke Oddělení aplikované informatiky Ústav nových technologií a aplikované informatiky Fakulta mechatroniky a mezioborových inženýrských studií Technická univerzita v Liberci Email : igor.kopetschke@tul.cz

Více

2 PŘÍKLAD IMPORTU ZATÍŽENÍ Z XML

2 PŘÍKLAD IMPORTU ZATÍŽENÍ Z XML ROZHRANÍ ESA XML Ing. Richard Vondráček SCIA CZ, s. r. o., Thákurova 3, 160 00 Praha 6 www.scia.cz 1 OTEVŘENÝ FORMÁT Jednou z mnoha užitečných vlastností programu ESA PT je podpora otevřeného rozhraní

Více

Práce s administračním systémem internetových stránek Podaných rukou

Práce s administračním systémem internetových stránek Podaných rukou Práce s administračním systémem internetových stránek Podaných rukou 2011 Ing. Jakub Matas Přihlášení a uživatelský účet Přihlášení Přihlášení do aplikace lze dvěma způsoby: 1. Pomocí panelu ve vrchní

Více

OBSAH. Kontrola aktualizací... 18

OBSAH. Kontrola aktualizací... 18 2013 Albatros Media a. s. Toto CD je součástí knihy Adobe InDesign CS6, Oficiální výukový kurz a je samostatně neprodejné. Všechna práva vyhrazena. Nelegální kopie tohoto disku jsou zakázány. K2059_potisk.indd

Více

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

13. Vytváření webových stránek 13. Vytváření webových stránek značkovací jazyk HTML, základní členění dokumentu, odkazy, tabulky, seznamy, obrázky, HTML editory Značkovací jazyk HTML HTML - Hypertext markup Language (hypertextový značkovací

Více

www.zlinskedumy.cz Pracovní list VY_32_INOVACE_33_19 Databáze Databáze Databáze Ing. Petr Vilímek

www.zlinskedumy.cz Pracovní list VY_32_INOVACE_33_19 Databáze Databáze Databáze Ing. Petr Vilímek VY_32_INOVACE_33_19 Pracovní list Škola Název projektu, reg. č. Vzdělávací oblast Vzdělávací obor Tematický okruh Téma Tematická oblast Střední průmyslová škola Zlín Inovace výuky prostřednictvím ICT v

Více

Algoritmizace a programování

Algoritmizace a programování Algoritmizace a programování Výrazy Operátory Výrazy Verze pro akademický rok 2012/2013 1 Operace, operátory Unární jeden operand, operátor se zapisuje ve většině případů před operand, v některých případech

Více

24 Uživatelské výběry

24 Uživatelské výběry 24 Uživatelské výběry Uživatelský modul Uživatelské výběry slouží k vytváření, správě a následnému používání tématicky seskupených osob a organizací včetně jejich kontaktních údajů. Modul umožňuje hromadnou

Více

Obsah KAPITOLA 1 Několik slov o Wordu 2007 9

Obsah KAPITOLA 1 Několik slov o Wordu 2007 9 KAPITOLA 1 Několik slov o Wordu 2007 9 Pás karet 10 Další možnosti ovládání Wordu 12 Nastavení Wordu 13 Ovládání Wordu 2007 klávesnicí 14 KAPITOLA 2 Základní operace 17 Základní nastavení 17 Rozdělení

Více

KAPITOLA 5 - POKROČILÉ ZPRACOVÁNÍ TEXTU

KAPITOLA 5 - POKROČILÉ ZPRACOVÁNÍ TEXTU KAPITOLA 5 - POKROČILÉ ZPRACOVÁNÍ TEXTU KLÍČOVÉ POJMY Oddíly, styly, poznámka pod čarou, revize, obsah, rejstřík, záložka, citace a seznamy literatury, vzorce, vložené a propojené objekty, oddíly, zabezpečení.

Více

METODICKÝ POKYN PRÁCE S MS Word MÍRNĚ POKROČILÍ. Tento projekt je spolufinancován Evropským sociálním fondem a státním rozpočtem České republiky.

METODICKÝ POKYN PRÁCE S MS Word MÍRNĚ POKROČILÍ. Tento projekt je spolufinancován Evropským sociálním fondem a státním rozpočtem České republiky. METODICKÝ POKYN PRÁCE S MS Word MÍRNĚ POKROČILÍ Formátování textu Text formátujeme (určujeme jeho vlastnosti) na pásu karet DOMŮ. U textu můžeme formátovat font, velikost písma, řez, barvu písma, barvu

Více

Jak využít kancelářské aplikace ve výuce MS Office 2007. Gymnázium a SOŠ Orlová 14. 11. 2007 Ing. Marta Slawinská

Jak využít kancelářské aplikace ve výuce MS Office 2007. Gymnázium a SOŠ Orlová 14. 11. 2007 Ing. Marta Slawinská Jak využít kancelářské aplikace ve výuce MS Office 2007 Gymnázium a SOŠ Orlová 14. 11. 2007 Ing. Marta Slawinská Cíle školení Seznámit se s novým uživatelským rozhraním MS Office 2007 a jeho specifikacemi

Více

Internetové technologie, cvičení č. 5

Internetové technologie, cvičení č. 5 Internetové technologie, cvičení č. 5 Náplň cvičení Obsahem 5. cvičení předmětu Internetové technologie je ukázka a procvičení XHTML značek a atributů používaných při vytváření hypertextových odkazů a

Více

WWW a HTML. Základní pojmy. Ivo Peterka

WWW a HTML. Základní pojmy. Ivo Peterka WWW a HTML Základní pojmy WWW World Wide Web systém navzájem propojených stránek Stránky se mohou skládat z částí nacházejících se v různých částech světa. HTML HyperText Markup Language Slouží k psaní

Více

Microsoft Office Excel 2003

Microsoft Office Excel 2003 Microsoft Office Excel 2003 Školení učitelů na základní škole Meteorologická Maturitní projekt SSPŠ 2013/2014 Vojtěch Dušek 4.B 1 Obsah 1 Obsah... 2 2 Seznam obrázků... 3 3 Základy programu Excel... 4

Více

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

Kaskádové styly 4IZ228 tvorba webových stránek a aplikací 4IZ228 tvorba webových stránek a aplikací Jirka Kosek Poslední modifikace: $Date: 2014/10/02 11:38:43 $ Obsah Úvod... 3 Důvody vzniku CSS... 4 Problémy s rádoby graficky dokonalými stránkami... 5 Řešení

Více

DATABÁZE MS ACCESS 2010

DATABÁZE MS ACCESS 2010 DATABÁZE MS ACCESS 2010 KAPITOLA 5 PRAKTICKÁ ČÁST TABULKY POPIS PROSTŘEDÍ Spuštění MS Access nadefinovat název databáze a cestu k uložení databáze POPIS PROSTŘEDÍ Nahoře záložky: Soubor (k uložení souboru,

Více

Textové editory. Ing. Luděk Richter

Textové editory. Ing. Luděk Richter Textové editory Ing. Luděk Richter Střední škola, Havířov-Šumbark, Sýkorova 1/613, příspěvková organizace Tento výukový materiál byl zpracován v rámci akce EU peníze středním školám - OP VK 1.5. Výuková

Více

HTML. ICT_01., 02. konzultace; 2. ročník 1/6

HTML. ICT_01., 02. konzultace; 2. ročník 1/6 ICT_01., 02. konzultace; 2. ročník 1/6 HTML Vystavení vlastních dat na Internetu Každý uživatel Internetu, který chce svoje webové stránky publikovat na Internetu potřebuje: - místo na webovém serveru,

Více

Úvod do MS Access. Modelování v řízení. Ing. Petr Kalčev

Úvod do MS Access. Modelování v řízení. Ing. Petr Kalčev Úvod do MS Access Modelování v řízení Ing. Petr Kalčev Postup při tvorbě aplikace Vytvoření tabulek Vytvoření relací Vytvoření dotazů Vytvoření formulářů Vytvoření sestav Tabulky Slouží k definování polí,

Více

POKROČILÉ ZPRACOVÁNÍ TEXTU

POKROČILÉ ZPRACOVÁNÍ TEXTU POKROČILÉ ZPRACOVÁNÍ TEXTU Hana Rohrová, Roman Rohr Cíle kurzu Po ukončení tohoto kurzu budete schopni: používat pokročilé formátování textu, odstavců, sloupců a tabulek, převádět text na tabulku a naopak,

Více

Možnosti tisku v MarushkaDesignu

Možnosti tisku v MarushkaDesignu 0 Možnosti tisku v MarushkaDesignu OBSAH 1 CÍL PŘÍKLADU...2 2 PRÁCE S PŘÍKLADEM...2 3 UKÁZKA DIALOGOVÉHO OKNA...3 4 STRUČNÝ POPIS PŘÍKLADU V MARUSHKADESIGNU...5-1 - 1 Cíl příkladu V tomto příkladu si ukážeme

Více

HROMADNÉ ÚPRAVY NAJÍT A NAHRADIT

HROMADNÉ ÚPRAVY NAJÍT A NAHRADIT HROMADNÉ ÚPRAVY NAJÍT A NAHRADIT Funkce Najít a nahradit slouží k rychlému vyhledávání určitých slov a jejich nahrazování jinými slovy. Lze hledat i určité varianty slov a nahrazovat je buď hromadně (všechny

Více

Elektronické publikování - prezentace. 23. dubna 2009 VŠB - TUO. Beamer - grafické zpracování prezentace. Rostislav Šuta, sut017.

Elektronické publikování - prezentace. 23. dubna 2009 VŠB - TUO. Beamer - grafické zpracování prezentace. Rostislav Šuta, sut017. Beamer - Elektronické publikování - VŠB - TUO 23. dubna 2009 Obsah 1 2 3 4 5 6 Obsah 1 2 3 4 5 6 schémata barvy písma změna fontu vnitřní schémata vnější schémata Obsah Prezentace bez navigace e stromovou

Více

KAPITOLA 4 ZPRACOVÁNÍ TEXTU

KAPITOLA 4 ZPRACOVÁNÍ TEXTU KAPITOLA 4 ZPRACOVÁNÍ TEXTU TABULÁTORY Jsou to značky (zarážky), ke kterým se zarovná text. Můžeme je nastavit kliknutím na pravítku nebo v dialogovém okně, které vyvoláme kliknutím na tlačítko Tabulátory

Více

Nový způsob práce s průběžnou klasifikací lze nastavit pouze tehdy, je-li průběžná klasifikace v evidenčním pololetí a školním roce prázdná.

Nový způsob práce s průběžnou klasifikací lze nastavit pouze tehdy, je-li průběžná klasifikace v evidenčním pololetí a školním roce prázdná. Průběžná klasifikace Nová verze modulu Klasifikace žáků přináší novinky především v práci s průběžnou klasifikací. Pro zadání průběžné klasifikace ve třídě doposud existovaly 3 funkce Průběžná klasifikace,

Více