Cómo crear hojas de estilo internas y externas en Dreamweaver - dummies

Cuando crea nuevos estilos en Dreamweaver, debe decidir si desea guardar el estilo en una hoja de estilos interna o externa. En una hoja de estilo interna , la regla de estilo se guarda en la parte superior del documento HTML donde desea aplicar el estilo. En una hoja de estilo externa , los nuevos estilos se guardan en un documento separado que se puede adjuntar a cualquier archivo en su sitio web.

Las hojas de estilo externas ofrecen las mayores ventajas porque el uso de un conjunto de estilos en muchas páginas es más eficiente que la creación de estilos para cada página de su sitio. Dicho esto, a veces las hojas de estilo internas son una buena opción, como cuando se crea un estilo que se aplicará solo a los elementos en una página.

Cómo crear una hoja de estilo interna en Dreamweaver

Las hojas de estilo internas se guardan en el mismo archivo HTML donde se aplican. Por lo tanto, no crea un archivo cuando crea una hoja de estilos interna, como lo hace cuando crea una hoja externa.

En cambio, cuando crea una hoja de estilo interna, simplemente agrega etiquetas dentro de las etiquetas en la parte superior del archivo HTML que tiene abierto en Dreamweaver. Luego, cuando crea estilos, guarda las nuevas definiciones de reglas de estilo dentro de las etiquetas en su archivo.

Crear un nuevo estilo interno en Dreamweaver requiere solo dos pasos. Primero haga clic en el ícono más (+) en el panel Orígenes en la parte superior del panel Diseñador de CSS. Luego seleccione Definir en la página en la lista desplegable. Ya terminaste Dreamweaver inserta las etiquetas en el código de su archivo y enumera la hoja de estilo interna en el panel Orígenes con la etiqueta.

Cómo crear una hoja de estilo externa en Dreamweaver

En la parte superior del panel Diseñador de CSS, encontrará el panel Orígenes. Este panel muestra el nombre o los nombres de las hojas de estilos disponibles para la página abierta. Este mismo panel se usa para crear o vincular hojas de estilos a medida que crea o aplica estilos.

Para crear una hoja de estilo externa, primero cree y guarde un nuevo archivo HTML o abra un archivo existente en Dreamweaver, y luego siga estas instrucciones:

1. Haga clic en el ícono más (+) en el panel Fuentes en la parte superior el panel Diseñador de CSS.

   Se abre una lista desplegable con tres opciones: Crear un nuevo archivo CSS, Adjuntar archivo CSS existente y Definir en la página.

   

2. Elija la opción Crear un nuevo archivo CSS de la lista desplegable.

   Se abre el cuadro de diálogo Crear un nuevo archivo CSS.

3. Ingrese un nombre para su nuevo archivo de hoja de estilo.

   Puede asignarle un nombre a las hojas de estilo, siempre que no incluya espacios ni caracteres especiales que no sean el guión (-) o el guión bajo (_).

   

4. Seleccione la opción Enlace.

   El enlace se considera la mejor práctica en la mayoría de los casos y se selecciona de manera predeterminada en Dreamweaver.

   En su mayor parte, la opción Importar se usa solo cuando desea aplicar varias hojas de estilo externas a la página, pero solo desea vincularlas a una hoja de estilos. En ese caso, puede usar la opción Importar para asociar varias hojas de estilo con una.

5. Haga clic en la flecha junto a Uso condicional para ver configuraciones adicionales.

   La configuración de Uso condicional se usa para configurar consultas de medios para hojas de estilo.

6. Haga clic en Aceptar.

   La hoja de estilo se guarda y se vincula a la página HTML que tiene abierta en Dreamweaver. Nota: Si está trabajando en una nueva página HTML, asegúrese de haber guardado la página; de lo contrario, no podrá crear y vincular un nuevo archivo CSS.

Después de crear una hoja de estilo externa, puede vincular la misma hoja de estilo a tantas páginas como desee siguiendo los pasos del ejercicio que sigue inmediatamente. También puede agregar tantas reglas de estilo como desee a cualquier hoja de estilo externa, que se cubre en varios ejercicios que siguen sobre la creación de clases, etiquetas y otros tipos de estilos.