Að læra HTML

Myndband: Светодиодная лента 220 Вольт достоинства и недостатки. Обзор.

Efni.

Að stíga
Hluti 1 af 2: Lærðu grunnatriði HTML
2. hluti af 2: Nám í háþróaðri HTML
Ábendingar
Viðvaranir
Nauðsynjar

HTML er skammstöfun fyrir Hyper Text Markup Language, það er kóðinn eða tungumál sem er notað til að búa til vefsíður. Það kann að líta flókið út ef þú hefur aldrei forritað áður en að prófa það eina sem þú þarft er einfalt ritvinnsluforrit og netvafri. Þú kannast kannski við HTML af spjallborðum, prófílum á netinu eða wikiHow greinum. HTML er gagnlegt úrræði fyrir alla sem nota internetið og að læra HTML getur tekið skemmri tíma en þú gætir búist við.

Að stíga

Hluti 1 af 2: Lærðu grunnatriði HTML

Opnaðu HTML skjal. Flest ritvinnsluforrit, þar á meðal Notepad eða Word fyrir Windows og Text Editor fyrir Mac, er hægt að nota til að búa til HTML skjöl. Opnaðu nýtt skjal og veldu File → Save As úr efsta valmyndinni til að vista skjalið þitt sem vefsíðu eða breyttu skránafninu úr „.doc“, „.rtf“ eða öðru í „.html“ eða „.htm ".
- Þú gætir nú séð viðvörun um að skjalinu þínu sé breytt úr Rich Text Format (RTF) í „plain text“ sniðið og að sumir sniðvalkostir og myndir séu ekki vistaðar á réttan hátt. Þú getur hunsað þessa viðvörun; HTML skjöl nota ekki þessa valkosti.
- .html og .htm skrár eru eins. Það virkar bæði.
Skoðaðu skjalið þitt með vafra. Vistaðu auða skjalið þitt, lokaðu því og tvísmelltu síðan á skjalið á þeim stað þar sem það var vistað til að opna það aftur. Nú ætti skjalið þitt að vera opnað af vafranum þínum sem auða vefsíðu. Ef það virkar ekki skaltu draga táknið á skránni á veffangastiku vafrans. Seinna, ef þú breytir HTML skjalinu í samræmi við skrefin í þessari grein, heldurðu áfram að fara í vafrann til að athuga hvernig breytingar á kóðanum líta út.
- Athugið: vefsíðan þín er ekki nettengd ennþá. Síðan er ekki aðgengileg öðrum og þú þarft ekki virka nettengingu til að prófa hana. Þú notar bara vafrann þinn til að „lesa“ HTML skjalið eins og um vefsíðu væri að ræða.
Skil hvað „merki“ eru. Merkin sjást ekki á síðustu vefsíðunni eins og venjulegur texti getur gert. Merkimiðarnir segja vafranum þínum hvernig á að birta síðuna og innihaldið á síðunni. Upphafsmerkið inniheldur leiðbeiningar. Til dæmis getur það sagt vafranum að sýna textann feitletraðan. Lokamerkið er nauðsynlegt til að segja vafranum hvar leiðbeiningarnar eiga við: í þessu dæmi er allur texti milli upphafs- og lokamerkis feitletrað. Endamerki eru einnig sett innan sviga en skástrik fylgir fyrstu sviganum.
- Skrifaðu byrjunarmerki innan sviga: þetta er upphafsdagur>
- Skrifaðu lokamerki innan sviga en settu skástrik eftir fyrstu svigann: /þetta er lokamerkið>)
- Lestu síðar í greininni hvernig á að skrifa hagnýtar merkingar. Í þessu skrefi þarftu bara að muna hvaða leið á að skrifa merki:> og />.
- Í öðrum HTML námskeiðum eru merkingar einnig nefndar „þættir“ og textinn milli opnunar og lokunar merkja er einnig nefndur „frumefni“.
Skrifaðu fyrsta html> merkið þitt. Hvert HTML skjal byrjar með a html>tag og endar með a / html>tag. Þetta segir vafranum að allt milli þessara merkja sé skrifað í HTML. Bættu þessum merkjum við skjalið þitt:
- Skrifaðu html> efst í skjalinu þínu.
- Skelltu inn eða aftur nokkrum sinnum til að gefa þér svigrúm og skrifaðu síðan / html>
- Muna eftir þér allt í þessari grein milli þessara tveggja merkja.
Gerðu hausinn> hluta af skjalinu þínu. Milli merkjanna html> og / html> skrifar þú a höfuð>start tag og a / höfuð>-enda merki. Gerðu aftur smá bil á milli þessara merkja. Allt sem er skrifað á milli þessara merkja verður ekki sýnilegt á vefsíðunni sjálfri. Prófaðu eftirfarandi skref og sjáðu hvort þú sérð hvar upplýsingarnar birtast:
- Skrifaðu á milli höfuðsins> og / höfuðs> merkjanna: titill> og / titill>
- Milli merkisins titils> og / titils> sem þú skrifar: Hvernig á að læra HTML (með myndum) - wikiHow.
- Vistaðu skjalið og opnaðu það í vafra (eða vistaðu skjalið og hressaðu síðuna í vafranum ef síðan var enn opin). Sérðu það sem þú skrifaðir nýlega efst á síðunni, fyrir ofan heimilisfangslínuna?
Búðu til meginmál> hluta. Allt annað í þessu byrjendaskjal er sett í meginmálið> hlutann og það er sýnt á vefsíðunni. Eftir merkið / hausinn>, en fyrir framan merkið / html> sem þú skrifar líkami> og / líkami>. Allt sem við fjöllum frekar um í þessari grein setjum við á milli líkamsmerkjanna. Þú ættir nú að hafa skjal sem lítur svona út (án byssukúlanna):
- html>
- höfuð>
- titill> læra HTML - wikiHow / title>
- / höfuð>
- líkami>
- / líkami>
- / html>
Bættu við texta í mismunandi stílum. Nú er kominn tími til að þú farir að skrifa eitthvað sem raunverulega verður sýnilegt í vafranum! Allt sem þú skrifar innan meginmálsins verður sýnilegt í vafranum eftir að þú hefur vistað breytingarnar og endurnýjað síðuna í vafranum. Skrifaðu ekki eitthvað með skiltin og >vegna þess að vafrinn þinn mun túlka það sem HTML kennslu í staðinn fyrir venjulegan texta. Skrifaðu til dæmis Halló heimur! (Enska fyrir „Halló heimur!“, Þetta er alheims staðall textinn sem fyrsta dæmið á hvaða forritunarnámskeiði sem er á tilteknu forritunarmáli) eða eitthvað annað og settu eftirfarandi merki fyrir og eftir textann og sjáðu hvað gerist:
- em> Halló heimur! / em> lítur út eins og skáletraður texti: Halló heimur!
- sterkur> Halló heimur! / sterkur> lítur út eins og feitletraður texti: Halló heimur!
- s> Halló heimur! / s> lítur út eins og strikaður texti: ~~Halló heimur!~~
- sup> Halló heimur! / sup> lítur út eins og yfirskrift:
- undir> Halló heimur! / undir> lítur út eins og myndatexti: _{Halló heimur!}
- Prófaðu samsetningar: Hvernig sér em> sterkur> Halló heimur! / sterkur> / em> Farðu út?
Skiptu textanum þínum í málsgreinar. Ef þú setur mismunandi textalínur í skjalið þitt sérðu að allar línurnar eru settar hver á eftir annarri. Þú verður að forrita nýjar línur og auðar línur sjálfur:
- p> Þetta er sérstakur hluti. / p>
- Þessi setning er í fyrstu línu og þessi setning í næstu.
  Þetta er fyrsta merkið sem við rekumst á sem þarf ekki lokamerki! Við köllum slíkt merki eitt autt merki.
