<?php

include '../../includes/masterlist.php';
$letterarray = array("a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m");

?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cs" >
<head>
	<meta http-equiv="content-type" content="text/html; charset=windows-1250">
	<meta name="author" content="Dave Shea" />
	<meta name="keywords" content="design, css, kaskádové, styl, styly, šablona, šablony, xhtml, grafický design, w3c, webové standarty, visuální, zobrazení">
	<meta name="description" content="Ukázka èeho se dá vizuálnì dosáhnout designem založeném na CSS.">
	<meta name="robots" content="all" />
	<title>css Zenová zahrada: Krása CSS designu</title>

	<!-- to correct the unsightly Flash of Unstyled Content. http://www.bluerobot.com/web/css/fouc.asp -->
	<script type="text/javascript"></script>
	
	<style type="text/css" title="currentStyle">
		@import "<?php echo $loadCSS; ?>";
	</style>
<?php

if($isNN4) {
	echo "<link rel=\"stylesheet\" type=\"text/css\" href=\"";
	echo $isNN4;
	echo "\" />";
}

?>
	<link rel="Shortcut Icon" type="image/x-icon" href="http://www.csszengarden.com/favicon.ico" />	
	<link rel="alternate" type="application/rss+xml" title="RSS" href="http://www.csszengarden.com/zengarden.xml" />
</head>

<!--


	This xhtml document is marked up to provide the designer with the maximum possible flexibility.
	There are more classes and extraneous tags than needed, and in a real world situation, it's more
	likely that it would be much leaner.
	
	However, I think we can all agree that even given that, we're still better off than if this had been
	built with tables.


-->

<body id="css-zen-garden">

