Vínculo CSS Externo

En lecciones pasadas, hemos visto como cambiar un CSS Interno a uno Externo.

Ahora la tendencia es que vamos usar ésto en otras páginas de nuestro sitio.

muy sencillo, para quienes sepan cómo.

Haz click en el botón “Adjuntar Hoja de Estilo” en la parte inferior del panel “Estilos CSS”.

 

Esto abre una ventana de diálogo “Adjuntar Hoja de Estilo Externa”.
En esta caja de diálogo, haz click en el botón “Buscar” y navega al estilo CSS creado en lecciones pasadas.
Verifica la casilla “Vínculo” y haz click en el botón Aceptar.
Si escojes “Importar” entonces el estilo CSS será importado a la página y ésta no es la intención.

Así es.
Cuando mires al código fuente de tu página, veras que el link al estilo CSS está añadido. Puedes ver sin duda ésto en el panel de Estilo CSS.

Repite para cada página de tu sitio donde quieres añadir éste estilo CSS.

Puedes cambiar el estilo de varias formas.
Una forma es cambiar el estilo, en la opción “body” en la parte superior del panel CSS. Haz doble click en la paleta de colores en “Propiedades de “body” y escoge un color diferente.
Una segunda forma es escoger el estilo y hacer click en el botón “Editar Estilo”.
Una tercera forma de cambiar el estilo es en la página de mystyle.css.
En todos los casos, el cambio estará reflejado automáticamente en todas las páginas usando estilo CSS.

 

Tipos de “Selector”

Para crear una nueva regla CSS, haz click en el botón “Nueva Regla CSS” en la parte inferior del panel CSS.

Esto abre una nueva ventana de diálogo “Nueva Regla CSS”:

En “Definir en”, selecciona el archivo CSS en donde quieras agregar una nueva regla.
Si no has creado el archivo CSS, escoge “Nuevo Archivo de Hoja de Estilo”.

En la parte superior de la ventana de diálogo, tenemos tres tipos de “Selectores”.

Tenemos el selector “Clase”, el selector “Etiqueta” y el selector “Avanzandas”.

El selector “Clase” es una regla CSS que puede ser aplicada a cada elemento de tu página y puede ser usada tantas veces quieras. Pero ésto es precisamente el error hecho por los principiantes en CSS. Si definas una “clase” otra vez y otra vez y otra vez en el código de tu documento, es como si tuvieras una pequeña eficiencia y tengas enfocado así el uso de CSS y debería ser mucho mejor, para tu ejemplo, intanta “Etiqueta” selector.

El selector “Etiqueta” es aplicado a etiquetas específicas de HTML donde se han seleccionado etiquetas, haciendo click en la flecha que apunta hacia abajo o escribiendo en la etiqueta HTML en la caja.

Y finalmente tenemos el selector “Avanzadas”.

Nosotros usamos ésto cuando tenemos una combinación de etiquetas HTML a especificar, por ejemplo, td h2, el cual el formato de encabezado es (h2) para aplicar cuando esté dentro de una celda de tabla (td).
O para el uso de un pseudo clase de estilo, como a: link, a: hover, a: visited. ¿Recuerdas las diferentes vistas de nuestros vínculos?O si no queremos usar las etiquetas HTML, usamos un ID.

En la siguiente lección hecharemos un mejor vistazo.

 

Cursos

• Downloading iPad Apps
• Lesson 1: Introduction to Publisher
• Lesson 65: File Formats