INDICE
- 1 Dreamweaver CC para maniquíes
- 2 1Si está definiendo un nuevo estilo que desea aplicar a un elemento existente, haga clic para colocar el cursor sobre el elemento que desea formatear con el nuevo estilo.
- 3 2En el panel Selectores del panel CSS Designer, seleccione el nombre de la hoja de estilo a la que desea añadir el nuevo estilo.
- 4 3En el panel de selectores, haga clic en el signo más (+).
- 5 4Haga doble clic en el nombre del selector y edítelo o sustitúyalo por el nombre que desee utilizar para su estilo.
- 6 5En el panel Propiedades, especifique la configuración de la regla de estilo.
- Software
- Adobe
- Dreamweaver
- Cómo crear estilos con selectores de clase e ID en Dreamweaver
Libro Relacionado
Dreamweaver CC para maniquíes
Por Janine Warner
Los selectores de clase e ID de Dreamweaver tienen muchas similitudes y una diferencia clave. Los estilos de ID sólo se pueden usar una vez por página, pero los estilos de clase se pueden usar tantas veces como se desee en la misma página.
Los estilos de clase e ID tienen las siguientes similitudes:
Puede nombrar los estilos creados con los selectores de clase e ID como desee. No debe incluir espacios ni caracteres especiales en los nombres de estilo, aunque el guión bajo y el guión son correctos. El uso de todas las minúsculas es una práctica común pero no obligatoria.
Puede aplicar estilos de clase e ID a cualquier elemento de una página, pero se aplican más comúnmente a las etiquetas de encabezado, etiquetas div, etiquetas de lista no ordenadas, etiquetas de párrafo, etiquetas de imagen y las nuevas etiquetas HTML5.
El uso de estilos creados con el selector de clase e ID es un proceso de dos pasos. Primero, se crea un nuevo estilo usando el selector de clase o ID y se le da un nombre; luego se aplica el estilo a un elemento de la página.
Para definir un nuevo estilo de clase o ID, cree y guarde un nuevo documento o abra un archivo existente y siga estos pasos:
1Si está definiendo un nuevo estilo que desea aplicar a un elemento existente, haga clic para colocar el cursor sobre el elemento que desea formatear con el nuevo estilo.
Aunque este paso no es necesario (puede crear estilos para elementos que aún no están en la página), Dreamweaver crea automáticamente nombres de selector basados en el elemento de página que el cursor está seleccionando en ese momento.
2En el panel Selectores del panel CSS Designer, seleccione el nombre de la hoja de estilo a la que desea añadir el nuevo estilo.
Si desea dirigir el estilo a un tipo o tamaño de pantalla específico, defina una consulta de medios en el panel @Media.
Si no especifica una consulta de medios, Dreamweaver utilizará la propiedad Global y su estilo funcionará en todos los formatos de medios y tamaños de pantalla.
3En el panel de selectores, haga clic en el signo más (+).
Se agrega un nuevo selector al panel de selectores. Dreamweaver ha añadido un nombre de selector compuesto, que incluye todos los estilos que ya se han aplicado al titular donde estaba el cursor cuando empezó a definir el estilo.
4Haga doble clic en el nombre del selector y edítelo o sustitúyalo por el nombre que desee utilizar para su estilo.
Puede nombrar los estilos de clase e ID como desee, siempre y cuando no utilice ningún espacio o carácter especial que no sea el guión (-) o el guión bajo (_).
Si desea crear un estilo utilizando el selector de clase, debe comenzar el nombre del estilo con un punto o punto. Si desea utilizar el selector de ID, el nombre del estilo debe comenzar con un signo de numeral (#).
5En el panel Propiedades, especifique la configuración de la regla de estilo.
Los selectores de clase e ID son fáciles de aplicar al contenido después de crearlos, ya que Dreamweaver añade estos estilos a las listas desplegables Clase e ID del inspector de propiedades, situadas en la parte inferior del espacio de trabajo.