Dos consejos para aplicar hojas de estilo CSS en DreamWeaver
Autor：Eve Cole
Fecha de actualización：2009-05-31 21:17:47
1. Elimine el subrayado del hipervínculo y cambie el color cuando el mouse pasa sobre el hipervínculo:
De forma predeterminada, los hipervínculos en las páginas web diseñadas con DreamWeaver están subrayados, lo que no queda muy bonito. Para eliminar estos molestos subrayados, el método introducido en muchos periódicos y revistas es agregar manualmente un fragmento de código al código fuente HTML. De hecho, es fácil eliminar los subrayados de los enlaces en DreamWeave. Primero, cree un enlace aleatorio en la ventana de documentos de DreamWeaver. Puede ver que este enlace estará subrayado. ¿Cómo eliminar este subrayado?
1. Haga clic en "Texto" | "Estilos CSS" | "Editar hoja de estilo..." en la barra de menú (o presione directamente la tecla de acceso directo Ctrl+shift+E) para abrir la ventana de diálogo Editar hoja de estilo.
2. Haga clic en "Nuevo" y luego, en el cuadro de diálogo "Nuevo estilo", haga clic en el botón "Usar selector de CSS".
3. Escriba a en el campo Selector y luego haga clic en Aceptar.
4. Luego aparece el cuadro de diálogo "Definición de estilo CSS" En la decoración de la clase Tipo, no marque ninguno, luego haga clic en Aceptar y luego haga clic en Listo. Inmediatamente notarás que el subrayado del enlace ha desaparecido en la ventana de documentos. Entonces, ¿cómo se hace para que el enlace cambie de color cuando se pasa el mouse sobre él? Repita los pasos uno y dos anteriores. Luego haga clic en la flecha desplegable junto a Selector, seleccione "a:hover" y haga clic en Aceptar. En el cuadro de diálogo emergente "Definición de estilo para: pasar el mouse", seleccione cualquier color del color de la clase Tipo (por ejemplo, seleccione rojo), luego haga clic en Aceptar y luego haga clic en Listo para completar. Presione F12 para obtener una vista previa y coloque el mouse sobre el enlace. ¿El enlace se vuelve rojo? Si en el cuadro de diálogo "Definición de estilo para: pasar el mouse" hace un momento, en la clase Fondo, selecciona que el color de fondo sea verde, cuando coloque el mouse sobre el hipervínculo, el enlace no solo se volverá rojo, sino que también También habrá un fondo verde. De hecho, a través del cuadro de diálogo de definición de estilo CSS de ahora, también puede lograr más efectos especiales. Los amigos que estén interesados tal vez quieran pensar en ello.
2. Cree una hoja de estilos CSS externa reutilizable. Después de usar DreamWeaver para crear un estilo CSS en una determinada página web, si desea aplicar el estilo a otra página web, no es necesario volver a crear el estilo CSS. A medida que crea un archivo de hoja de estilo CSS externo (hoja de estilo CSS externa), puede llamar los estilos en este archivo de hoja de estilo a voluntad en el futuro. Para facilitar la administración, primero cree una nueva carpeta en la carpeta donde se encuentra el sitio, llamada CSS, que se usa especialmente para colocar archivos de hojas de estilo externos (su extensión es css).
1. Presione Ctrl+shift+E en la ventana del documento para abrir la ventana de diálogo Editar hoja de estilo. 2. Haga clic en "enlace".
3. En el cuadro de diálogo emergente Vincular hoja de estilo externa, haga clic en EXAMINAR y busque la carpeta CSS que acaba de crear.
4. En la columna "Nombre de archivo" de la ventana Seleccionar archivo de hoja de estilo, escriba *.css (* puede ser cualquier nombre. Tenga en cuenta que en este momento no hay ningún archivo de hoja de estilo en la carpeta CSS. escriba en el campo "Nombre de archivo" se convertirá en el nombre del nuevo archivo de hoja de estilo externo. Por ejemplo, escriba title.css y luego haga clic en Seleccionar | Aceptar.
5. En la ventana de diálogo Editar hoja de estilo, se agregará title.css (enlace), haga doble clic en él.
6. En la ventana emergente "title.css", haga clic en "Nuevo".
7. En el cuadro de diálogo "Nuevo estilo", haga clic en el botón "Crear estilo personalizado (clase)". 8. Escriba un nombre en la columna Nombre, como myheadline, y haga clic en Aceptar.
9. En el siguiente cuadro de diálogo "Definición de estilo para .myheadline en title.css", realice varias configuraciones, como fuente y color, y haga clic en Aceptar cuando haya terminado. Si desea crear un nuevo estilo, haga clic en "Nuevo" nuevamente, repita los pasos 6, 7, 8 y 9 y finalmente haga clic en "guardar" | "listo" y se creará el archivo de hoja de estilo externo title.css. Todos los estilos en title.css aparecerán en el submenú "TEXTO" | "Estilos CSS" en la barra de menú. Si desea llamar a este title.css en otras páginas web, simplemente repita los pasos 1 a 3 anteriores y luego ingrese title.css en la columna "Nombre de archivo" de la ventana Seleccionar archivo de hoja de estilo. Haga clic en "seleccionar" | "ok" | "hecho", todos los estilos en title.css aparecerán en el submenú "Texto" | "Estilos CSS" en la barra de menú de la página web y podrá aplicarlos. a esta página web estos estilos.