<div id="container">
	<div id="intro">
		<div id="pageHeader">
			<h1><span>css Zenová zahrada</span></h1>
			<h2><span>Krása <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym> designu</span></h2>
		</div>

		<div id="quickSummary">
			<p class="p1"><span>Ukázka èeho se dá vizuálnì dosáhnout designem založeném na <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym>. Vyberte si jakoukoliv šablonu stylu ze seznamu, která se má nahrát do této stránky.</span></p>
			<p class="p2"><span>Stáhnìte si ukázkový pøíklad <a href="http://www.csszengarden.com/zengarden-sample.html" title="Zdrojový HTML kód této stránky, nesmíte mìnit.">html souboru</a> a <a href="http://www.csszengarden.com/zengarden-sample.css" title="Ukázkový CSS soubor této stránky, tento soubor mùžete mìnit.">css souboru</a></span></p>
		</div>

		<div id="preamble">
			<h3><span>Cesta k osvìtì</span></h3>
			<p class="p1"><span>Na tmavé a ponuré cestì leží poházené døívìjsí pozùstatky prohlížeèù-specifické tagy, nekompatibilní <acronym title="Document Object Model - Objektový model dokumentu">DOM</acronym>y a špatná podpora <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym>.</span></p>
			<p class="p2"><span>Dnes si musíme vyèistit mysl od tìchto postupù.Webová osvìta byla dosažena díky neúnavnému úsilí lidí z <acronym title="World Wide Web Consortium">W3C</acronym>, <acronym title="Web Standards Project">WaSP</acronym> a tvùrcù hlavních prohlížeèù.</span></p>
			<p class="p3"><span>Css Zenová zahrada Vás zve k odpoèinku a pøemýšlení o významných lekcích mistrù. Zaènìte se dívat jasnì. Nauète se používat èasem uznané (teprve budou) techniky v novém osvìžujícím stylu. Splyòte s webem.</span></p>
		</div>
	</div>

	<div id="supportingText">
		<div id="explanation">
			<h3><span>Tak o èem tohle je?</span></h3>
			<p class="p1"><span>Zcela zøejmì je potøeba, aby bylo <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym> bráno grafiky vážnì. Zenová zahrada se snaží nadchnout, inspirovat a povzbuzovat spoluúèast. Pro zaèátek si prohlédnìte nìkteré z existujících designù ze seznamu. Kliknutím na kterýkoliv se nahraje šablona stylu právì do této stránky. Kód zùstane stejný, jediná vìc, která se zmìnila je externí .css soubor. Ano, opravdu.</span></p>
			<p class="p2"><span><acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym> dovoluje kompletní a úplnou kontrolu nad stylem hypertextového dokumentu. Jediný zpùsob, jak to mùžeme ilustrovat tak, aby to nadchlo lidi, je demonstrace, že to tak opravdu mùže být, když jsou opratì v rukou lidí schopných vytvoøit krásu ze struktury. Doposud byla vìtšina pøíkladù pohledných trikù a vychytávek pøedvádìna strukturisty a kodéry. Designéøi o sobì musí stále dávat vìdìt. Toto je potøeba zmìnit.</span></p>
		</div>

		<div id="participation">
			<h3><span>Spoluúèast</span></h3>
			<p class="p1"><span>Pouze pro grafiky, prosím. Abyste mohli modifikovat tuto stránku, je nezbytná detailní znalost <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym>, ale vzorové soubory jsou dostateènì dobøe okomentované, aby je i nováèek v <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym> mohl použít jako startovní bod. Prosím, podívejte se na <a href="http://www.mezzoblue.com/zengarden/resources.asp" title="Seznam zdrojù souvisejících s CSS">zdrojovou pøíruèku <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym></a> pro pokroèilé procvièování a tipy pro práci s <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym>.</span></p>
			<p class="p2"><span>Mùžete modifikovat šablonu stylu, jak chcete, ale ne <acronym title="HyperText Markup Language">HTML</acronym>. Zprvu to mùže vypadat znepokojivì, pokud jste tímto zpùsobem dosud nepracovali. Držte se odkazù v seznamu, abyste se nauèily víc a používejte vzorové soubory jako návod.</span></p>
			<p class="p3"><span>Stáhnìte si ukázkový pøíklad <a href="http://www.csszengarden.com/zengarden-sample.html" title="Zdrojový HTML kód této stránky, nesmíte mìnit.">html souboru</a> a <a href="http://www.csszengarden.com/zengarden-sample.css" title="Ukázkový CSS soubor této stránky, tento soubor mùžete mìnit.">css souboru</a> kvùli práci s lokální kopií. Jakmile jste dokonèili Vaše veledílo (a prosím, neodevzdávejte napùl rozpracovanou práci) nahrajte Váš .css soubor na webový server pod Vaší kontrolou. <a href="http://www.mezzoblue.com/zengarden/sendfile.asp" title="Použijte kontaktní formuláø k poslaní Vašeho CSS souboru">Pošlete nám adresu</a> k souboru a když se ho rozhodneme použít, pøekopírujeme si i pøipojené obrázky. Koneèné designy budou umístìny na našem serveru.</span></p>
			<p class="p4"><span>poslední: Hledám pøekladatele. Pokud jste schopni mluvit plynule v angliètinì a jiném jazyku, toto je jiný zpùsob, jak se zapojit do projektu. Prosím <a href="http://www.mezzoblue.com/contact/" title="Pošlete mi e-mail a zmiòte se, v kterých jazicích jste dobøí.">kontaktujte mì</a> kvùli detailùm. Do èeštiny pøeložil <a href="mailto:vaclav.macinka@post.cz">Václav "MaTZ" Macinka</a>.</span></p>
		</div>

		<div id="benefits">
			<h3><span>Pøínos</span></h3>
			<p class="p1"><span>Proè se úèastnit? Pro poznání, inspiraci a zdroj, kam se mùžeme všichni podívat, když budeme dìlat design založený na <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym>. Tohle je velice potøeba, dokonce i dnes. Víc a víc významných webù dìlá pokroky, ale stále jich není dost. Jednoho dne bude tato galerie historická kuriozita, ale ten den ještì nenastal.</span></p>
		</div>

		<div id="requirements">
			<h3><span>Požadavky</span></h3>
			<p class="p1"><span>Rádi bychom vidìli tolik <acronym title="Cascading Style Sheets - Šablony kaskádových stylù, verze 1">CSS1</acronym>, kolik je možné. <acronym title="Cascading Style Sheets - Šablony kaskádových stylù, verze 2">CSS2</acronym> by mìlo být omezeno jen na široce podporované prvky. Css Zenová zahrada je o funkèních, praktických <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym> a ne o posledních strhujících tricích, které uvidí 2% brouzdající veøejnosti. Jediný skuteèný požadavek, který máme, je takový, že Vaše <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym> musí být uznané platným.</span></p>
			<p class="p2"><span>Naneštìstí takovéto designování poukazuje na nedostatky v rùzných implementacích <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym>. Rozdílné prohlížeèe nìkdy zobrazují odlišnì dokonce i kompletnì uznané <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym> a pak se stává nesnesitelné, když oprava pro jeden vede k poškození ve druhém. Nahlédnìte na <a href="http://www.mezzoblue.com/zengarden/resources.asp" title="Seznam zdrojù souvisejících s CSS">stránky zdrojù</a> pro informace o nìkterých dostupných øešení. Plné vyhovìní prohlížeèi je nìkdy stále fantazie a my od Vás neoèekáváme, že pøijdete s perfektním na pixel pøesným kódem na každé platformì. Ale testujte, co nejvíc mùžete. Pokud Váš design nefunguje alespoò v IE5+/Win a Mozille (používá pøes 90% populace), vyhlídka je taková, že ho nepøijmeme.</span></p>
			<p class="p3"><span>Žádáme od Vás, abyste odevzdali Vaše originální grafické zpracování (obrázky). Prosím, respektujte autorská práva. Prosím, udržujte nepøijatelný materiál na minimu, vkusná nahota je pøípustná, otevøená pornografie bude odmítnuta.</span></p>
			<p class="p4"><span>Toto je ukázkový pøíklad ke studiu jakožto i demonstrace. Autorská práva na Vaši grafiku Vám celá zùstanou, ale prosíme Vás, abyste zveøejnili Vaše <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym> pod licencí Creative Commons identickou s tou na <a href="http://creativecommons.org/licenses/sa/1.0/" title="Zobrazí licenèní informace o Zenové zahradì.">tomto webu</a>, aby se i ostatní mohli uèit z Vaší práce.</span></p>
			<p class="p5"><span>Pøipojení laskavì darované od <a href="http://www.mediatemple.net/">mediatemple</a></span></p>
		</div>

		<div id="footer">
			<a href="http://validator.w3.org/check/referer" title="Zkontrolovat platnost XHTML kódu této stránky">xhtml</a>   
			<a href="http://jigsaw.w3.org/css-validator/check/referer" title="Zkontrolovat platnost CSS kódu této stránky">css</a>   
			<a href="http://creativecommons.org/licenses/by-nc-sa/1.0/" title="Zobrazí detailní licenèní informace o Zenové zahradì.">cc</a>  
			<a href="http://mezzoblue.com/zengarden/faq/#s508" title="Zkontrolovat dostupnost této stránky v souladu s U.S. Section 508">508</a>  
			<a href="http://www.mezzoblue.com/zengarden/faq/#aaa" title="Zkontrolovat dostupnost této stránky v souladu s WAI Content Accessibility Guidelines 1">aaa</a>
		</div>

	</div>

	
	<div id="linkList">
		<div id="linkList2">
			<div id="lselect">
				<h3 class="select"><span>Vyberte design:</span></h3>
				<ul>
