CHIAMA SUBITO
0731 214634
 
 
 
 
 
 
 
Knowledge base
Knowledge base
Knowledge base
 
Programmazione - HTML
iframe responsive con width 100%

Se vogliamo incorporare un filmato youtube in una pagina del nostro sito e vogliamo che questo assuma le dimensioni della pagina questo è quello che dobbiamo fare:

Creare un div che contegna l'iframe con i seguenti stili CSS

.video embed {
               position: relative;
               padding-top: 30px;
               padding-bottom: 56.25%;
               height: 0;
               overflow: hidden;
             }

I 30px di padding-top servono per i controlli del video ed il 56,25% di padding-bottom è per il rapporto di visualizzazione 16/9

nel codice del iframe inserire

        width="100%"

        height="100%"

quindi:

<

div style="position: relative; padding-top: 30px; padding-bottom: 56.25%; height: 0; overflow: hidden;">

    <iframe width="560" height="315" src="https://www.youtube.com/embed/Owm8XVx4HEE" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

</div>

 

 

COMPUTER PLUS srl
Viale della Vittoria 8/a
60035 JESI (AN)
Tel. 0731 214634
Fax 0731 221903
info@computerplus.it
info@pec.computerplus.it
Chi Siamo
Dove Siamo
Lo Staff
Contatti
Richiesta assistenza
Supporto
 
Effettua i tuoi pagamenti online!
È facile e veloce!
 
Inoltre puoi utilizzare anche il nostro POS virtuale per pagare anticipi o fatture ⇨ pos.computerplus.it
© Copyright 2015 Computer Plus srl | P.Iva IT01538200427 | Termini e Condizioni> | Politica sulla privacy | Informativa sui cookies