Utilizzando il "overflow: auto" coppia proprietà / valore nel codice Cascading Style Sheet (CSS) dà una barra di scorrimento di un elemento HTML quando il contenuto va oltre una massima larghezza o altezza. Sapendo questo, è possibile rendere una tabella scorrere tramite il wrapping in un elemento contenitore, ad esempio un DIV. Poiché la barra di scorrimento verrà prendere qualche spazio all'interno del DIV e causare una seconda barra di scorrimento, è necessario aggiungere un po' di spazio per esso nel codice. È possibile applicare questo trucco su tabelle per creare sia una barra di scorrimento verticale o orizzontale.

Istruzioni

1

Aprire la pagina Web che contiene la tabella in blocco note o un editor di codice. Trovare il tag di apertura "< table >" e aggiungere un tag di apertura "< div >". Dare il tag "< div >" un nome ID:

< div id = "scorrere" >

< table >

2

Individuare la chiusura "< / tavolo >" tag e aggiungere una chiusura "< / div >" tag nella riga successiva:

< / tabella >

< / div >

3

Vai all'inizio del codice e cercare tra i tag "< head >" per i tag di "stile < >". Aggiungere il tag "< style >" se non vedete nessuno lì:

< style type = "text/css" >

< / stile >

4

Impostare una larghezza per la tabella se non hai già fatto così: tabella {width: 300px;}. Questo codice rileva qualsiasi tabella nella pagina Web e dà una larghezza di 300 pixel.

5

Impostare la larghezza del vostro DIV su un valore di 18 pixel più grande il vostro tavolo, per ospitare la barra di scorrimento: div {width: 318px;}.

6

Dare il vostro div un'altezza e impostare la proprietà di "overflow" su "auto": div {width: 318px; altezza: 200px; overflow: auto;}. Quando l'altezza della tabella supera l'altezza del DIV, si visualizzerà una barra di scorrimento verticale.

Consigli & Avvertenze

• Per ottenere una barra di scorrimento orizzontale, impostare la larghezza del DIV su un valore che si desidera utilizzare come larghezza massima per la tabella invece. La proprietà "overflow" verrà aggiunta una barra di scorrimento orizzontale quando la tabella supera la larghezza del DIV.
• Backup dei file pagina Web prima di tentare di modificarli.