CSS – style Mgr. Lenka Švancarová. CSS – značka style (textstyle.html)

Slides:



Advertisements
Podobné prezentace
Základy HTML – vkládání objektů
Advertisements

Technologie pro publikování na webu 1
TVORBA WEBOVÝCH STRÁNEK
Jazyk HTML. Zdrojový kód  Elementy obsah obsah př. důležité př. důležité př. př.
Štěpán Šípal Gymnázium Čakovice. Dnešní témata  Vznik XHTML a předchůdci  Základní prvky XHTML dokumentu  Tagy a atributy  Elementy a jejich druhy.
Tvorba webových stránek
TVORBA WEBOVÝCH STRÁNEK
WWW stránky.
<. DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4
Základní škola a mateřská škola Bzenec Číslo projektu: CZ.1.07/1.4.00/ Číslo a název šablony klíčové aktivity: III/2: využívání ICT – inovace Vypracoval/a:
CSS a HTML 5. HTML 5 HTML5 je nová verze specifikace značkovacího jazyka HTML, která přináší podstatné změny v technologiích webových stránek. HTML5 umožňuje.
VY_32_INOVACE_4.3.IV1.02/Ku Html dokument a jeho struktura Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Pavla Kubínková CZ.1.07/1.5.00/
TNPW1 Cvičení
Úvod do html kódu. Roman Hendrich
Kaskádové styly (Cascading Style Sheets, CSS) slouží k formátování HTML prvků. Pomocí kaskádových stylů lze nastavit font, řez písma, velikost písma, zarovnání,
Tvorba www stránek SYNTAXE ICT 4.ročník. Obsah TAGY TAGY ATRIBUTY ATRIBUTY KŘÍŽENÍ TAGŮ KŘÍŽENÍ TAGŮ VELIKOST PÍSMEN VELIKOST PÍSMEN MEZERY VE ZDROJOVÉM.
TVORBA WEBOVÝCH STRÁNEK
Návrh a tvorba WWW Cvičení 2 CSS 3. Cascading Style Sheet Cascading Style Sheet (kaskádové styly) je stylový jazyk, který se používá pro popis vzhledu.
PHP – vkládání souborů a html 5
Internetové publikování Doc. Ing. Petr Zámostný, Ph.D. místnost: A-72a tel.: 4222, 4167 (sekretariát ústavu 111)
XHTML Tvorba webových stránek. Vývoj značkovacích jazyků HTML – HyperText Markup Language  Značkovací jazyk pro vytváření www stránek. Pomocí značek.
Formátování textu. Odstavce  tvoříme párovou značkou  text bude od ostatního textu oddělen Konec řádky  nepárová značka způsobuje ukončení řádku a.
TNPW1 Technologie pro publikování na webu
Jazyk HTML.
VY_32_INOVACE_4.3.IVT1.11/Oc Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Ing. Jaroslav Ochodek CZ.1.07/1.5.00/ Tvorba webových.
Třídy, generické třídy, pseudotřídy
Odkazy Pomocí odkazu se lze pohybovat mezi stránkami. Cílem může být další stránka nebo identifikátor na aktuální stránce. Pomocí odkazu se lze pohybovat.
Kaskádové styly Cascading Style Sheets. Využití CSS jde o jazyk pro popis způsobu zobrazení stránek napsaných v jazycích HTML, XHTML nebo XML umožňuje.
Číslo šablony: III/2 VY_32_INOVACE_P4_3.13 Tematická oblast: Aplikační software pro práci s informacemi II. CSS - vlastnosti Typ: DUM - kombinovaný Předmět:
CSS – rámečky Mgr. Lenka Švancarová.
KASKÁDOVÉ STYLY SYNTAXE STYLŮ PRAVIDLO DEFINUJÍCÍ STYL SE SKLÁDÁ Z NEJMÉNĚ TŘÍ ZÁKLADNÍCH ČÁSTÍ: * SELEKTOR ZNAČKY * SLOŽENÉ ZÁVORKY A V NICH JE.
Word – Zásady psaní textu
Číslo projektuCZ.1.07/1.5.00/ Číslo materiáluVY_32_INOVACE_258 Název školyGymnázium, Tachov, Pionýrská 1370 Autor Ing. Roman Bartoš Předmět Informatika.
Gymnázium, Obchodní akademie a Jazyková škola s právem státní jazykové zkoušky Hodonín Tvorba webu Úvod do CSS 1.
Kaskádové styly - CSS.
Maturitní okruh 22: Úvod do HTML. Značkovací a klasické jazyky Klasické: převládá strukturovaný text (programovací kód), skripty jsou prováděny na straně.
Základní škola a mateřská škola Bzenec Číslo projektu: CZ.1.07/1.4.00/ Číslo a název šablony klíčové aktivity: III/2: využívání ICT – inovace Vypracoval/a:
HTML, XHTML a CSS Základy jazyků značek.
CSS – vlastnosti textu text-align (vodorovné zarovnání)
TNPW1 Cvičení
Kaskádové styly tvorba webových stránek
CSS styly Kaskádové styly (CSS – Cascading Style Sheets) jsou prostředkem, který zajišťuje jednotný vzhled publikovaných stránek. Technologii CSS podporují.
CSS – selektory Mgr. Lenka Švancarová. CSS – selektory Hromadná deklarace slouží ke zkrácení zápisu.  Místo h1 { color: #996666; background-color: rgb(255,255,102);}
KASKÁDOVÉ STYLY 1. 2 PRVNÍ STANDARD (CSS1) BYL PŘEDSTAVEN V ROCE 1996, PROTO STARŠÍ PROHLÍŽEČE ("ČTYŘKOVÉ" VERZE) IE A NN KASKÁDOVÉ STYLY NEPODPORUJÍ.
CSS Cascading Style Sheets Kaskádové styly
XHTML – odkazy Mgr. Lenka Švancarová Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Lenka Švancarová. Dostupné z Metodického portálu.
XHTML – obrázky Mgr. Lenka Švancarová Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Lenka Švancarová. Dostupné z Metodického portálu.
CSS – float a clear Mgr. Lenka Švancarová. CSS – float Vlastnost určuje obtékání prvku. Hodnoty:  right – prvek bude zarovnán vpravo, okolní obsah stránky.
XHTML – formátování textu, vodorovná čára Mgr. Lenka Švancarová.
WWW stránky – Úvod Mgr. Lenka Švancarová.
HTML 5 a CSS 3.
VY_32_INOVACE_4.3.IVT1.05/Ku Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Pavla Kubínková CZ.1.07/1.5.00/ CSS.
Základní pojmy (1) Nejpoužívanější internetové prohlížeče: Google Chrome (32.0.x), Mozilla Firefox (27.0), Internet Explorer (11.0.2), Opera (19.0.x),
Párová a nepárová značka, atributy a jejich hodnoty
VY_32_INOVACE_4.3.IVT1.13/Oc Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Ing. Jaroslav Ochodek CZ.1.07/1.5.00/ Tvorba webových.
VY_32_INOVACE_4.3.IVT1.06/Ku Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Pavla Kubínková CZ.1.07/1.5.00/ CSS pozicování.
Tvorba www stránek CSS (Úvod do kaskádových stylů (Úvod do kaskádových stylů) Ing. Miroslav Vachůn, Ph.D.
Kaskádové styly Cascading Style Sheets. Využití CSS jde o jazyk pro popis způsobu zobrazení stránek napsaných v jazycích HTML, XHTML nebo XML umožňuje.
VY_32_INOVACE_4.3.IVT1.07/Ku Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Pavla Kubínková CZ.1.07/1.5.00/ CSS formátování.
Styly CSS VýhodyDruhyZápis. Výhody CSS oddělení struktury od formátování oddělení struktury od formátování přilinkováním souboru styl.css lze formátovat.
CSS – menu vlevo Mgr. Lenka Švancarová. CSS – menu vlevo.
Inf Webová stránka, princip HTML a CSS. Výukový materiál Číslo projektu: CZ.1.07/1.5.00/ Šablona: III/2 Inovace a zkvalitnění výuky prostřednictvím.
Kaskádové styly IS a webové prezentace cvičení. Proč používat CSS? Řadu grafických charakteristik dokumentu lze nastavit pomocí parametrů jednotlivých.
HTML pokračování. Co obsahuje každý html dokument? stránka stránka ahoj světe HTML.
Elektronické učební materiály - II. stupeň Informatika – aplikace informačních technologií Autor: Bc. Pavel Šiktanc Internetové stránky II. Co se všechno.
1 Kurz XHTML a CSS Část 2: Popis vzhledu dokumentu za pomocí CSS - kaskádových stylů.
Krátký úvodní kurz HTML Jenyk Obecně 1 - html  V HTML jazyce nezáleží na rozložení a délce řádku, extrémem je napsat celý program v jednom řádku.
Kaskádové styly CSS Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Ing. Jitka Vlčková. Dostupné z Metodického portálu ISSN.
ADOBE DREAMWEAVER CS6 CSS - Formátování textu
Inovace školy – Dobříš, EUpenizeskolam.cz
Transkript prezentace:

CSS – style Mgr. Lenka Švancarová

CSS – značka style (textstyle.html)

p { color: #000099; background-color: yellow; padding: 30px; margin-right: 20%; } Lorem Ipsum Lorem Ipsum

CSS – značka style Definici CSS lze vkládat do párové značky style, která se umisťuje do hlavičky dokumentu. Pro zápis CSS ve značce style platí stejná pravidla jako pro zápis CSS do externího souboru. Vždy se podle předpisu formátuje právě a jenom stránka, v níž je umístěn. Vhodné pro jednostránkový web nebo pro podtržení větší důležitosti podstránky.

CSS – značka style V minulosti se obsah značky style uváděl v komentářích. Pokud prohlížeč neuměl CSS mohl tak předpis lépe správně ignorovat. <!-- body { background-color: #000000; } //--> Dnes komentáře nejsou nutné, protože všechny prohlížeče CSS umí.

CSS – atribut style (textstyle.html) <p style= "color:black; background-color:#99ff66;"> Lorem Ipsum Do prvního odstavce přidej atribut style, a to nejprve pouze s vlastností color a hodnotou (stránku si zobraz v prohlížeči). Přidej vlastnost background-color s hodnotou. Přidej další formátování.

CSS – atribut style Vložení stylopisu pomocí atributu style se nazývá individuální definice stylu. Využívá se střídmě a pouze v případech, že je toto formátování v rámci stránky jen na jednom místě, které chci zvýraznit.  Jedna důležitá novinka či akce (firmy)  Jeden velmi důležitý odkaz  Jeden stěžejní obrázek nebo seznam

CSS – kdo má přednost V rámci tvorby stránek lze využít všechny možnosti vkládání stylů současně. Při kolizi má přednost  individuální definice před  značkou style a ta má přednost před  externí definicí CSS, jinak se stylopisy skládají. Například pokud v externím souboru zadefinuji bílý text a pomocí style černé pozadí, budu mít bílý text na černém pozadí.

CSS – style V PSPadu si otevři soubor matematickytest.html.  U nadpisu Skupina A vymaž atribut align a umísti jej vpravo za použití CSS.  Změň barvu všech horních a dolních indexů. Dolní index 2 bude mít jinou barvu než dolní index 1.  Stránku doformátuj za pomocí CSS. Konečný vzhled nechávám na tobě.