Hvordan bygge en tabell i et nettsted

Så du ønsker å lære å bygge et bord på en nettside? Du trenger å lære noen HTML-koder. Den første koden kalles "bord" tag, og det ser ut som dette: <table>. Dette forteller nettleseren at en tabell er å bli trukket i web siden. Du legger rader og kolonner i tabellen ved å bruke <tr> tag, noe som indikerer en ny rad i tabellen, og <td> tag, som brukes for å indikere at data vil bli lagt til i tabellen rad.

Bruksanvisning

Hvordan bygge en tabell i et wesbite

1 Finn området i HTML-koden på ditt nettsted siden der du ønsker å bygge bordet. Sett <table> -taggen i dette området.

2 Sett <tr> tag etter <table> tag, forteller denne nettleseren som en ny tabell rad blir dannet. Deretter setter du inn <td> tag å fortelle leseren at denne raden inneholder data (td står for tabelldata). Det skal se slik ut, <table> <tr> <td>

3 Skriv inn tekst, bilde eller informasjon du ønsker finnes i raden i tabellen etter <tr> <td> koder. HTML vil se slik ut, <table> <tr> <td> tekst- eller bilde går her. For å avslutte rad, bruker </ tr> </ td> koder.

4 Du kan legge til flere rader ved å bruke et annet sett med <tr> <td> tags, etter at </ tr> </ td> koder.

5 Når du er ferdig med å bygge bordet, setter </ table> tag. Dette forteller leseren at tabellen er nå "stengt".

Hint

  • Hvis du vil legge til flere kolonner i tabellen, setter du inn en <td> tag på slutten av teksten, eller bilde, av raden, etter den første <td> tag. Dette forteller leseren at det er mer informasjon som skal legges til bordet. Det vil automatisk danne en annen kolonne.
  • Legge </ tr> </ td> tags som forteller nettleseren for å avslutte rad, er ikke alltid nødvendig. Noen nettlesere automatisk anta den første raden er lukket når et annet sett med <tr> <td> kodene brukes til å erklære en ny rad.
  • Når du legger til en rad som har flere kolonner (<td> tags), og en rad som bare har én kolonne, må du bruke <colspan> tilskriver å forlenge bordet rad over kolonnene. Det vil se slik ut ...
  • <Table>
  • <Tr> <td> Din tekst ... mer tekst ... tekst ...
  • <Td> Her er en annen kolonne med tekst
  • <Td> Her er en annen kolonne i denne raden
  • </ Tr> </ td>
  • <Tr> <td colspan = "3"> Dette er en enkelt rad som jeg ønsker å utvide på tvers av de tre kolonner over, så jeg brukte <colspan = "3"> inne i koden.
  • </ Table>
  • Tabeller kan være forvirrende fordi nettlesere vil tolke dem annerledes. Bli kjent med å bruke <colspan> og <rowspan> attributter, for å ordne tabellceller som du vil de skal vises.
  • Nettlesere vil lese </ table> koder i forvirrende måter også, så hvis du bruker en tabell inne i en tabell, eller sette inn en <table> tag i HTML før du lukker første tabellen, sjekke hver side i en annen nettleser før du publiserer siden.