Aplicación, eliminación o cambio del nombre de los estilos de clase CSS

Última actualización el 6/05/2019

Obtener más información sobre cómo aplicar, eliminar o cambiar el nombre de los estilos de clase CSS en Dreamweaver

Nota

En Dreamweaver y versiones posteriores, el panel Estilos CSS se sustituye por el Diseñador de CSS. Para más información, consulte el Diseñador de CSS.

Los estilos de clase son el único tipo de estilo CSS que se puede aplicar a cualquier texto de un documento, independientemente de las etiquetas que controlen el texto. Todos los estilos de clase asociados con el documento actual se muestran en el panel Estilos CSS (con un punto [.] precediendo su nombre) y en el menú emergente Estilo del inspector de propiedades de texto.

Verás la mayoría de los estilos actualizados inmediatamente; sin embargo, debes ver una vista previa de tu página en un explorador para verificar que un estilo se aplicó como se esperaba.Cuando aplicas dos o más estilos al mismo texto, los estilos pueden entrar en conflicto y producir resultados inesperados.

Nota

Cuando obtengas una vista previa de los estilos definidos en una hoja de estilos CSS externa, asegúrate de guardar la hoja de estilos para garantizar que tus cambios se reflejen cuando obtengas una vista previa de la página en un explorador.

Aplicación de un estilo de clase CSS

En el documento, selecciona el texto al que deseas aplicar un estilo CSS.

Coloca el punto de inserción en un párrafo para aplicar el estilo a todo el párrafo.

Si seleccionas un rango de texto dentro de un solo párrafo, el estilo CSS afecta solo el rango seleccionado.

Para especificar la etiqueta exacta a la que se debe aplicar el estilo CSS, selecciona la etiqueta en el selector de etiquetas ubicado en la parte inferior izquierda de la ventana del documento.

Para aplicar un estilo de clase, siga uno de estos procedimientos:
  • En el panel Estilos CSS (Ventana > Estilos CSS), selecciona el modo Todo, haz clic con el botón derecho en el nombre del estilo que deseas aplicar y selecciona Aplicar en el menú contextual.

  • En el inspector de propiedades HTML, selecciona el estilo de clase que deseas aplicar en el menú emergente Clase.

  • En la ventana del documento, haz clic con el botón derecho (Windows) o haz clic con Control (Macintosh) en el texto seleccionado, y en el menú contextual, selecciona Estilos CSS y luego selecciona el estilo que deseas aplicar.

  • Selecciona Formato > Estilos CSS, y en el submenú selecciona el estilo que deseas aplicar.

Eliminar un estilo de clase de una selección

Selecciona el objeto o texto del que deseas quitar el estilo.
En el inspector de propiedades HTML (Ventana > Propiedades), selecciona Ninguno en el menú emergente Clase.

Cambiar el nombre de un estilo de clase

En el panel de estilos CSS, haz clic con el botón derecho en el estilo de clase CSS que deseas renombrar y selecciona Renombrar clase.
Nota

También puedes renombrar una clase seleccionando Renombrar clase en el menú de opciones del panel Estilos CSS.

En el cuadro de diálogo Renombrar clase, asegúrate de que la clase que deseas renombrar esté seleccionada en el menú emergente Renombrar clase.
En el cuadro de texto Nuevo nombre, introduzca el nuevo nombre de la clase y haga clic en Aceptar.

Si la clase que estás renombrando es interna al encabezado del documento actual, Dreamweaver cambia el nombre de la clase así como todas las instancias del nombre de la clase en el documento actual. Si la clase que estás renombrando está en un archivo CSS externo, Dreamweaver abre y cambia el nombre de la clase en el archivo. Dreamweaver también inicia un cuadro de diálogo Buscar y reemplazar en todo el sitio para que puedas buscar todas las instancias del nombre de clase anterior en tu sitio.