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.

Prezentace na téma: "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."— Transkript prezentace:

1 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 uvedeno jinak, je Ing. Michal Sonnek. Obchodní akademie a Střední odborná škola logistická, Opava, příspěvková organizace. Vzdělávací materiál byl vytvořen v rámci OP VK 1.5 – EU peníze středním školám, registrační číslo CZ.1.07/1.5.00/34.0809. Pozadí 1 4.. ledna 2013 VY_32_INOVACE_160314_POZADI_DUM

2 Title of the document The content of the document...... Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás Vlastnosti pozadí Nastavení vlastnosti background umožní definování vlastností pozadí elementu. Tento parametr je možné použít na nastavení pozadí textu, odstavce, celé stránky,… Parametry: background-color, background-image, background-position, background-repeat, background-origin, background-attachment. 2

3 Title of the document The content of the document...... Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás background-color Vlastnost určuje barvu pozadí. Hodnoty: barva, transparent, inherit. Příklad: body { background-color: black } 3

4 Title of the document The content of the document...... Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás background-image Parametr určuje obrázek umístěný na pozadí. Hodnoty: url, none, inherit. Příklad: body {background- image:url(obr/podklad.jpg} 4

5 Title of the document The content of the document...... Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás background-position Určuje polohu obrázku definovaného na pozadí. Hodnoty: %, jednotky délky, top, center, bottom, left, right, inherit. 5

6 Title of the document The content of the document...... Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás background-position Výchozí hodnota je 0% 0% = top left. Obecná syntaxe: background-position: hodnota background-position:hodnota hodnota Příklad: body { background-image: url(obr/podklad.jpg no-repeat; background-position:right top } 6

7 Title of the document The content of the document...... Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás background-repeat Určuje chování obrázku na pozadí. Hodnoty: repeat, repeat-x, repeat-y, no-repeat, inherit. Příklad: body { background-image: url(obr/podklad.jpg; background-repeat:repeat-x } 7

8 Title of the document The content of the document...... Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás background-origin Vlastnost určuje výchozí bod, od něhož se začíná obrázek na pozadí elementu vykreslovat. Hodnoty: border, padding, content. Příklad: div {border: 15px solid grey; padding:url(podklad.gif) no- repeat; background-origin:content } 8

9 Title of the document The content of the document...... Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás background-attachment Určuje způsob posouvání obrázku na pozadí. Hodnoty: scroll, fixed, inherit. Příklad: body { background-image: url(obr/podklad.gif) background-attachment:fixed } 9

10 Title of the document The content of the document...... Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás Zadání vlastností v jednom zápisu div { background:#CC url(picture/p1.jpg) top right repeat-x } 10

11 Title of the document The content of the document...... Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás Své znalosti si zopakujte v zde. Kvíz 11

12 Title of the document The content of the document...... Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás Zdroje: JIŘÍ KROUŽEK, Martin Domes. CSS: Kapesní přehled. Vyd. 1. Brno: Computer Press, 2006. ISBN 80-251-0773-6. STANÍČEK, Petr. Kompletní průvodce CSS: kaskádové styly. Vyd. 1. Brno: Computer Press, 2003, 178 s. ISBN 80-7226- 872-4. GOLDSTEIN, Alexis, Louis LAZARIS a Estelle WEYL. HTML5 a CSS3 pro webové designéry. Vyd. 1. Brno: Zoner Press, 2011, 286 s. Encyklopedie webdesignera. ISBN 978-80- 7413-166-0. W3C. Kaskádové styly: domovská stránka [online]. 2012-05- 06, 06:20:10 [cit. 2013-01-04]. Dostupné z: http://www.w3.org/Style/CSS/Overview.cs.html 12

13 Title of the document The content of the document...... Úroveň 1 Úroveň 2 Úroveň 3 Titulek Výrobky Služby O nás Zdroje – cvičný příklad Extensible Markup Language. Http://cs.wikipedia.org [online]. 2012 [cit. 2013-01-04]. Dostupné z: http://cs.wikipedia.org/wiki/Extensible_Markup_Language Obrázky – xml2.gif http://zametkinapolyah.ru/wp- content/uploads/2012/04/XML2.gif – xml1.png http://t0.gstatic.com/images?q=tbn:ANd9GcSQEE605nQy zqg6DaDFQ3JMCDRFW-aHw0IKwGAY2GU5R9VSpONNLw 13