Hoe om `n tabel in html te skep

Diskes jy hoe om `n basiese inligtings tabel te skep deur HTML te gebruik, asook hoe om nuttige elemente soos grense aan die tabel te voeg.

Stappe

Deel 1 van 2:
Skep `n tafel
  1. Beeld getiteld Skep `n tabel in HTML Stap 1
1. Open `n teks-redigeringprogram. Jy sal tipies Notepad ++ op Windows en TextEdit op Mac gebruik. Om hierdie programme te vind:
  • Vensters - Oopmaak Aanskakel
Beeld getiteld WindowsStart.jpg
, tipe notaboek in begin, en klik Notaboek Aan die bokant van die venster.
  • Mac - Oopmaak Kollig
    Beeld getiteld macspotlight.jpg
    , tik in TextEdit, en klik TextEdit Onder die soeklig soek veld.
  • Beeld getiteld Skep `n tabel in HTML Stap 2
    2. Tik in en druk ↵ Tik. Thetag dui aan die begin van `n tafel, en druk ↵ Enter, vra jou teksredakteur om `n nuwe reël te begin.
  • By die gebruik van HTML moet jy altyd ↵ inskryf nadat jy `n lyn van kode geskep het om op die volgende reël te beweeg.
  • Beeld getiteld Skep `n tabel in HTML Stap 3
    3. Tik in en druk ↵ Tik. Hierdie opdrag dui aan dat jy `n spesifieke element van die tabel sal skep.
  • Beeld getiteld Skep `n tabel in HTML Stap 4
    4. Voeg `n kolom by jou tafel. Tik in om `n kolom aan te dui, tik die etiket vir die kolom in, tik in om die kolom te sluit, en druk ↵ Enter.
  • Byvoorbeeld: Om `n tabelkolom te skep "Aantal honde", Jy sal tik Aantal honde in jou teksredakteur.
  • Beeld getiteld Skep `n tabel in HTML Stap 5
    5. Voeg meer kolomme by. Afhangende van hoeveel kolomme wat jy wil hê jou tafel moet hê, sal hierdie stap wissel. Sodra jy al die kolomme bygevoeg het wat jy wil gebruik, gaan voort na die volgende stap.
  • Kolomme word van links na regs geskep.
  • Beeld getiteld Skep `n tabel in HTML Stap 6
    6. Tik in en druk ↵ Tik. Hierdie opdrag dui aan dat al die tabel se kolomme geskep is en sluit die gedeelte van die tabel se kode.
  • Beeld getiteld Skep `n tabel in HTML Stap 7
    7. Tik weer in en druk dan ↵ Tik. Jy sal nou jou rye by jou tafel voeg.
  • Beeld getiteld Skep `n tabel in HTML Stap 8
    8. Voeg `n sel by jou tafel. Tik in om `n stuk inligting onder die eerste kolom aan te dui, tik die inligting in, tik in om die sel te sluit en druk ↵ Enter.
  • Byvoorbeeld: Om `n sel met die nommer te skep "23" daarin sou jy tik 23 in jou teksredakteur.
  • Beeld getiteld Skep `n tabel in HTML Stap 9
    9. Voeg meer selle by jou tafel. Die aantal selle in `n ry moet verband hou met die aantal kolomme - byvoorbeeld, as jy drie kolomme het, moet jy drie selle in `n ry hê. Sodra jy `n hele ry geskep het, kan jy voortgaan.
  • Beeld getiteld Skep `n tabel in HTML Stap 10
    10. Sluit die huidige ry. Tik in en druk ↵ Enter om die ry te sluit. Op hierdie stadium kan jy `n ander ry oopmaak deur in te tik en te druk ↵ Enter, voeg individuele selle by, en dan die ry sluit.
  • Beeld getiteld Skep `n tabel in HTML Stap 11
    11. Maak jou tafel toe. Onder die laaste lyn van die tabel, tik in . Dit dui aan die einde van die tabel.
  • Beeld getiteld Skep `n tabel in HTML Stap 12
    12. Hersien jou tabel. Jou tafel moet so iets lyk:
  • Dag
  • Maand
  • Jaar
  • 4
  • Marsjeer
  • 1990
  • 27
  • Julie
  • 1993
  • Beeld getiteld Skep `n tabel in HTML Stap 13
    13. Stoor jou werk. Pers Ctrl+S (Windows) of ⌘ opdrag+S (Mac) om u dokument te stoor, voer dan `n naam vir die dokument in en klik Spaar Wanneer gevra word.
    • Deel 2 van 2:
    Voeg tabel wysigers by
    1. Beeld getiteld Skep `n tabel in HTML Stap 14
    1. Brei jou tafel uit. Vervang thetag aan die bokant van die laken met en tik dan
     styl ="Breedte: 100%"> in die merker. Maak seker dat jy `n spasie tussen "tafel" en "styl".
    • Die eindresultaat moet so lyk:
    • U kan met die persentasie eksperimenteer. Byvoorbeeld, tik in 50 in plaas van 100 sal lei tot `n half-as-wye tafel.
  • Beeld getiteld Skep `n tabel in HTML Stap 15
    2. Skep grense vir jou tafel. Skep `n spasie aan die bokant van die dokument bo thetag, doen dan die volgende:
  • Tik in en druk ↵ Enter.
  • Tik in tafel, th, td { en druk ↵ Enter.
  • Tik in Grens: 1px Solid Black- en druk ↵ Enter.
  • Tik in Border-ineenstorting: ineenstorting- en druk ↵ Enter. Slaan hierdie lyn oor as jy wil hê dat jou grense twee lyne in plaas van een moet hê.
  • Tik in } en druk ↵ Enter.
  • Tik in en druk ↵ Enter.
  • Beeld getiteld Skep `n tabel in HTML Stap 16
    3. Voeg `n etiket vir jou tafel by. Skep `n spasie net onder die thetag, doen dan die volgende:
  • Tik in
  • Tik die teks in wat u wil gebruik (e.heid g., Verjaarsdae)
  • Tik in en druk ↵ Enter.
  • Jou eindresultaat moet soos hierdie lyk: Verjaarsdae

    • Wenke

    Dit help om die verwante dele van die kode in te sluit sodat u dit later kan verwys. Byvoorbeeld, jy kan `n hele gedeelte van selle insteek.
  • Om sekere teks vet te maak, kan jy etikette rondom die betrokke teks plaas. Byvoorbeeld, om te draai "Aantal jare" in "Aantal jare", jy wil tik Aantal jare in die teksredakteur.

    • Waarskuwings

    Onthou altyd om opdragte te sluit.
    Deel op sosiale netwerke:
    Soortgelyk