introduccion-css
Breve introducción a css
Hojas de Estilo en Cascada (Cascading Style Sheets), es un mecanismo simple que describe cómo se va a mostrar un documento en la pantalla, o cómo se va a imprimir, o incluso cómo va a ser pronunciada la información presente en ese documento a través de un dispositivo de lectura. Esta forma de descripción de estilos ofrece a los desarrolladores el control total sobre estilo y formato de sus documentos.
CSS funciona a base de reglas, es decir, declaraciones sobre el estilo de uno o más elementos. Las hojas de estilo están compuestas por una o más de esas reglas aplicadas a un documento HTML o XML. La regla tiene dos partes: un selector y la declaración. A su vez la declaración está compuesta por una propiedad y el valor que se le asigne.
El lenguaje en css es muy muy extenso por lo que solo les enseñare una pequeña guía se podria decir que solo es un punto de referencia para que comprendan como funciona.
<html>
<head>
<title>Título</title>
<link rel="stylesheet" type="text/css" href="/css/officeFloats.css"/>
</head>
<body>
.
.
.
.
</body>
</html>
<html>
<head>
<title>hoja de estilo interna</title>
<style type="text/css">
body {
padding-left: 11em;
font-family: Georgia, "Times New Roman", serif;
color: red;
background-color: #d8da3d;
}
h1 {
font-family: Helvetica, Geneva, Arial, sans-serif;
}
</style>
</head>
<body>
<h1>Aquí se aplicará el estilo de letra para el Título</h1>
</body>
</html>
h1 {color: red;}
h1 es el selector{color: red;}es la declaración
Utilizando una hoja de estilo externa que estará vinculada a un documento a través
del elemento <'link'>, el cual debe ir situado en la sección <'head'>.
Utilizando el elemento <'style'>, en el interior del documento al que se le quiere dar
estilo, y que generalmente se situaría en la sección <'head'>. De esta forma los estilos
serán reconocidos antes de que la página se cargue por completo.
En el siguiente ejemplo, h1{color: red;}, el selector, <'h1>, le dice al navegador la parte del documento que se verá afectada por esa regla. Los selectores pueden aparecer individualmente o agrupados, separándolos con comas:
h1 {color: red;}
h2 {color: red;}
h3 {color: red;}
Ahora bien si quieres crear tu propio estilo es muy sencillo hagamos el ejercicio con el div que tengo al principio de mis paginas este seria el estilo :
Y para hacer la conexión seria este codigo :
Información tomada de http://www.w3c.es/divulgacion/guiasbreves/hojasestilo .