- Búðu til haus til að gera nöfn hlutanna skýr:
  h1> haus / h1>: stærsta mögulega haus
  h2> haus / h2> (hausinn í 2 stigum)
  h3> haus / h3> (hausinn í 3 stigum)
  h4> haus / h4> (4 stig hausinn)
  h5> haus / h5> (minnsti hausinn)
Lærðu hvernig á að búa til lista. Það eru nokkrar leiðir til að búa til lista á vefsíðu. Prófaðu eftirfarandi aðferðir til að komast að því hvað þér líkar best. Athugið að eitt par af merkjum er sett utan um allan listann (svo sem ul> og / ul> merki fyrir óraðaða lista) og að mismunandi par af merkjum er sett utan um hvert atriði innan listans, svo sem li> og / li> .
- Notaðu eftirfarandi kóða til að búa til punktalista:
  ul> li> Einn hlutur / li> li> Annar hlutur / li> li> Annar hlutur / li> / ul>
- Eða þennan kóða til að búa til númeraða lista:
  ol> li> Liður 1 / li> li> Liður 2 / li> li> Liður 3 / li> / ol>
- Eða þessi kóði til að búa til svokallaðan skilgreiningarlista:
  dl> dt> Kaffi / dt> dd> - Heitur drykkur / dd> dt> Mjólk / dt> dd> - Kaldur drykkur / dd> / dl>
