How to Make Web paginakolommen dezelfde lengte

How to Make Web paginakolommen dezelfde lengte


Een gemeenschappelijke ontwerpen van webpagina's heeft kolommen aan beide zijden van de pagina. Kolommen zijn onderdelen van een tabel. Tabellen zijn elementen op webpagina's die op een pagina beslaan en opmaken van de breedte van elk gebied. U kunt met tabellen, een gelijke kolomlengte waarmee een aantrekkelijke lay-out. Tabellen zijn eenvoudige HTML-componenten, dus geen geavanceerde HTML-kennis is nodig om te ontwerpen van uw website lay-out.

Instructies

1

Maak een table-element in uw web-pagina. Een table-element kan nemen een deel van uw webpagina ruimte, of je kunt er de volledige breedte van de pagina. In dit voorbeeld wordt de tabel gemaakt voor een volledige rechterkant en linkerkant kolom. Als u wilt een tabel voor uw pagina hebt gemaakt, moet u de volgende code gebruiken:
< tabel breedte = "100%" >
< / table >
De "100%" waarde voor breedte zorgt ervoor dat de tabel over de gehele breedte van de pagina in de browser van de gebruiker worden verdeeld. U kunt ook een tabel alleen betrekking hebben op een gedeeltelijke gebied van de pagina instellen.

2

Twee tabelkolommen die gelijke grootte zijn maken. Voor dit voorbeeld een kolom links, Midden en rechts worden gemaakt. De linker- en kolommen worden gebruikt voor menu's, en de middelste kolom wordt gebruikt voor de inhoud van de pagina. De volgende code maakt een rechter en linker kolom van gelijke breedte:
< tabel breedte = "100%" >
< tr >
< td breedte = "25%" >< /td >
< td breedte = "50%" >< /td >
< td breedte = "25%" >< /td >
< /tr >
< / table >
In deze code worden de kolommen aan de linker- en rechterkant ingesteld als 25 procent van de totale breedte van de tabel. De 50 procent aanwijzing is de middelste kolom kunt u inhoud toevoegen aan de pagina's.

3

Inhoud toevoegen aan de tabelkolommen. Als de tabelkolommen zijn niet ingevuld, zal het niet verschijnen in uw pagina's. In dit voorbeeld, worden een linker- en rechterkant tekst ingevoerd. U kunt ook uw tabel opvullen met een ruimte karakter () voor het activeren van de cellen. De volgende code is een voorbeeld van een tabel met inhoud toegevoegd:
< tabel breedte = "100%" >
< tr >
< td breedte = "25%" > linkernavigatiebalk < /td >
< td breedte = "50%" > mijn paginainhoud < /td >
< td breedte = "25%" > rechts navigatie < /td >
< /tr >
< / table >

4

Sla uw wijzigingen in de code op en open de webpagina in een webbrowser. Merk op dat de kolommen in de tabel zijn van gelijke breedte op de pagina.