Cómo dar formato a un encabezado en CSS

Cascading Style Sheets (CSS) le permite escribir un conjunto de reglas de estilo en un solo archivo y luego incrustar ese archivo en cada página en la que desea aplicar dichas normas. Para dar formato a un encabezado en CSS, debe insertar uno de estos archivos CSS y estilo de ambas etiquetas de contenedores de la cabecera y de cualquiera de sus contenidos, como el título del sitio y el subtítulo. Preste especial atención a la forma en que el estilo de la página del título, ya que una parte de su sitio web debe destacarse. Usted tendrá que saber cómo configurar las fuentes y colores para el estilo de su cabecera y título.

cabecera de formato

Abra el Bloc de notas dos veces por lo que tiene dos Bloc de notas ventanas abiertas en el escritorio. Colóquelos de lado a lado para que pueda leer el código en las dos ventanas al mismo tiempo. Ir a "Archivo" y "Abrir ..." en la primera ventana del Bloc de notas y abra su página Web. Guarde el archivo en blanco en la segunda ventana como una hoja de estilo mediante la extensión del archivo CSS.

Agregue este código después de las etiquetas "title" en su página Web:

link rel = "stylesheet" href type = "ruta / al / style.css" = "text / css" /

Cambiar "ruta / al / style.css" a la ruta de acceso al archivo CSS, incluyendo el nombre del archivo.

Busque el código de la cabecera de su página Web. No hay que confundir la cabecera con el código entre las etiquetas "cabeza", que no se muestra en el navegador. Esto es una típica cabecera, aunque muy reducidos al mínimo:

div id = "header"

h1Site Title/h1

smallTagline para su sitio web / small

/ Div

Comience escribiendo código de estilo para el "div" o etiquetas de "cabecera" que envuelven alrededor de su cabecera:

# Header {

width: 100%;

background-color: negro;

padding: 20px;

}

Cambiar "header" al nombre ID de las etiquetas que se envuelven alrededor de su cabeza, pero mantener el símbolo de hash como CSS necesita esto para saber que buscar un nombre de identificación. El ejemplo de código establece el encabezado para todo el ancho de la pantalla o cualquier recipiente que envuelve toda la página. El fondo se establece en negro. Utilice relleno para agregar espacio alrededor de cualquier contenido en el encabezado.

Escribe una regla de estilo para las etiquetas "h1":

# Header h1 {

font-family: Georgia, serif;

font-size: 36px;

color: blanco;

}

Ajuste la fuente a utilizar por el título en la cabecera mediante la propiedad CSS "font-family". Al configurar una fuente, agregar la fuente que más desea utilizar y después, agregar algunos, fuentes de reserva estándar a la lista, separando cada letra con una coma. Para fuentes con espacios en sus nombres, ponga comillas alrededor de los nombres.

Estilo de cualquier otro elemento HTML - un conjunto de etiquetas y el contenido que marcan up - utilizando el mismo método de selección "# idName nombre de etiqueta" que utilizó el estilo de las etiquetas "H1". Guarde ambos archivos antes de la prueba o subir a su servidor.

Recursos