Gerðu síðuna þína meira aðlaðandi með nýjum línum, láréttum línum og myndum. Nú er kominn tími til að byrja að bæta öðrum hlutum við síðuna þína. Prófaðu eftirfarandi merki (myndin verður að vera sett á netið svo þú getir notað krækju á myndina):
- Settu inn línu: br> eða hr>
- Settu inn myndir: img src = "the_url_of_your_image">
Settu inn krækjur á aðra staði á síðunni. Þú getur líka notað þennan kóða til að tengja á aðrar síður og vefsíður, en þar sem þú ert ekki með vefsíðu enn þá munum við einbeita okkur að „akkerum“, sem eru sérstakir staðir á síðunni sem þú getur tengt:
- Fyrst skaltu búa til akkeri með a> merkinu á þeim stað á síðunni sem þú vilt tengja við. Gefðu akkeri þínu skýrt nafn sem auðvelt er að muna:
  
  a name = "Ábendingar"> Þetta er textinn sem þú setur akkerið þitt í kringum. / a>
- Notaðu merkið href> til að tengja við akkerið þitt eða á aðra vefsíðu:
  
  a href = "slóð vefsíðu eða heiti akkeris á þessari síðu"> Skrifaðu textann eða myndina sem sést sem hlekkur hér. / a>
- Til að krækja í akkeri á annarri síðu skaltu bæta við # stafnum á eftir vefslóðinni og því næst nafnið akkeris þíns. Til dæmis http://www.wikihow.com/HTML-leren#Tips mun leiða þig beint í hlutann „Ábendingar“ á þessari síðu.

2. hluti af 2: Nám í háþróaðri HTML

Lærðu um eiginleika. Eigindir eru settar inn í merkið og eru notaðar til að gera viðbótarbreytingar á „frumefni“ milli upphafs- og lokamerkis. Þeir standa aldrei einir. Þau eru skrifuð á eftirfarandi hátt: nafn = "gildi". nafn táknar heiti eigindarinnar (til dæmis „litur“) og gildi lýsir þessu tiltekna máli (t.d. „rautt“).
- Ef þú hefur skoðað vel í fyrri hluta þessarar greinar hefurðu þegar lent í eiginleikum. Merkið img> notar eiginleikann src, akkeri notar eigindina nafn og tenglar nota eiginleikann href. Þú getur sagt að þeir eru allir stórir ___='___’ að fylgja.
Tilraun með HTML töflur. Til að búa til töflu eða línurit þarftu nokkur merki:
- Byrjaðu með töflumerkin („borð“ á ensku) um allt borðið:borð> / borð>
- Settu merki utan um innihald hverrar línu: tr>
- Settu dálkahaus í fyrstu röð: þ>
- Settu frumur í röð í röð: td>
- Þetta er dæmi um hvernig allt þetta kemur saman:
  
  tafla> tr> þ> Dálkur 1: Mánuður / þ> þ> Dálkur 2: Peningar sparaðir / þ> / tr> tr> td> janúar / td> td> € 100 / td> / tr> / borð>