<?php
					$c = 0;
					for ($a = ($listStart + 1); $a <= $listEnd; $a++) {
						$b = $listEnd - $c;
						$d = $letterarray[$c];
						$tempLink = linkMe($filename[$b]);
						echo "\t\t\t\t\t";
						echo "<li><a href=\"?cssfile=/${tempLink}/${tempLink}.css&amp;page=${thisPage}\" title=\"AccessKey: ${d}\" accesskey=\"${d}\">${styleName[$b]}</a> by <a href=\"${styleURL[$b]}\" class=\"c\">${styleCreator[$b]}</a></li>";
						echo "\n";
						$c = $c + 1;
					}
?>
				</ul>
			</div>

			<div id="larchives">
				<h3 class="archives"><span>Archivy:</span></h3>
				<ul>
<?php
					
					$forward = $thisPage + 1;
					$backward = $thisPage - 1;
					
					if ($listStart >= 1) {
						echo "\t\t\t\t\t";
						echo "<li><a href=\"${thisFile}?cssfile=${currentDesign}&amp;page=${forward}\" title=\"Zobraz další sadu designù. Klávesa: l\" accesskey=\"l\">Da<span class=\"accesskey\">l</span>ší designy &raquo;</a></li>\n";
					}

					if ($thisPage >= 1) {
						echo "\t\t\t\t\t";
						echo "<li><a href=\"/${thisFile}?cssfile=${currentDesign}&amp;page=${backward}\" title=\"Zobraz pøedchozí sadu designù. Klávesa: p\" accesskey=\"p\">&laquo; <span class=\"accesskey\">P</span>øedchozí designy</a></li>\n";
					}
