Ejemplos CSS
Ejemplo 1 CSS
Ejemplo 2 CSS
Ejemplo 3 CSS
Ejemplo 1 CSS
header,footer, article,section, hgroup,nav, figure{ /* Giving a display value to the HTML5 rendered elements: */ display:block; } article .line{ /* The dividing line inside of the article is darker: */ background-color:#15242a; border-bottom-color:#204656; margin:1.3em 0; } footer .line{ margin:2em 0; } nav{ background:url(img/gradient_light.jpg) repeat-x 50% 50% #f8f8f8; padding:0 5px; position:absolute; right:0; top:4em; border:1px solid #FCFCFC; -moz-box-shadow:0 1px 1px #333333; -webkit-box-shadow:0 1px 1px #333333; box-shadow:0 1px 1px #333333; } nav ul li{ display:inline; } nav ul li a, nav ul li a:visited{ color:#565656; display:block; float:left; font-size:1.25em; font-weight:bold; margin:5px 2px; padding:7px 10px 4px; text-shadow:0 1px 1px white; text-transform:uppercase; } nav ul li a:hover{ text-decoration:none; background-color:#f0f0f0; } nav, article, nav ul li a,figure{ /* Applying CSS3 rounded corners: */ -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; }
Ejemplo 2 CSS
body { background-color: lightblue; } h1 { color: navy; margin-left: 20px; }
Ejemplo 3 CSS
.container { position: relative; } nav { position: absolute; left: 0px; width: 200px; } section { /* position is static by default */ margin-left: 200px; } footer { position: fixed; bottom: 0; left: 0; height: 70px; background-color: white; width: 100%; } body { margin-bottom: 120px; }