Kom godt i gang med HTML: Tabeller

HTML, forkortelse for HyperText Markup Language. Det er en standard, der fungerer som en reference til udviklingen af ​​websider i dens forskellige versioner, definerer en grundlæggende struktur og en kode (kaldet kode HTML) til at definere indholdet på en webside, såsom tekst, billeder, videoer, blandt andre. For at begynde at forstå, hvordan strukturen i dette sprog er defineret, starter vi i denne vejledning med at kende de etiketter, som tabellerne håndteres med, hvilket er meget nyttigt, når man hovedsageligt bygger strukturer i nyhedsbreve og forsendelser.
Formålet med denne vejledning er at give en forklaring, der hjælper grafiske designere på den enklest mulige måde at forstå strukturen og logikken i dokumenter HTML for at få den grundlæggende viden, der giver dem mulighed for at generere filer på dette sprog.

Krav

- Eje en kode editor som Dreamweaver CS6, Notesblok ++, sublim tekst blandt andre tilgængelige på Internettet.
- Få en webbrowser installeret, f.eks. Chrome, Firefox, Opera, Safari, Edge eller Internet Explorer.
Trin 1: Kend etiketterne til oprettelse af tabeller
med denne etiket definerer vi begyndelsen af ​​tabellen i strukturen HTML.
tillader oprettelse af en række til bordet
repræsenterer kolonneoverskriften, består disse kolonner af celler.
<>> er repræsentationen af ​​de celler, der er placeret i tabellernes rækker.
Dette er alle de etiketter, vi skal bruge til at oprette tabellerne, i det næste trin lærer vi, hvordan de erklæres inden for koden og deres rækkefølge.
Trin 2: Logisk erklæring af etiketter.
Det er vigtigt at vide, at i HTML skal langt de fleste tags åbnes, hvilket er lige når vi erklærer dem og også skal lukkes, følgende eksempel illustrerer dette koncept:

Som du kan se, skal hver etiket have sin åbning og lukning. De adskiller sig hovedsageligt ved den skråstreg "/", som etiketten lukker med. Hver gang et mærke oprettes, er det obligatorisk at erklære dets lukning på samme måde.
Trin 3: Hierarkisk erklæring af etiketter.
Etiketten Det er den første, der erklæres for at angive oprettelsen af ​​en tabel, og derfor begynde at oprette de celler, der vil indeholde de oplysninger, der skal vises.
Tabellerne består af kolonner og rækker.

Ved at tage os af den hierarkiske rækkefølge, som hver etiket skal have, opretter vi tabellen og introducerer de rækker, vi skal bruge til tabellen på billedet nedenfor:

Koden i tabellen skal se sådan ud:

Selvom tabellernes rækker allerede er defineret, er det nødvendigt at oprette de celler, der udgør kolonnerne i tabellen. Billedet herunder illustrerer dette koncept:

Koden i tabellen skal se sådan ud:

Trin 4: Tilføjelse af indhold til celler
Hvert mærke [color = # 7030a0] [/ farve] svarer til en celle i vores tabel, så det er her, informationen kan tilføjes. Vi ændrer den første etiket [color = # 44546a] [/ color] erklæret række alle [color = # 7030a0] [/ color] efter header tags [color = # 002060][/Farve]. I [farve = # 7030a0][/ farve] i resten af ​​rækker tilføjer vi prøveindhold. Koden HTML Det skal se sådan ud:

 
 
 
Vare
 
Navn
 
Efternavn
 

 
 
1
 
Pedro
 
Roser
 

 
 
2
 
John
 
Kilder
 

Trin 5: Gem dokumentet i HTML og se filen
I kodediteringsprogrammet går vi til menuen Filer / Gem, mens vi gemmer dokumentet i format .html

Senere åbner vi dokumentet i vores foretrukne browser:

Tabellen, vi har oprettet, skal ligne billedet herunder.

Indtil videre har vi lært navnet og funktionen af ​​etiketterne HTML at bygge tabeller, deres hierarkiske rækkefølge, deres logiske arrangement og tilføje indhold til dem. Vi er nu klar til at tilføje grafiske attributter til tabeller.Kan du lide og hjælpe denne vejledning?Du kan belønne forfatteren ved at trykke på denne knap for at give ham et positivt punkt