?>
					<li><a href="http://www.mezzoblue.com/zengarden/alldesigns/" title="Zobraz všechny designy na Zenové zahradì. Klávesa: v" accesskey="v">Ukaž <span class=\"accesskey\">v</span>šechny designy</a></li>
				</ul>
			</div>
			
			<div id="lresources">
				<h3 class="resources"><span>Zdroje:</span></h3>
				<ul>
<?php
					echo "\t\t\t\t\t";
					echo "<li><a href=\"${currentDesign}\" title=\"Ukáže zdrojový soubor CSS tohoto designu. Klávesa: u\" accesskey=\"u\"><span class=\"accesskey\">U</span>kaž <acronym title=\"Cascading Style Sheets - Šablony kaskádových stylù\">CSS</acronym> tohoto designu</a></li>";
?>
					<li><a href="http://www.mezzoblue.com/zengarden/resources.asp" title="Odkazy na skvìlé weby s informacemi o použití CSS. Klávesa: z" accesskey="z"><span class="accesskey">Z</span>droje <acronym title="Cascading Style Sheets - Šablony kaskádových stylù">CSS</acronym></a></li>
					<li><a href="http://www.mezzoblue.com/zengarden/faq.asp" title="Seznam èasto kladených dotazù o Zenové zahradì. AccessKey: q" accesskey="q"><acronym title="Frequently Asked Questions - Èasto kladené dotazy">FA<span class="accesskey">Q</span></acronym></a> </li>
					<li><a href="http://www.mezzoblue.com/zengarden/sendfile.asp" title="Poslat mùj vlastní CSS soubor. Klávesa: o" accesskey="o"><span class="accesskey">O</span>devzdat design </a></li>
					<li><a href="http://www.mezzoblue.com/zengarden/translations/" title="Podívat se na pøeložené verze této stránky. Klávesa: k" accesskey="k">Pøe<span class="accesskey">k</span>lady</a></li>
				</ul>
			</div>
		</div>
	</div>


</div>

<!-- These extra divs/spans may be used as catch-alls to add extra imagery. -->
<div id="extraDiv1"><span></span></div><div id="extraDiv2"><span></span></div><div id="extraDiv3"><span></span></div>
<div id="extraDiv4"><span></span></div><div id="extraDiv5"><span></span></div><div id="extraDiv6"><span></span></div>

</body>
</html>