Leer HTML

HTML is die afkorting van Hyper Text Markup Language

, dit is die kode of taal wat gebruik word vir die skep van webwerwe. Dit kan dalk ingewikkeld lyk as jy nog nooit geprogrammeer het nie, maar om dit uit te probeer, benodig jy net `n eenvoudige woordverwerkingsprogram en `n internetblaaier. Dit kan wel wees dat jy sommige HTML herken van forums, aanlynprofiele of wikiHow-artikels. HTML is `n nuttige hulpmiddel vir enigeen wat die internet gebruik, en leer HTML kan minder tyd neem as wat jy verwag.

stappe

Deel 1
Leer die basiese beginsels van HTML

1
Maak `n HTML-dokument oop. Die meeste woordverwerkingsprogramme, insluitend Notepad of Word for Windows en Text Editor for Mac, kan gebruik word om HTML-dokumente te skep. Open `n nuwe dokument en kies Lêer → Stoor as in die boonste kieslys om jou dokument as `n webblad te stoor, of verander die lêeruitbreiding van ".doc", ".rtf" of iets anders ".html" of ".htm".
  • Dit is moontlik dat `n waarskuwing nou sal verskyn wat beteken dat u dokument van die RTF-formaat (Rich Text Format) verander sal word na die formaat "gewone teks", en dat sekere formatering opsies en beelde nie korrek gestoor word nie. U kan hierdie waarskuwing ignoreer. HTML-dokumente gebruik nie hierdie opsies nie.
  • .HTML en. Htm lêers is dieselfde. Dit werk beide.
  • 2
    Bekyk jou dokument met `n blaaier. Stoor jou leë dokument, maak dit toe en dubbelklik dan op die dokument op die plek waar dit gestoor is om dit weer oop te maak. As alles goed gaan, word jou dokument nou as `n leë webblad deur jou blaaier geopen. As dit nie werk nie, sleep die ikoon van die lêer na die adresbalk van jou blaaier. As jy later jou HTML-dokument wysig volgens die stappe in hierdie artikel, gaan jy altyd terug na die blaaier om te kyk hoe die veranderinge in die kode lyk.
  • Nota: jou webblad is nog nie aanlyn nie. Die bladsy is nie vir ander toeganklik nie en jy het nie `n werkende internetverbinding benodig om dit te toets nie. U gebruik slegs u blaaier om die HTML-dokument te wysig "lees" asof dit `n webwerf is.
  • 3
    Verstaan ​​wat `tags` is. Etikette is nie sigbaar op die finale webblad nie, soos gewone teks is. Die etikette vertel jou blaaier hoe die bladsy en die inhoud op die bladsy vertoon moet word. Die begin dag bevat instruksies. Byvoorbeeld, dit kan die leser vertel dat die teks vetdruk moet vertoon. Die eindtiket is nodig om die blaaier te vertel waar die instruksies van toepassing is. In hierdie voorbeeld is alle teks tussen die begin- en einddae vetdruk. Einde-etikette word ook tussen hakies geplaas, maar na die eerste hakies volg `n sny.
  • Skryf begin etikette tussen hakies: <dit is die begin dag>
  • Skryf eindtags tussen hakies, maar plaas `n sny na die eerste hakie: dit is die einddag>)
  • Lees verder in die artikel oor hoe om funksionele etikette te skryf. In hierdie stap moet jy net onthou hoe jy etikette skryf: < > en.
  • Etikette word ook in ander HTML kursusse genoem "elemente" en die teks tussen begin en einde tags word ook genoem "element inhoud" genoem.
  • 4
    Skryf jou eerste -tag. Elke HTML-dokument begin met `n -tag en eindig met a -tag. Dit vertel die leser dat alles tussen hierdie etikette in HTML geskryf is. Voeg hierdie etikette by jou dokument:
  • skryf bo-aan jou dokument.
  • Druk Enter of keer `n paar keer terug om jouself `n bietjie ruimte te gee en skryf dan
  • Onthou dat jy alles geplaas tussen hierdie twee etikette in hierdie artikel.
  • 5
    Maak dit -deel van u dokument. Tussen die etikette en jy skryf een -begin dag en `n finale dag. Maak weer `n spasie tussen hierdie etikette. Alles wat tussen hierdie etikette geskryf word, sal nie op die webblad self sigbaar wees nie. Probeer die volgende stappe uit en kyk of jy kan sien waar die inligting verskyn:
  • Skryf tussen die etikette en : en
  • Tussen die etikette en jy skryf: HTML leer - wikiHow.
  • Stoor die dokument en maak dit oop in `n blaaier (of stoor die dokument en verfris die bladsy op die blaaier as die bladsy nog oop was). Sien jy wat jy net bo-aan die bladsy bo die adresbalk geskryf het?
  • 6
    Maak een -afdeling aan. Alles anders in hierdie beginner dokument is in die afdeling geplaas, en dit word op die webblad gewys. na die merker, maar vir jy skryf die tag en . Alles wat ons in hierdie artikel bespreek, word tussen die liggaamsmerke geplaas. As alles goed gaan, het jy nou `n dokument wat so lyk (sonder die koeëls):
  • HTML leer - wikiHow
  • 7
    Voeg teks in verskillende style by. Nou is dit tyd dat jy iets skryf wat eintlik sigbaar sal wees in die blaaier! Alles wat jy skryf in die liggame, sal sigbaar wees in die blaaier nadat jy die veranderinge gestoor het en die bladsy binne die blaaier verfris het. skryf nie iets met die karakters < en >, omdat jou blaaier dit sal interpreteer as `n HTML-stelling in plaas van gewone teks. Skryf byvoorbeeld Hallo wêreld! (Engels vir "Hallo wêreld!", Dit is die wêreldwye standaardtekst as eerste voorbeeld in elke kursus programmering in `n bepaalde programmeertaal) of iets anders, en plaas die volgende tags voor en agter die teks en kyk steeds wat gebeur:
  • Hallo wêreld! lyk soos kursiewe teks: Hallo wêreld!
  • Hallo wêreld! lyk soos vet teks: Hallo wêreld!
  • Hallo wêreld! lyk soos `n gekruiste teks: Hallo wêreld!
  • Hallo wêreld! lyk soos superscript: Hallo wêreld!
  • Hallo wêreld! lyk soos `n onderskrif: Hallo wêreld!
  • Probeer kombinasies: Hoe lyk dit Hallo wêreld! lyk soos?
  • 8
    Verdeel jou teks in onderstaande afdelings. As jy verskillende lyne teks in jou dokument plaas, sal jy sien dat alle lyne agtereenvolgens geplaas word. Jy moet self nuwe reëls en reëls opstel:
  • Dit is `n aparte paragraaf.

  • Hierdie sin is op die eerste reël
    en hierdie sin op die volgende.

    Dit is die eerste merker wat ons ondervind, wat nie `n finale tag nodig het nie! Ons noem so `n merker leë tag.
  • Skep opskrifte om die name van die afdelings duidelik te maak:

    koptekst

    : die grootste moontlike kop

    koptekst

    (die 2e vlakkop)

    koptekst

    (die 3e vlakkop)

    koptekst

    (die 4e vlakkop)
    koptekst
    (die kleinste moontlike kop)
  • 9
    Leer hoe om lyste te skep. Daar is verskillende maniere om lyste op `n webblad te skep. Probeer die volgende metodes om uit te vind wat jy die beste hou. Let asseblief daarop dat een paar merkers rondom die hele lys geplaas word (soos die etikette
      en
    vir ongeordende lyste) en dat elke ander item in die lys geplaas word met `n ander paar tags, soos
  • en
  • .
    • Gebruik die volgende kode om lyste met koeëls te skep:
    • Een item
    • Nog `n item
    • Nog `n item
  • Of hierdie kode om genommerde lyste te skep:
  • Item 1
  • Item 2
  • Item 3
  • Of hierdie kode om `n sogenaamde definisie lys te skep:
    koffie
    - Warm drankie
    melk
    - Koue drankie
  • 10


    Maak jou bladsy aantrekliker met nuwe reëls, horisontale lyne en beelde. Nou is dit tyd om ander dinge by jou bladsy te voeg. Probeer die volgende etikette (die prent moet aanlyn geplaas word sodat jy `n skakel na die prent kan gebruik):
  • Voeg `n reël by:
    of
  • Voeg beelde in:
  • 11
    Voeg skakels by ander plekke op die bladsy. U kan ook hierdie kode gebruik om na ander bladsye en webwerwe te skakel, maar omdat u nog nie `n webwerf het nie, fokus ons daarop "anchors" (ankers), of spesifieke plekke op die bladsy waarop jy kan skakel:
  • Maak eers `n anker met die merker op die punt in die bladsy waarna u wil skakel. Gee jou anker `n duidelike naam wat maklik onthou kan word:

    Dit is die teks waarheen jy jou anker plaas.
  • Gebruik die tag om na jou anker of na `n ander webblad te skakel:

    Skryf die teks of prent wat hier as `n skakel getoon word.
  • Om na `n anker op `n ander bladsy te skakel, voeg die teken # na die url, gevolg deur die naam van jou anker. Byvoorbeeld https://nemuchtorstont.ru/HTML-leren#Tips bring jou reguit na die afdeling "wenke" op hierdie bladsy.
  • Deel 2
    Leer gevorderde HTML

    1
    Leer oor eienskappe. Eienskappe word binne die tag geplaas en word gebruik om addisionele aanpassings aan die "element inhoud" tussen begin- en einddae. Hulle staan ​​nooit alleen nie. Hulle word op die volgende manier geskryf: naam ="value". name staan ​​vir die naam van die kenmerk (byvoorbeeld "color") en value beskryf hierdie spesifieke geval (byvoorbeeld "red").
    • As u noukeurig gekyk het in die vorige gedeelte van hierdie artikel, het u alreeds eienskappe aangetref. Die merker gebruik die kenmerk src, `n anker gebruik die kenmerk name en skakels gebruik die kenmerk href. Jy kan sien dat hulle die grootte is ___ ="___" volg.
  • 2
    Eksperimenteer met HTML-tabelle. Om `n tabel of grafiek te skep, benodig jy verskillende etikette:
  • Begin met die etikette vir tafel ("table" in Engels) rondom die hele tafel:
  • Plaas etikette rondom die inhoud van elke ry:
  • Plaas kolomopskrifte in die eerste ry:
  • Plaas selle in opeenvolgende rye:
  • Dit is `n voorbeeld van hoe dit alles bymekaar kom:

    Kolom 1: MaandKolom 2: Spaargeld
    Januarie€ 100
  • 3
    Leer die ander etikette wat in die hoofafdeling gebruik word. Jy het die merker Alreeds geleer, jy plaas dit aan die begin van elke dokument. Langs die tag Daar mag dalk ander etikette in die hoofafdeling wees:
  • Metatags is gewoond aan metadata om `n webblad te genereer. Hierdie data word gebruik deur soekenjins om webbladsye te kategoriseer. Om jou bladsy sigbaar te maak vir soekenjins, kan jy een of meer metatags plekke (geen eindetikette is nodig nie), elke tag moet presies een naamattribuut en inhoudsattribuut bevat, byvoorbeeld: - of
  • -Merkers word gebruik om ander lêers na die bladsy te koppel. Dit word gewoonlik gebruik om CSS style sheets na HTML-bladsye te koppel. Hierdie bladsye word met `n ander tipe kode geskep en word gebruik om die algemene styl van `n bladsy te bepaal.
  • 4
    Speel met HTML uit bestaande bladsye. Om die bronkode van webblaaie te besigtig, is `n goeie manier om u HTML-kennis uit te brei. Klik op jou regter muisknop op die bladsy en kies "Bekyk bronkode", "Wys bladsybron" of iets soortgelyks. Probeer om uit te vind wat `n spesifieke merker jy nie ken nie of soek aanlyn vir die antwoord nie.
  • U kan die webwerwe van ander nie verander nie, maar u kan die HTML-kode na u eie dokument kopieer en daarmee afspeel om te sien wat verskillende aanpassings tot gevolg het. Nota: omdat baie webwerwe CSS style sheets gebruik, kan jy nie baie kleure of ander style sien nie.
  • 5
    Kom meer te wete oor HTML deur meer uitgebreide artikels te lees. Daar is baie bronne op die internet om meer HTML tags te bemeester w3schools of Codecademy. Daar is ook baie boeke op HTML beskikbaar, maar let asseblief daarop dat jy `n onlangse uitgawe gebruik, omdat die standaard op die gebied van HTML van tyd tot tyd verander. Sodra jy HTML op `n goeie vlak bemeester het, kan jy op CSS fokus vir meer beheer oor die ontwerp en styl van jou webblad. Dan is die volgende stap gewoonlik jаvascript.
  • wenke

    • Dit kan nuttig wees om na `n eenvoudige webblad op die internet te soek en dan met die kode te begin speel. Probeer om teks te beweeg, die lettertipe te verander, die beelde te verander, wat jy wil!
    • U kan `n notaboek gebruik om die kode neer te skryf, sodat u iets kan terugval as u nie onthou nie. U kan hierdie bladsy ook druk en dit as verwysing hou.
    • XML en RSS word deesdae toenemend op webwerwe gebruik. Die kode lyk onbereikbaar vir die menslike oog, veral as jy dit in die bronkode kyk, maar die funksie kan nuttig wees.
    • Die etikette wat in HTML gebruik word, is nie hooflettergevoelig nie, maar die verstek is om klein letters te gebruik (soos ons in hierdie artikel doen). Klein letters vir die etikette word sterk aanbeveel, ook vir verenigbaarheid met XHTML.

    waarskuwings

    • Sommige etikette word nie meer gebruik nie en is vervang deur ander etikette wat dieselfde doen, maar bied dikwels meer moontlikhede.
    • As jy seker wil maak dat jou bladsy aan die HTML-standaard voldoen, gaan na die W3-webwerf om jou kode teen die huidige standaard te toets. Baie etikette is nou verouderd en vervang deur etikette wat beter op moderne blaaiers werk.

    voorrade

    • `N Woordverwerkingsprogram, byvoorbeeld Notepad (Windows) of teks editor (Mac).
    • `n vel papier of notaboek (opsioneel)
    • `N Program wat spesifiek ontwerp is om HTML te skryf, soos Notepad + + vir Windows of TextWrangler vir Mac (opsioneel)
    Deel op sosiale netwerke:

    Verwante