Guía del usuario Cancelar

Selección y visualización de elementos de la ventana de documento

Buscar

Última actualización el 21-12-2021

Seleccione y vea los elementos en Dreamweaver, muestre o oculte los iconos de marcadores para elementos invisibles y defina las preferencias de elementos invisibles.

Para seleccionar un elemento de la vista de Diseño de la ventana de documento, haga clic en el elemento. Si un elemento es invisible, tendrá que convertirlo en visible para poder seleccionarlo.

Algunos códigos HTML no tienen representación visible en los navegadores. Por ejemplo, las etiquetas comment no aparecen en los navegadores. No obstante, mientras crea una página, puede resultar útil poder seleccionar este tipo de elementos invisibles, editarlos, moverlos o borrarlos.

Dreamweaver permite especificar si debe mostrar iconos que marquen la ubicación de los elementos invisibles en la vista Diseño de la ventana de documento. Para indicar los marcadores de elementos que deben aparecer, puede definir opciones en las preferencias de Elementos invisibles. Por ejemplo, puede especificar que sean visibles los anclajes con nombre, pero no los saltos de línea.

Puede crear determinados elementos invisibles (como comentarios y anclajes con nombre) y modificarlos utilizando el cuadro de diálogo Preferencias > Elementos invisibles.

Selección de elementos

Para seleccionar un elemento visible de la ventana de documento, haga clic en el elemento o arrastre el puntero hasta el elemento.
Para seleccionar un elemento invisible, vaya a la vista Diseño y seleccione Ver > Opciones de vista de diseño > Ayudas visuales > Elementos invisibles (si no está seleccionado) y haga clic en el marcador del elemento en la ventana de documento.

Algunos objetos aparecen en un lugar de la página distinto a aquél en el que se ha insertado el código. Por ejemplo, en la vista de Diseño, un elemento con posición absoluta (elemento PA) puede situarse en cualquier lugar de la página, pero en la vista de Código, la definición del elemento PA debe establecerse en un lugar fijo. Cuando los elementos invisibles se encuentran visibles, Dreamweaver muestra marcadores en la ventana de documento para indicar la posición del código correspondiente a los elementos invisibles. Al seleccionar un marcador, se selecciona el elemento completo; por ejemplo, al seleccionar el marcador de un elemento PA, se selecciona el elemento PA completo.
Para seleccionar una etiqueta completa (incluido su contenido, si lo hay), haga clic en una etiqueta del selector de etiquetas, situado en la parte inferior izquierda de la ventana de documento. (El selector de etiquetas aparece tanto en la vista de Diseño como en la vista de Código). El selector de etiquetas siempre muestra las etiquetas que rodean a la selección actual o al punto de inserción. La etiqueta situada más a la izquierda es la etiqueta más externa que contiene la selección actual o el punto de inserción. La siguiente etiqueta está contenida en la etiqueta más externa, y así sucesivamente; la etiqueta situada más a la derecha es la etiqueta más interna que contiene la selección actual o el punto de inserción.

Visualización del código HTML

Para visualizar el código HTML asociado al texto u objeto seleccionado, realice una de las acciones siguientes:
- En la barra de herramientas Documento, haga clic en Código.
- Seleccione Ver > Código.
- Seleccione Ver > Dividir > opción Código-En Vivo, Código-Diseño o Código-Código.
- Seleccione Ventana > Inspector de código.
  
  Cuando seleccione un elemento en el editor de código (la vista de Código o el inspector de código), normalmente también se seleccionará en la ventana de documento. Es posible que tenga que sincronizar las dos vistas antes de que aparezca la selección.

Visualización u ocultación de iconos de marcadores para elementos invisibles

Seleccionar Ver > Opciones de vista de diseño > Ayudas visuales > Elementos invisibles.

Nota:

Al mostrar elementos invisibles, el diseño de la página puede cambiar ligeramente, ya que se desplazarán otros elementos unos pocos píxeles; de manera que, para lograr un diseño preciso, oculte los elementos invisibles.

Configuración de preferencias de Elementos invisibles

Utilice las preferencias de Elementos invisibles para seleccionar qué tipos de elementos estarán visibles al seleccionar Ver > Ayudas visuales > Elementos invisibles.

