Un iFrame viene utilizzato per inserire una pagina HTML esterna in una pagina Web. Questa operazione viene eseguita utilizzando il tag "< iFrame >", che può avere diversi stili ad esso collegati. Per esempio, ci sono alcuni stili di cornice che è possibile definire, ed è possibile utilizzare CSS (foglio di stile CSS) all'interno di iFrame. Con un po' di Javascript, è inoltre possibile includere gli stili dalla pagina padre nella tua iFrame.

Stili di cornice

Quando si utilizza il tag < iFrame > nel documento HTML, è possibile definire diversi stili per il telaio. Questo include allineare, confine, altezza, larghezza, margine e lo scorrimento. Per esempio, < iframe larghezza = "100px" height = "300px" scrolling = "auto" > vi darà un iFrame con una larghezza di 100 pixel, un'altezza di 300 pixel e include una barra di scorrimento se il documento è più di questa altezza. Questi stili effetto il telaio stesso, non il contenuto all'interno di questa cornice.

Stili interni

È possibile utilizzare il codice CSS per definire gli stili all'interno di un frame pure. Per effettuare questa operazione, inserire "< style type =" text/css">" nella parte superiore del documento verranno inseriti nella tua iFrame. Quindi definire gli stili inserendo "corpo {"..--seguita dagli attributi desiderati. Uno stile utile da utilizzare è quello di definire il colore della barra di scorrimento in modo che se il tuo iFrame dispone di scorrimento, verrà visualizzato nello stile che si desidera. Per fare questo tipo:

< style type = "text/css" >

corpo () {

ScrollBar-base-colore: blu;

ScrollBar-freccia-colore: rosso; }

< / stile >

Questo vi darà una barra di scorrimento che è blu, con le frecce rosse sulla parte superiore e inferiore.

iFrame stile

Se si utilizza un foglio di stile CSS esterno, è inoltre possibile definire il vostro vari stili di iFrame in là, anziché direttamente nel documento. Ciò è utile se si desidera mantenere il vostro iFrames coerente sopra parecchi documenti diversi. Per effettuare questa operazione, aprire il foglio di stile esterno e digitare "iframe {"..--da lì, immettere le proprietà desiderate coerente. Per esempio:

iframe () {

Width: 300px;

Altezza: 300px;

frameborder: 1; }

inserirà automaticamente iframe che sono 300 x 300 pixel e con un bordo intorno a loro, senza dover definire questi stili separatamente ogni volta.

JavaScript

È anche possibile utilizzare codice Javascript in combinazione con il tag iFrame per effetto gli stili interni della tua iFrame. Che cosa questo farà è inerente lo stile dal documento in cui si sta inserendo il tuo iFrame e utilizzarlo per il contenuto all'interno di iFrame. Questo può essere utile se si desidera avere contenuto esterno essere lo stesso per diversi Web diverse pagine, ma desidera che l'aspetto di cambiare sulla base di quale pagina è su. Per maggiori dettagli su come usare questo Javascript.