1 files changed, 79 insertions, 0 deletions
diff --git a/files/it/tools/visualizzazione_flessibile/index.html b/files/it/tools/visualizzazione_flessibile/index.html
new file mode 100644
index 0000000000..09fd2cb08c
--- /dev/null
+++ b/files/it/tools/visualizzazione_flessibile/index.html
@@ -0,0 +1,79 @@
+---
+title: Visualizzazione Flessibile
+slug: Tools/Visualizzazione_Flessibile
+tags:
+  - Design
+  - Firefox
+  - Guida
+  - Mobile
+  - Strumenti
+  - Sviluppo
+  - Sviluppo Web
+  - responsive
+translation_of: Tools/Responsive_Design_Mode
+---
+<p><a href="/it-IT/docs/Web_Development/Responsive_Web_design">Le interfacce web responsive</a> si adattano a diverse dimensioni di schermo permettendo una presentazione fruibile su dispositivi di tipo diverso, come smartphone o tablet. La <strong>Visualizzazione Flessibile </strong>permette di visionare facilmente come il proprio sito o applicazione web risulterà su schermi di diverse dimensioni.</p>
+
+<p>La schermata seguente mostra il contenuto di una pagina Wikipedia in versione mobile simulando uno schermo della dimensione di 320x480 pixel.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12738/responsive-design-mode.png" style="height: 788px; width: 735px;"></p>
+
+<p>La <strong>Visualizzazione flessibile </strong>risulta conveniente perché permette di ridimensionare l'area del contenuto velocemente e con precisione.</p>
+
+<p>Naturalmente potrebbe essere sufficiente soltanto ridimensionare la finestra del browser ma questo comporterebbe il ridimensionamento in piccolo anche delle altre schede in fase di navigazione, rendendo il browser più difficile da usare.</p>
+
+<p>Mentre è attiva la <strong>Visualizzazione flessibile </strong>su una particolare scheda, è comunque possibile continuare a navigare normalmente i contenuti delle altre schede.</p>
+
+<h2 id="Attivazione_e_disattivazione">Attivazione e disattivazione</h2>
+
+<p>Ci sono tre modi per attivare la Visualizzazione flessibile:</p>
+
+<ul>
+ <li>Selezionare la voce "Visualizzazione flessibile" dal sottomenu "Sviluppo Web" nel menu di Firefox. (oppure menu Strumenti se è attivata la barra menu o si usa il sistema operativo OSX)</li>
+ <li>Premere il pulsante "Visualizzazione flessibile nella <a href="/it-IT/docs/Tools_Toolbox#Toolbar" title="/en-US/docs/Tools_Toolbox#Toolbar">Toolbar Strumenti di sviluppo</a></li>
+ <li>Premere Ctrl + Shift + M, (oppure Comandi + Opzioni + M su OSX)</li>
+</ul>
+
+<p>e ci sono anche tre modi per disattivare la Visualizzazione flessibile:</p>
+
+<ul>
+ <li>Selezionare nuovamente la voce di menu "Visualizzazione flessibile".</li>
+ <li>Cliccare il pulsante "chiudi" posizionato nell'angolo in alto a sinistra della finestra.</li>
+ <li>Premere nuovamente Ctrl + Shift + M, (oppure Comandi + Opzioni + M su OSX). Prima di Firefox 34, funzionava anche il tasto escape.</li>
+</ul>
+
+<h2 id="Ridimensionamento">Ridimensionamento</h2>
+
+<p>Si può ridimensionare l'area del contenuto in due modi:</p>
+
+<ul>
+ <li>Usando il controllo <a href="#select-size">"Seleziona dimensione"</a></li>
+ <li>Cliccando e trascinando le barre di controllo a destra e in basso l'area del contenuto, oppure trascinando l'angolo in basso a destra</li>
+</ul>
+
+<p>Decidendo di ridimensionare tramite click e trascina, tenendo premuto il tasto CTRL (Command su OSX) è possibile rallentare la velocità di ridimensionamento al fine aumentare la precisione per scegliere la dimensione giusta.</p>
+
+<div style="overflow: hidden;">
+<h2 id="Controlli_della_modalità_Visualizzazione_flessibile">Controlli della modalità Visualizzazione flessibile</h2>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12736/responsive-design-mode-controls.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<p>Lungo la parte alta della finestra in modalità "Visualizzazione flessibile" ci sono cinque controlli:</p>
+
+<dl>
+ <dt>Chiudi</dt>
+ <dd>Termina la modalità "Visualizzazione flessibile" e ritorna alla navigazione normale.</dd>
+ <dt>Selezione dimensione</dt>
+ <dd>Permette di scegliere un numero preimpostato di combinazioni larghezza x altezza, oppure di definirne una personalizzata.</dd>
+ <dt>Orientamento</dt>
+ <dd>Alterna l'orientamento verticale ed orizzontale simulando il cambio di orientamento del dispositivo.</dd>
+ <dt>Simula gli eventi touch</dt>
+ <dd>Attiva/disattiva la simulazione degli eventi touch: quando la simulazione è attivata, gli eventi del mouse vengono tradotti in<a href="/en-US/docs/Web/Guide/API/DOM/Events/Touch_events"> eventi touch</a>.</dd>
+ <dt>Screenshot</dt>
+ <dd>Cattura la schermata dell'area. Il salvataggio avviene nella posizione in cui vengono salvati anche gli altri Download.</dd>
+ <dt>User Agent personalizzato</dt>
+ <dd><em>Novità da Firefox 47</em>. Immettere una stringa che corrisponde al nome di un User Agent. L'area risulta evidenziata e le richieste verranno effettuate utilizzando la stringa User Agent impostata. Questo è utile quando i siti restituiscono diversi contenuti in base al riconoscimento per mezzo di <a href="/en-US/docs/Browser_detection_using_the_user_agent">UA sniffing</a>. Per tornare alla normalità è sufficiente svuotare il campo di testo.</dd>
+</dl>
+</div>
+
+<p> </p>