presentación de css
TRANSCRIPT
ESTILO CSS EN HTML
LUIS CORREA 3RO «BI»
Las Hojas de Estilo en Cascada se escriben dentro del código HTML de la página web, solo en casos avanzados se pueden escribir en un archivo a parte y enlazar la página con ese archivo. En un principio vamos a utilizar la manera más directa de aplicar estilos a los elementos de la página, mas adelante veremos la declaración en archivos externos. Para ello, y esto es la primera lección de este artículo, vamos a conocer un nuevo atributo que se puede utilizar en casi todas las etiquetas HTML: style.
Una característica esencial de las hojas de estilo en cascada (CSS) es la posibilidad de separar los elementos formales de los de contenido. De esta forma, sólo con una pequeña modificación de la hoja de estilo es posible cambiar el aspecto de todas las páginas en las que se aplica esa hoja.
No todas las versiones de los navegadores las soportan. Si consideramos los dos principales Netscape es capaz de utilizarlas desde la versión 4.0 y Explorer desde la 3.0
¿Por qué se llaman hojas de estilo?
Con las hojas de estilo podemos crear clases y pseudoclases. Éstas nos permiten modificar e indicarle al navegador la forma en la que tiene que presentar cualquier elemento HTML.
¿Por qué se llaman "en cascada"?
Cuando creamos un estilo, las especificaciones que se realicen para un determinado elemento serán aplicables a todos aquellos elementos que se encuentren "por debajo" de él atendiendo a un criterio de herencia. Por ejemplo, si especificamos un tipo de letra para el elemento <body> todos aquellos elementos que puedan heredar las características se presentarán con el mismo tipo de fuente. Así, el elemento <p> heredará el tipo de letra salvo que especifiquemos lo contrario.
También debemos de tener en cuenta que se establece un orden de prioridad para la aplicación de las normas en caso de que resulten contradictorias. El orden de preferencia para aplicar una norma es el siguiente:
- Estilo especificado dentro de la etiqueta. - Estilo especificado en la cabecera del documento. - Estilo definido en un documento independiente al que se enlaza nuestra página.
SINTAXIS
Vinculación a una hoja de estilo externa
Para crear un vínculo a una hoja de estilo externa, insertamos una etiqueta <link> como en el ejemplo siguiente:
<head> <title>Hoja de estilo vinculada</title> <link href="estilo.css" rel="stylesheet" type="text/css"></head>
Pseudo clases
a:linka:visiteda:hovera:active
Como hemos visto, podemos combinar estos selectores y clases. Así tenemos la posibilidad de crear múltiples estilos, por ejemplo para un enlace:
a.principal:linka.pie:link
Reglas, declaraciones, propiedades
body {
font-family: Arial, sans-serif; color: blue; }
Una hoja de estilo contiene al menos una regla y puede contener tantas como necesites.
Grupo de selectores
h1, h2, h3 {font-family: Arial, sans-serfi;}
Selectores ID
Son similares a los selectores de clase. Se diferencia en la semántica y en el comportamiento.
Sintaxis:
#cabecera
<div id="cabecera">Contenido de cabecera</div>
Esto no sería correcto:
#barra
<div id="barra">Bienvenidos</div><div id="barra">Esto es una prueba de diseño web </div>
BIBLIOGRAFÍA• http://www.chesco.info/curso/css.htm