Seleccione Edición > Preferencias (Windows) o Dreamweaver > Preferencias (Macintosh) y haga clic en Elementos invisibles.
Seleccione qué elementos deben hacerse visibles y, a continuación, haga clic en OK.

Nota:

Una marca de verificación junto al nombre del elemento en el cuadro de diálogo indica que ese elemento se encontrará visible cuando seleccione Ver > Ayudas visuales > Elementos invisibles.

Anclajes con nombre

Muestra un icono que marca la ubicación de cada anclaje con nombre (a name ="") en el documento.

Scripts

Muestra un icono que marca la ubicación del código JavaScript o VBScript en el cuerpo del documento. Seleccione el icono para editar el script en el inspector de propiedades o para vincularlo a un archivo externo de script.

Comentarios

Muestra un icono que marca la ubicación de los comentarios HTML. Seleccione el icono para ver el comentario en el inspector de propiedades.

Saltos de línea

Muestra un icono que marca la ubicación de cada salto de línea (BR). Esta opción está desactivada de forma predeterminada.

Mapas de imágenes de la parte cliente

Muestra un icono que marca en el documento la ubicación de cada mapa de imagen de la parte del cliente.

Estilos incrustados

Muestra un icono que indica la ubicación de los estilos CSS incrustados en la sección body (el cuerpo) del documento. Si los estilos CSS están colocados en la sección Head del documento, no aparecerán en la ventana de documento.

Campos ocultos de formulario

Muestra un icono que marca la ubicación de campos de formulario que tienen el atributo type (tipo) definido como "hidden" (oculto).

Delimitador de formulario

Muestra un borde alrededor de un formulario para indicar dónde puede insertar elementos de formulario. El borde muestra el alcance de la etiqueta form, de manera que todos los elementos de formulario situados dentro de dicho borde estén correctamente encerrados entre etiquetas form.

Anclajes para elementos PA

Muestra un icono que marca la ubicación del código que define un elemento PA. El elemento PA puede encontrarse en cualquier lugar de la página. (Los elementos PA no son elementos invisibles; tan sólo el código que define al elemento PA es invisible). Seleccione el icono para seleccionar el elemento PA; podrá ver el contenido del elemento PA incluso en el caso de que el elemento PA esté marcado como oculto.

Anclaje para elementos alineados

Muestra un icono que indica la ubicación del código HTML para elementos que aceptan el atributo align. Estos elementos pueden ser imágenes, tablas, objetos ActiveX, plug-ins y applets. En algunos casos, el código del elemento puede estar separado del objeto visible.

Etiquetas de formato de servidor visuales

Muestra la ubicación de las etiquetas de formato de servidor (como las etiquetas Active Server Pages o ColdFusion) cuyo contenido no se puede ver en la ventana de documento. Estas etiquetas normalmente generan etiquetas HTML cuando las procesa un servidor. Por ejemplo, una etiqueta <CFGRAPH> genera una tabla HTML cuando la procesa un servidor ColdFusion. Dreamweaver representa la etiqueta con un elemento invisible de ColdFusion, ya que Dreamweaver no puede determinar el resultado dinámico final de la página.

Etiquetas de formato de servidor no visuales

Muestra la ubicación de las etiquetas de formato de servidor (como las etiquetas Active Server Pages o ColdFusion) cuyo contenido no se puede ver en la ventana de documento. Estas etiquetas normalmente son etiquetas de configuración, de procesamiento o lógicas (por ejemplo, <CFSET>, <CFWDDX>, y <CFXML>) que no generan etiquetas HTML.

CSS Display: Ninguno

Muestra un icono que indica la posición del contenido oculto por la propiedad display:none en la hoja de estilos vinculada o incrustada.

Mostrar texto dinámico como

Muestra el texto dinámico de la página en el formato {Recordset:Field} de forma predeterminada. Si la longitud de estos valores es suficiente para distorsionar el formato de página, puede cambiar la visualización a {}.

Server-Side Include

Muestra el contenido real de cada archivo server-side include.

Páginas relacionadas

Obtén ayuda de forma más rápida y sencilla

¿Nuevo usuario?