>> DAVEN FARNHAM: Í dag, ég ætla að tala svolítið um HTML,
HyperText Markup Language.
Þú sérð HTML alls staðar þessa dagana.
Í staðreynd, ef þú ert að horfa á þetta Vídeó í vafra, þú ert
sjá HTML núna.
HTML er ekki forritunarmál, Fremur er það Markup Language notuð af
vefur flettitæki til teikna síður á internetinu.
>> Svo þú might spyrja, hvernig nákvæmlega er að skrifa vefsíðu í HTML öðruvísi
Frá skrifa forrit í forritun tungumál eins og C?
Jæja, C er tungumál með mjög ströng syntactical reglur sem þarf að vera
saman áður en það er hægt að keyra.
Ef þú hefur einhvern tíma gleymt að fela í sér a semíkommu í lok yfirlýsingu í
C númerið þitt, þú veist hvað ég er að tala um í sambandi við stranga setningafræði.
>> Vefur flettitæki þó eru aðeins meira fyrirgefa þegar það kemur að HTML.
Jafnvel ef HTML er ekki setningafræðilega rétt, þín getur samt verið
birtar í vafranum, en það gæti ekki líta út eins og þú ætlaðir.
Svo það er alltaf best að fylgja reglunum.
Besta leiðin til að fá innsæi um hvernig hlutirnir vinna er að
fara í gegnum dæmi.
>> Svo er það sem við höfum hér undirstöðu Teikning til a vefur blaðsíða.
Þú tekið sennilega margt á milli horn sviga.
Jæja, þá eru bara merki.
Tags grundvallaratriðum upplýsa vöfrum að hey, eitthvað
er koma á þinn hátt.
Mundu þó, þegar þú opnar tag, þú þarft að loka henni þegar þú ert
gert með það.
>> Svo til dæmis, ég opna kafla af kóða með opinn
krappi líkami, loka krappi.
I bæta við þá texta, í þessu tilfelli, minn fyrstu vefsíðu svo þegar ég fór að
loka þessum kafla, ég nota nánast eins tag nema að þessu sinni með
skástrik fyrir líkamanum.
Almennt, þetta er snið sem þú ert fara að nota þegar þú ert að opna
og lokun tags.
Saman, opinn tag og endir tag yrkja það sem er kallað stak.
>> Ef þú horfir á fyrstu línu, munt þú sjá upphrópunarmerki á eftir
DOCTYPE HTML.
Þetta er í raun bara að segja vafranum þínum að skrá er vefsíðan
skrifuð í HTML.
HTML tag segir í raun, hér kemur nokkrar HTML.
Þá erum við með höfuðið tag með A titill tag inni það.
Höfuð tag þú getur hugsað sem samanstendur HTML kóða sem kemur fyrir
meginhluti vefsíðu þinnar raunverulegt innihald.
>> Almennt, setja þér titli Vefsíða hér, þó að það eru sumir
önnur merki sem geta birst hér eins vel.
Næst kemur líkami vefsíðu þinnar er Raunveruleg kjöt og bein af vefsvæði þínu.
Í dæminu okkar, höfum við bara að setja upp einfalt setning, First Webpage My,
sem, ef við hlaupum á síðuna okkar, mun líta smá eitthvað eins og this.
Vefsíða okkar er ekki of hinsegin, en ekki hafa áhyggjur.
Við munum greni það upp fljótlega.
>> Svo ofan HTML, munum við gefa þér mjög undirstöðu sniðmát fyrir vefsíðu,
ekkert fínt, bara Bare Bones.
En ef ég er að búa til vefsíðu, hvað ef ég vil bæta við
mynd af, segjum, mig?
Jæja, ég get gert það.
There ert a par af leiðir að bæta myndum inn á síðuna þína.
Ef myndin er í sömu möppu og HTML skrá, getur þú hlekkur til
Mynd með leið svona.
>> Þú opnar upp með mynd tag fylgt með í Alt eiginleiki í
uppspretta af myndinni.
Gildi ALT eiginleiki er bara sumir val texta ef notandi getur ekki
sjá myndina.
Einnig getur þú einnig hlekkur til ímynd um fullt URL, eins og þetta.
Nú, þessi vefsíða er í raun ekki til, en ef það væri mynd af
mig á þetta netfang, ég gæti notað uppspretta URL til að fela
ímynd þess á heimasíðu mína.
Annar hvor vegur, þú endar með mun fallegri website, eitthvað eins og this.
>> Jæja, það er laglegur kaldur, en ég góður af vilja sumir texta hér eins og heilbrigður.
Þannig að við skulum bara bæta við eitthvað frábær einfalt fyrir ofan
mynd, eins og hausinn.
Allt sem ég hef gert hingað til er að nota haus tag, H1, og línu brot tag, br.
Haus tag gerir letrið smá aðeins stærri og meira áberandi.
The línu brot tag, hins vegar vegar er góður af kaldur.
Ólíkt flestum öðrum merkjum, þú þarft ekki opnun og lokun brot tag, rétt
einn sýnt hér að ofan.
Þetta er vegna þess að brjóta hefur ekkert efni og er þess vegna, er tómur þáttur.
>> Tóm þættir eins og þetta, þú getur opnað og loka samtímis einfaldlega með
þ.mt framvirkum skástrik í af upphaflegum yfirlýsingu.
Svo nú vefsíðan mín lítur svolítið eitthvað eins og this.
Betri, en mér finnst svona eins og dauður enda.
Það er hvergi annars að fara til hliðar frá þessari aðal síðu.
Jæja, við skulum festa það með þ.mt tengil.
>> Hvað ég ætla að gera hér er að nota sem eigindi einkenndar með og gera
ímynd tengil á, segjum, CS50 TV.
Þannig þegar einhver smellir á mig, vafra þeirra verður beint að
annað, sennilega meira gagnlegur, vefur blaðsíða.
Ég hef þurft að draga úr the stærð af the texta svolítið vegna vefsíðu okkar er
að komast lengra.
En vonandi er það samt ljóst.
Vefsíðan mín lítur nákvæmlega það sama bara Nú, þegar ég smelli á myndina,
vafrinn minn opnast annar flipi fyrir CS50.tv vefsíðu.
>> Loksins, segjum að ég ætla að stíl þetta vefsvæði síðar að nota CSS.
CSS er það sem er þekktur sem Cascading stíll lak.
Og það veitir í grundvallaratriðum duglegur leið til að breyta og stíl
svipaðar blokkir af kóða.
Mig langar að byrja að skipuleggja HTML minn til gera það auðveldara að stíla síðar.
Hér setti ég upp tvær mismunandi tegundir af heiti til að skipuleggja kóðann minn.
Ég hef notað ID eiginleiki inni a deild, eða div tag, og ég hef notað er
Class eigindi inni annar div tag.
>> ID og Class eiginleika vinna á svipaðan hátt.
Eini munurinn er að þú getur aðeins haft einn þáttur, tiltekna ID, en
allir tala um þætti geta deilt bekknum.
Svo til dæmis, ég get notað í bekknum mynd mörgum sinnum, en ég get ekki
búa á aðra með ID ofan.
Þó að ég hafi ekki farið inn í CSS, annað tungumál sem almennt eru notaðar
hlið HTML, þegar ég byrja hönnun númerið mitt með CSS, get ég notað þetta
skipulagsbreytingar eiginleika til að hafa áhrif fagurfræði Web Page míns.
>> Allt sviðinu efst mun hafa svipaða stylings eða einhverju
annar hópur HTML I hóp inn í flokki ímynd deila svipuðum útlit.
Þetta er miklu auðveldara en að reyna að breyta og stíl myndir eða blokkir
texta fyrir sig.
>> Þannig að við fórum yfir grunnatriði hvernig að gera vefsíðu með HTML.
HTML hefur fullt af öðrum aðgerðum of að þegar par með öðrum tungumálum
eins og CSS og JavaScript, getur raunverulega gera síðurnar standa út.
Besta leiðin til að fá þægilegri með HTML er bara að skipta um með það,
sjá hvað virkar og hvað virkar ekki.
>> Mitt nafn er Daven Farnham.
Þetta er CS50.
>> Svo til dæmis, ég get notað bekknum mynd -
Nei, það eru svo margir eiginleikar.
Mitt nafn er Daven Farnham.
Þetta er CS 650.
Mig langar að segja CSS.
Þetta er CSS.