Compartir a través de


Cómo: Usar la ventana Propiedades de CSS

La ventana Propiedades de CSS permite ver y modificar las propiedades de estilo de la hoja de estilos en cascada (CSS). Para las páginas de formularios Web Forms, puede usar la ventana Propiedades de CSS en la vista Diseño. Puede usarla en la vista Código fuente para cualquier tipo de página. También puede usarla con un archivo CSS externo o con la ventana Administrar estilos.

Para abrir la ventana Propiedades de CSS

  • En el menú Ver, elija Propiedades de CSS.

La ventana Propiedades de CSS muestra todos los estilos usados por el elemento actualmente seleccionado en una página web. También puede ver el orden de prioridad de dichos estilos y todas sus propiedades y valores.

Información general de la ventana Propiedades de CSS

La ventana Propiedades de CSS tiene los elementos siguientes.

Elemento de la interfaz de usuario

Descripción

Mostrar botones

La parte superior de la ventana muestra los botones Mostrar lista ordenada por categorías, Mostrar lista ordenada alfabéticamente y Mostrar propiedades definidas encima. Estos botones permiten cambiar el orden en que se muestran las propiedades.

Para que solo las propiedades que tienen asignados valores aparezcan en la parte superior de cada categoría, elija Mostrar propiedades definidas encima. Las propiedades que no tienen valores aparecen en la parte inferior de cada categoría.

Resumen

Puede hacer clic en el botón Resumen para enumerar las propiedades de todos los estilos que afectan al elemento seleccionado. Esta lista incluye propiedades que pueden no aparecer en la sección Reglas aplicadas.

Reglas aplicadas

Indica qué reglas de estilo se aplican a un elemento. Si selecciona una regla en esta lista, sus propiedades asignadas se resaltan en la sección Propiedades de CSS siguiente. Si todavía no se ha aplicado ningún estilo, la sección Reglas aplicadas muestra no hay reglas aplicadas. Las reglas que aparecen en la parte inferior de la lista tienen mayor prioridad que las reglas de la parte superior. Haga clic con el botón secundario en un selector para mostrar un menú contextual que contiene opciones adicionales para trabajar con estilos para dicho selector.

Propiedades de CSS

Use esta sección para ver o establecer propiedades de CSS del estilo seleccionado en Reglas aplicadas. Una línea roja que tacha las propiedades indica que la selección actual no las hereda o que otro estilo las ha invalidado.

Sugerencia

Si hace doble clic en una regla aplicada o en una propiedad CSS que tiene asignado un valor de atributo, Visual Studio abre la hoja de estilos.La ubicación de la definición de la regla se muestra.Asimismo, puede hacer clic con el botón secundario en una regla o una propiedad y elegir Ir al código.

Modificar un estilo con la ventana Propiedades de CSS

Puede usar la ventana Propiedades de CSS para cambiar el formato o el estilo de un elemento único o de todos los elementos que comparten una clase CSS.

Para modificar las propiedades de un estilo

  1. En la lista Reglas aplicadas de la ventana Propiedades de CSS, seleccione un elemento, un estilo inline, un identificador de elemento o una clase CSS de elemento.

  2. En la sección Propiedades de CSS, cambie las propiedades.

Determinar qué estilos se aplican a un elemento

La ventana Propiedades de CSS permite ver todos los estilos que se aplican a un elemento. También puede ver qué propiedades de estilo se invalidan. Las propiedades de estilo invalidadas se muestran con una línea roja que las tacha, lo que indica que la propiedad no se aplica al elemento actualmente seleccionado.

Por ejemplo, un elemento puede tener una regla de estilo insertada y una regla de estilo de una hoja de estilos aplicadas. En este caso, la regla del estilo insertado invalida la regla de la hoja de estilos.

Para ver un resumen de todas las propiedades aplicadas a una selección

  1. Seleccione un elemento en la página y, a continuación, haga clic en Resumen para cambiar al modo de resumen.

    En la sección Propiedades de CSS, se muestran todas las propiedades que se aplican al elemento seleccionado.

  2. Haga clic en una propiedad en Propiedades de CSS para describir la regla de estilo asociada en Reglas aplicadas.

  3. Haga clic de nuevo en el botón Resumen para salir del modo de resumen.

    Nota

    Si mantiene el puntero del mouse sobre una propiedad tachada, la información sobre herramientas de una propiedad invalidada identifica la propiedad que la invalida.