Condividi tramite


Visualizzazione Progettazione

Nella visualizzazione Progettazione vengono visualizzati pagine Web ASP.NET, pagine master, pagine di contenuti, pagine HTML e controlli utente tramite una visualizzazione analoga a quella WYSIWYG. La visualizzazione Progettazione consente di aggiungere testo ed elementi, di posizionarli e ridimensionarli, nonché di impostarne le proprietà utilizzando menu speciali o la finestra Proprietà. La visualizzazione suddivisa consente di visualizzare e modificare un documento sia nella visualizzazione Progettazione sia nella visualizzazione Origine. Per impostazione predefinita, le due finestre sono disposte in orizzontale.

Quando vengono aggiunti elementi alla pagina, in Visual Web Developer viene creato markup corrispondente che può anche essere modificato nella visualizzazione Origine. Per informazioni, vedere Source View.

Per passare alla visualizzazione Progettazione, scegliere la scheda Progettazione nella parte inferiore della finestra di progettazione HTML.

Nota

La visualizzazione Progettazione consente di visualizzare solo il corpo del documento, ossia la parte tra i tag <body> e </body>.Sebbene sia possibile modificare alcune proprietà dell'elemento head, ad esempio il titolo del documento, utilizzando la finestra Proprietà documento, è necessario passare alla visualizzazione Origine per modificare le proprietà degli elementi che non fanno parte dell'elemento body.

Differenze tra la visualizzazione Progettazione e la visualizzazione in un browser Web

La visualizzazione Progettazione consente di visualizzare in modo analogo alla visualizzazione di modifica WYSIWYG l'aspetto della pagina in un browser. Tuttavia, nella visualizzazione Progettazione la pagina non corrisponde esattamente al risultato del rendering, ed è pertanto necessario controllare la pagina in un browser (o in più browser) per assicurarsi che venga visualizzata nel modo desiderato.

Un documento visualizzato in visualizzazione Progettazione differisce da uno visualizzato in un browser Web per i seguenti aspetti:

  • È possibile modificare l'area di progettazione.

  • Alcuni elementi come, ad esempio, i controlli origine, vengono visualizzati nella visualizzazione Progettazione a scopo di modifica, ma il rendering non viene eseguito nel browser. Per la maggior parte dei controlli che vengono visualizzati solamente durante la fase di modifica, il rendering viene eseguito come caselle di colore grigio nella visualizzazione Progettazione.

  • Alcuni tipi di formattazione di carattere e paragrafo possono essere visualizzati in modo differente rispetto a un browser specifico, se il browser Web implementa la formattazione in modo diverso rispetto alla visualizzazione Progettazione.

  • I collegamenti ipertestuali non sono funzionanti.

  • Non è possibile eseguire gli script client.

  • Il codice server non viene eseguito.

  • Negli elementi che supportano testo alternativo, come le immagini, non viene visualizzato il testo alternativo nelle descrizioni comandi quando si posiziona il puntatore del mouse su di essi.

Visualizzazione di caratteri null

Quando si utilizza un modello che contiene un carattere null, i caratteri che seguono il carattere null vengono troncati nella visualizzazione Progettazione. I dati non vengono persi, ma i caratteri che seguono un carattere null in un modello non vengono visualizzati nella visualizzazione Progettazione.

Posizionamento di elementi in visualizzazione Progettazione

Gli elementi nella pagina vengono fisicamente disposti dall'alto verso il basso. Per impostazione predefinita, quando viene eseguito il rendering della pagina nel browser, il rendering degli elementi viene eseguito seguendo lo stesso ordine, dall'alto verso il basso. È anche possibile posizionare gli elementi in modo bidimensionale, posizionandoli con coordinate orizzontali e verticali in qualsiasi punto della pagina. Questa opzione di layout usufruisce delle opzioni di posizionamento disponibili tramite gli stili. Per informazioni, vedere Posizionamento di elementi nella visualizzazione Progettazione.

Spostamenti nella visualizzazione Progettazione

Per facilitare lo spostamento tra elementi e la relativa selezione, la visualizzazione Progettazione fornisce le seguenti opzioni:

  • Struttura tag. La struttura tag consente di visualizzare l'elemento corrente nonché la gerarchia dei tag padre a cui appartiene. È possibile utilizzare la struttura tag per visualizzare gli elementi con stato attivo e per spostarsi dall'elemento corrente a un elemento più in alto nella gerarchia. Per informazioni, vedere HTML Editor Tag Navigator.

  • Struttura documento. La finestra Struttura documento consente di individuare e selezionare tutti gli elementi di un documento, inclusi quelli non visualizzati. Per informazioni, vedere How to: Navigate in the HTML Editor in Visual Studio.

  • Finestra Proprietà. Quando viene selezionato un elemento dall'elenco a discesa nella parte superiore della finestra Proprietà, l'elemento nel documento viene selezionato dall'editor.

Aggiunta di elementi

Nella visualizzazione Progettazione, è possibile aggiungere elementi a una pagina in tre modi:

  • Trascinandoli dalla Casella degli strumenti.

  • Facendo doppio clic sull'elemento nella Casella degli strumenti, per inserire così l'elemento nella posizione corrente del punto di inserimento nel documento.

  • Trascinandoli da un altro documento aperto in Visual Web Developer.

  • Trascinandoli da Esplora soluzioni. Questo metodo viene utilizzato soprattutto per aggiungere nella pagina controlli utente e riferimenti a fogli di stile.

  • Digitare il testo direttamente nella pagina.

Smart tag nella visualizzazione Progettazione

Nella visualizzazione Progettazione, molti controlli server ASP.NET visualizzano uno smart tag che consente di accedere rapidamente alle impostazioni e alle azioni utilizzate più di frequente per la configurazione del controllo. Per impostazione predefinita, lo smart tag viene visualizzato quando viene aggiunto un controllo alla pagina per la prima volta. È anche possibile visualizzare uno smart tag in qualsiasi momento, utilizzando il menu di scelta rapida o scegliendo il relativo simbolo.

Espressioni nella visualizzazione Progettazione

Nella visualizzazione Progettazione non è possibile utilizzare la finestra delle proprietàper modificare i valori dell'espressione. Ad esempio, se si assegna un'espressione a un controllo nella visualizzazione Origine, non è possibile modificare il valore di tale espressione nella visualizzazione Progettazione. Poiché il valore dell'espressione è calcolato, è necessario utilizzare la visualizzazione Origine per modificare l'espressione.

Aggiornamento della finestra di progettazione

Quando si passa dalla visualizzazione Origine alla visualizzazione Progettazione, può essere necessario aggiornare la finestra di progettazione per visualizzare determinati tipi di modifiche ai file. Ad esempio, il codice del tema viene analizzato, non compilato; pertanto, tutte le modifiche apportate al codice del tema nella visualizzazione Origine richiedono l'aggiornamento per essere visualizzate nella finestra di progettazione.

Per aggiornare la finestra di progettazione, è possibile eseguire una delle seguenti operazioni:

  • Fare doppio clic nella finestra di progettazione e scegliere Aggiorna.

  • Dal menu Visualizza, scegliere Aggiorna.

Vedere anche

Concetti

Posizionamento di elementi nella visualizzazione Progettazione

Altre risorse

Walkthrough: Creating a Basic Web Page in Visual Web Developer

Source View, HTML Designer

Web Designer Copy and Paste Operations

HTML Editor Tag Navigator

How to: Navigate in the HTML Editor in Visual Studio