CSS – Cascading StyleSheets

Připojení stylu k dokumentu

<link rel="stylesheet" type="text/css" href="styl.css" 
	media="all" title="Popisek stylu" />

<link rel="alternate stylesheet" type="text/css" href="styl2.css" 
	media="all" title="Alternativní styl" />


<style type="text/css" media="print">
	p {
		margin: 1em 0;
	}
	
	h1 {
		color: red;
	}
</style>


<style type="text/css" media="print">
	@import "styl.css";
</style>


<p style="margin: 1em 0; color: blue;">modrý odsazený text</p>



<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="styl-msie6.css" />
<![endif]-->
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="styl-msie7.css" />
<![endif]-->

Syntaxe

* {
	margin: 0;
}

p {
	margin: 1em 0;
}

p, div {
	margin: 1em 0;
}

p strong, p > em {
	color: green;
}

.dulezity, p.varovani {
	color: red;
	font-weight: bold;
}

#stranka {
	width: 100%;
}

a:hover, a:active {
	text-decoration: underline;
}

@media aural {
	strong {
		volume: loud;
	}
}

CSS hacky

Úkol na procvičení CSS

Stáhněte si vzorový XHTML soubor a ostylujte jej podle vlastního uvážení. CSS předpis přitom uložte do zvláštního souboru a připojte jej ke staženému XHTML souboru některým z popsaných možnýh způsobů.