La necessità di estendere la tabella all'intero spazio della finestra del browser sorge, ad esempio, quando il design della pagina viene posizionato all'interno della tabella. La soluzione a questo problema non richiede la scrittura di codice complesso, ma implica la presa in considerazione di alcune caratteristiche del markup delle pagine web.
Necessario
Conoscenza base di HTML
Istruzioni
Passo 1
Innanzitutto, è necessario chiarire il significato dell'operazione imminente. Nel codice HTML, le pagine della tabella sono un insieme di tag accoppiati nidificati (uno di apertura e uno di chiusura). Tag cella (
) sono nidificati all'interno di tag stringa (
), e quelli, a loro volta, in tag di tabella (
). Nel tag di apertura della tabella, puoi impostarne la larghezza e l'altezza sia in unità assolute (pixel) che relative (percentuali). Con le dimensioni relative, la larghezza e l'altezza dell'elemento padre della tabella vengono prese come 100%. Se posizioni una tabella direttamente nel corpo della pagina (e non in un livello, modulo, altra tabella, ecc.), le dimensioni del suo elemento padre saranno la larghezza e l'altezza della pagina. Ciò significa che per estendere la tabella a tutto lo spazio libero, è necessario specificare le dimensioni orizzontali e verticali al 100%.
Passo 2
Ora puoi iniziare a metterlo in pratica in HTML. La larghezza e l'altezza della tabella sono specificate dagli attributi di larghezza e altezza. Quindi il codice della tabella che indica il 100% delle dimensioni in tutte le direzioni e, ad esempio, con due celle in una riga, potrebbe assomigliare a questo:
cella sinistra della tabella | cella destra della tabella |
Passaggio 3
Specificare il 100% di larghezza e altezza sarà sufficiente per allungare la tabella se si sceglie lo standard HTML corretto con il quale il browser dovrebbe leggere il codice della pagina. Il tag è posizionato sulla prima riga del documento. Hai bisogno di un tag con il seguente contenuto:
Passaggio 4
E un altro punto dovrebbe essere preso in considerazione nel tuo codice: per impostazione predefinita, la pagina è rientrata dai bordi della finestra di alcuni pixel, quindi la tabella, anche dopo aver riempito l'intera pagina, non si estenderà all'intera finestra. Per eliminare questi campi non necessari, puoi specificare zero rientri negli attributi corrispondenti nel tag di apertura del corpo della pagina ():
Passaggio 5
Una volta assemblato, l'intero codice della pagina con una tabella estesa per tutta la larghezza e l'altezza dello schermo avrà questo aspetto:
Tavolo allungato
cella sinistra della tabella | cella destra della tabella |