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.

Slides:



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

Technologie pro publikování na webu 1
Technologie pro publikování na webu 1
Š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
WWW stránky.
Referát č. 22 Tvorba webových stránek (Struktura webu, struktura HTML dokumentu, vytvoření webové stránky exportem z aplikačního programu, provázání.
Martin Holý.  HTML  xHTML  CSS  JavaScript  PHP.
ZÁKLADY HTML Číslo DUM: VY_32_INOVACE_04_11 Autor: Mgr. Ivana Matyášková Datum vytvoření: duben 2013 Ročník: tercie Vzdělávací obor: informační technologie.
Mgr. Vlastislav Kučera přednáška č. 2.  Struktura stránky  hlavička  meta tagy  titulek stránky  připojení stylů,...  CSS.
<. DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4
Základy HTML.
Nové modulové výukové a inovativní programy - zvýšení kvality ve vzdělávání Tento projekt je spolufinancován Evropským sociálním fondem a státním rozpočtem.
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 WEBOVÝCH STRÁNEK
Číslo šablony: III/2 VY_32_INOVACE_P4_3.10 Tematická oblast: Aplikační software pro práci s informacemi II. HTML - tagy Typ: DUM - kombinovaný Předmět:
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.
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
ZÁKLADY HTML – ODKAZY, SEZNAMY. - vodorovná čára atributy:  width – délka čáry – pixely nebo %  size - šířka ve smyslu tloušťky  align - zarovnání.
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:
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.
Čí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.
Title of the document The content of the document Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás Autorem materiálu a všech jeho částí, není-li.
Pravidla a doporučení pro názvy souborů
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í)
CSS – style Mgr. Lenka Švancarová. CSS – značka style (textstyle.html)
TNPW1 Cvičení
CSS styly Kaskádové styly (CSS – Cascading Style Sheets) jsou prostředkem, který zajišťuje jednotný vzhled publikovaných stránek. Technologii CSS podporují.
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 – formátování textu, vodorovná čára Mgr. Lenka Švancarová.
Nové modulové výukové a inovativní programy - zvýšení kvality ve vzdělávání Tento projekt je spolufinancován Evropským sociálním fondem a státním rozpočtem.
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
HTML – TABULKY. - uzavírá celou strukturu tabulky atributy tabulky:  align - obtékání tabulky ostatním textem – right, left, center  cellpadding – vnitřní.
HTML a spol.. Nejpoužívanější formát dat textových dokumentů poskytovaných v rámci služby WWW. HTML (Hyper Text Markup Language) je jazyk pro popis struktury.
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.
CSS – selektor class.tx { color: black; /* nastaví černou barvu písma */ } Selektor class (třída) použijeme pokud chceme určité vlastnosti definovat pro.
Aplikace XML pro Internet
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.
Tvorba www stránek.
Ing. Jiří Štěpánek.  V tomto případě je barva písma i použitý font definován jako atribut elementu font. Tento způsob znemožňuje znovupoužitelnost.
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.
HTML pokračování. Co obsahuje každý html dokument? stránka stránka ahoj světe HTML.
1 Kurz XHTML a CSS Část 1: Náš první XTHML dokument a jeho publikace na internetu.
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.
NÁZEV ŠKOLY: Masarykova základní škola a mateřská škola Melč, okres Opava, příspěvková organizace ČÍSLO PROJEKTU: CZ.1.07/1.4.00/ AUTOR: Mgr. Vladimír.
HTML a CSS Rostislav Miarka.
Základy tvorby www stránky v HTML kódu.
CSS (4).
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.
Tvorba WWW stránek Formátování
ADOBE DREAMWEAVER CS6 CSS - Formátování textu
Značkovací jazyk HTML Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Ing. Jitka Vlčková. Dostupné z Metodického portálu ISSN.
Tvorba webových stránek
Transkript prezentace:

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 oddělit vzhled stránky od jeho struktury a obsahu obsah stránky je psán v jazyce HTML a vzhled určují CSS ve srovnání s formátováním pomocí atributů v HTML formátovací schopnosti rozšiřuje styly umožňují přesně určit, jak bude který element vypadat ukázka CSS

Připojení CSS do HTML stránky Styl můžeme k dokumentu připojit třemi způsoby: přímo u měněného elementu atributem style="...„ Text odstavce stylopisem = seznamem stylů zapsaným ve hlavičce dokumentu h2 {color: blue; font-style: italic;} externím souborem CSS, který připojíme v hlavičce dokumentu soubor css a html ukládáme do jedné složky

Vytvoření dokumentu index.html budeme používat editor PSPad vytvoříme nový soubor

Vytvoření dokumentu index.html v hlavičce souboru připojíme soubor styl.css

Vytvoření dokumentu styl.css vytvoříme nový soubor

Jak psát stylopis Každý soubor.css (stylopis) je tvořen seznamem pravidel. Každé pravidlo se skládá ze dvou částí- z popisu prvků, pro které bude styl platit (tzv. selektor), a z definice stylu, která je uzavřena ve složených závorkách {}. Touto definicí přiřazujeme nějaké CSS vlastnosti její hodnotu a zápis uvnitř složených závorek je ve tvaru {vlastnost: hodnota;}. Složená závorka – pravý Alt + b, pravý Alt + n Nápověda v PSPadu – začáteční písmena, Ctrl +mezerník

Přiřazení vlastnosti selektoru typový Nejjednodušší selektor je selektor typový. Jeho název je název tagu v HTML a definice stylu potom platí pro všechny tyto tagy v HTML dokumentu. body {background-color: rgb(255,204,51); font-family: Amerigo Md ATb; font-size: medium; } h1 {text-align: center; font-size: 16px; } Všechny nadpisy h1 budou mít velikost 16 pixelů a budou zarovnané na střed

První příklad index.html

První příklad styl.css

První příklad