Lærðu önnur merki sem notuð eru í höfuðhlutanum. Þú hefur þegar lært merkishausinn> sem þú setur í byrjun hvers skjals. Til viðbótar við titilinn> merkið geta verið önnur merki í höfuðhlutanum:
- Metamerki eru notuð til að búa til lýsigögn um vefsíðu. Þessi gögn eru notuð af leitarvélum til að flokka vefsíður. Til að gera síðuna þína sýnilega fyrir leitarvélum geturðu sett eitt eða fleiri metamerki (lokamerki eru ekki nauðsynleg), hvert merki verður að innihalda nákvæmlega eitt heitieinkenni og innihaldseiginleika, til dæmis: metanafn = "lýsing" innihald = "setja hér lýsing ">; eða meta name = "lykilorð" content = "skrifaðu lista með lykilorðum hér, alltaf aðgreind með kommu">
- hlekkur> merki eru notuð til að tengja aðrar skrár við síðuna. Venjulega notað til að tengja CSS stílblöð við HTML síður, þessar síður eru smíðaðar með mismunandi kóða og eru notaðar til að ákvarða heildarstíl síðunnar.
- script> tags eru notuð til að tengja javascript skrár við HTML síðuna. Javascript gerir síðunni kleift að breytast ef notandinn gerir eitthvað á síðunni.
Spilaðu með HTML af núverandi síðum. Að skoða frumkóða vefsíðna er frábær leið til að auka HTML þekkinguna. Hægri smelltu á síðuna og veldu „View source“, „Show page source“ eða svipað. Finndu hvað tiltekið merki sem þú þekkir ekki gerir eða leitaðu á netinu að svarinu.
- Þú getur ekki breytt vefsíðum annarra en þú getur afritað HTML kóðann í þitt eigið skjal og leikið þér með það til að sjá hvað mismunandi aðlaganir gera. Athugið: vegna þess að margar vefsíður nota CSS stílblöð geturðu ekki séð marga liti eða aðra stíl.
Lærðu um HTML með því að lesa fleiri ítarlegar greinar. Það eru mörg úrræði á internetinu til að ná tökum á fleiri HTML merkjum eins og W3Schools eða Codecademy. Það eru líka margar HTML bækur í boði, en vertu viss um að þú notir nýlega útgáfu þar sem HTML staðallinn breytist öðru hverju. Þegar þú hefur náð góðum tökum á HTML geturðu leitað til CSS til að fá meiri stjórn á hönnun og stíl vefsíðu þinnar. Eftir það er næsta skref venjulega javascript.

Ábendingar

Það getur verið gagnlegt að finna einfalda vefsíðu á Netinu og byrja síðan að klúðra kóðanum. Reyndu að færa texta, breyta leturgerð, breyta myndum, hvað sem þú vilt!
Þú getur notað minnisbók til að skrifa kóðann niður, svo að þú hafir eitthvað til að falla aftur á ef þú manst það ekki í smá stund. Þú getur líka prentað þessa síðu og haft hana til viðmiðunar.
XML og RSS eru í auknum mæli notuð á vefsíðum nú á tímum. Kóðinn kann að vera óaðgengilegur fyrir augu manna, sérstaklega þegar hann er skoðaður í frumkóðanum, en virkni getur verið gagnleg.
Merkin sem notuð eru innan HTML eru ekki hástafir en sjálfgefið er að nota lágstafi (eins og við gerum í þessari grein). Mjög mælt er með lágstöfum fyrir merkin, einnig vegna eindrægni við XHTML.

Viðvaranir

Sum merkin eru ekki lengur notuð og þeim hefur verið skipt út fyrir önnur merki sem gera það sama, en bjóða oft upp á fleiri valkosti.
Ef þú vilt ganga úr skugga um að síðan þín samræmist HTML staðlinum skaltu fara á W3 vefsíðu til að prófa kóðann þinn miðað við núverandi staðal. Mörg merki eru úrelt og í stað þeirra koma merki sem virka betur í nútíma vöfrum.

Nauðsynjar

Ritvinnsluforrit, svo sem Notepad (Windows) eða Text Editor (Mac).
blað eða minnisbók (valfrjálst)
Forrit sem er sérstaklega hannað til að skrifa HTML, svo sem Notepad ++ fyrir Windows eða TextWrangler fyrir Mac (valfrjálst)