Cascading Style Sheets (CSS) se dividen en cuatro tipos diferentes (o estilos). Cuando usted entienda cómo funcionan estos cuatro tipos diferentes, podrás estilizar tus páginas web de manera más eficiente.

Para mantener su CSS organizada, utilizar etiquetas de comentario CSS para identificar las distintas secciones de la CSS dentro de su hoja de estilo. Por ejemplo, es posible que tenga una sección para los estilos de cabecera, para los estilos de la barra lateral, para los estilos de navegación y de los estilos de pie de página. comentarios CSS utilizan el / * ... * / sintaxis:

/ * Este es un comentario * /

estilo de clase (también conocido como estilo personalizado)

Los estilos de clase se pueden aplicar de forma selectiva a cualquier elemento HTML mediante el class =“nombre personalizado“ sintaxis. Por ejemplo, se podría crear un estilo de clase llamada realce que tiene un color de fondo de color amarillo brillante:

.destacado {background-color: # FFFF33-}

Para aplicar este estilo a cualquier contenido, usted sólo tiene que utilizar el atributo de clase:

 class ="realce"gt;Esto es realmente importante

CARNÉ DE IDENTIDAD

estilos de identificación se aplican automáticamente a un elemento HTML en la página con el mismo ID. Por ejemplo, si desea agregar una etiqueta para mantener el contenido de la barra lateral, que le daría ese contenedor una identificación semántica como la barra lateral:

Video: curso css hojas de estilo - parte 1 como crear estilos en html -

#sidebar {background-color: # 66CCFF-}

El código podría entonces ser algo como esto:

id ="barra lateral"gt;
Personalizados servicios de diseño web
...
Video: Curso de Diseño y Programación Web: 5. Introducción a CSS. Reglas para maquetar. Sitios recomendados

Etiqueta

Los estilos de etiquetas permiten redefinir automáticamente el estilo y el posicionamiento de cualquier etiqueta HTML existente, como cuerpo, pag, h1, o li. Por ejemplo, podría establecer los estilos de fuente para todas sus

etiquetas a lo largo de todo el sitio o dentro de una sección en particular:

h1 {font-family: Arial, Helvetica, sans-serif-font-size: 1.2em-font-weight: bold-color: # 8c9292-text-transform: uppercase-}

Compuesto

estilos compuesto también se aplican automáticamente a un elemento en función de su ubicación dentro de la página, como todas las etiquetas en el interior del con el ID de la barra lateral, que se encuentra dentro de un contenedor padre con el ID de envoltura:

#wrapper #sidebar h1 {color: # CC3300-font-family: "Times New Roman", Georgia, Serif-}