Cómo definir atributos en Dreamweaver

El Inspector de Propiedades de Dreamweaver es sensible al contexto, lo que significa que cuando hace clic en una imagen, los atributos HTML de esa imagen se muestran y se pueden editar. Algunos de los atributos de las imágenes editables son más «técnicos» que los factores de diseño.

Por ejemplo, el ID de la imagen se utiliza cuando las imágenes están conectadas a programas JavaScript o bases de datos. Otros atributos de imagen en el Inspector de Propiedades comprenden un conjunto limitado de herramientas de edición de imágenes reales. Estas herramientas incluyen recortar, editar el contraste y afinar las imágenes. Eche un vistazo a la más importante de estas opciones:

  • Herramientas de área de mapa: Las herramientas de área de mapa crean puntos calientes seleccionables en la imagen seleccionada y definen enlaces separados para diferentes puntos calientes. Un hotspot es una sección de una imagen que sirve de enlace. Puede utilizar las herramientas Rectángulo, Círculo y Polígono para dibujar secciones en una imagen seleccionada y, a continuación, asignar enlaces específicos a esos puntos calientes en el Inspector de propiedades La cuarta herramienta de este conjunto, la herramienta Puntero para puntos calientes, se utiliza para seleccionar, mover o editar puntos calientes existentes.
  • Espacio V y Espacio H: Defina el espaciado horizontal y vertical alrededor de la imagen seleccionada.
  • Alinear: Utilice esta ventana emergente para elegir entre alinear a la izquierda o a la derecha. (Otras opciones están técnicamente disponibles, pero son remanentes de una época en la que los símbolos gráficos del tamaño de un texto se insertaban directamente en las líneas de texto y no se utilizan hoy en día en la alineación de imágenes).
  • Src: Este campo identifica la imagen enlazada incrustada.
  • Alt: Cambie el texto que se muestra, o que se lee en voz alta, cuando una imagen no es visible.
  • Frontera: Defina el ancho del borde (0 píxeles, por defecto), o 1 píxel si la imagen sirve de enlace.
  • Link: Defina un enlace que se abra al hacer clic en la imagen. Si se define un enlace, puede establecer el enlace para que se abra en una nueva ventana del navegador seleccionando _blank en la ventana emergente Destino.
  • Clase: Utilice esta ventana emergente para asignar estilos de clase CSS si hay alguno definido o vinculado a la página.
  • W (anchura) y H (altura): Cambie el tamaño de la imagen. Al deseleccionar el icono Toggle Size Constraints se desbloquea el vínculo entre la altura y el ancho, lo que le permite estirar o aplastar la imagen en lugar de mantener la relación de aspecto original de alto a ancho a medida que cambia el tamaño. También puede cambiar el tamaño de forma interactiva haciendo clic y arrastrando el control de la esquina inferior derecha de una imagen seleccionada. Mantenga pulsada la tecla Mayúsculas mientras cambia el tamaño para mantener la relación altura/anchura.
  • Cambiar la muestra: Las nuevas herramientas de CS6 le permiten cambiar el tamaño de una imagen (más pequeña). El remuestreo elimina datos innecesarios y hace que el archivo de imagen sea más pequeño, lo que significa que la imagen se puede descargar más rápido. 2. Seleccione la casilla de verificación Confirmar tamaño de la imagen para cambiar el tamaño de la misma, o haga clic en el botón Restablecer tamaño original junto a ella en el Inspector de propiedades para deshacer el cambio de tamaño.
  • Deja un comentario