>> DOUG LLOYD: Hivyo sisi alitumia about-- kama hesabu yangu ni sahihi,
na nadhani kuangalia back-- Nadhani sisi alitumia takriban 35 video kuzungumza
kuhusu masuala mbalimbali ya C, labda zaidi kidogo, labda kidogo kidogo.
Na hatukuwa kufunika kila kitu katika C, lakini sisi
kufunikwa chunk kubwa ya lugha, idadi kubwa ya hayo,
hakika kwa ajili ya matumizi ya kawaida.
Sasa sisi ni kwenda kuzungumza kuhusu lugha nyingine, HTML.
Na tunakwenda ili kufidia hivyo katika moja video tu.
>> Lakini hiyo ni kwenda kuwa sawa.
Hiyo inaenda kweli kuwa kitu wewe ni kwenda kupata kutumika.
Sasa kwa kuwa una misingi ya lugha moja,
ni kweli rahisi sana kuanza kujifunza wengine.
Hivyo sisi ni kwenda kuanza hatua kidogo nyuma
na Gloss juu ya msingi tofauti kati ya lugha hizi
na aina ya kuondoka kwa hilo.
Kuna mengi ya kubwa kweli kweli rasilimali kwenye mtandao, ambayo
sisi ni kwenda kuanza kuelekeza wewe kuelekea kwa sababu biashara ni
there kikubwa cha habari.
Na hivyo si kama utasikia kuwa kupoteza nje lazima
na kutokuwa na habari kufunikwa katika video.
Wewe utakuwa bado kuwa na uwezo wa kupata kila kitu unahitaji na matumizi
maarifa wameweza tayari kujengwa kwa kuelewa C
kufanya kujifunza Curve kwa hawa lugha zingine kweli mengi flatter.
Ninaahidi.
>> Lakini hebu majadiliano juu ya lugha moja hiyo ni kweli ya msingi kwa kila mtandao
ukurasa, ambayo ni HTML.
HTML ni mfumuko Nakala ghafi lugha.
HTML ni lugha lakini ni si lugha ya programu.
>> HTML hana vigezo.
Haina mantiki au kazi au kitu kama hicho.
Hatuwezi kufanya lolote programu per se katika HTML.
Wakati mwingine utasikia watu hujiita
kama programmers HTML, ambayo si sahihi kabisa.
Hatuwezi kuandika mipango HTML.
>> HTML ni tu kutumika kwa alama ya juu asilia.
Ni wito lugha ghafi.
Na nini hii does-- markup-- hii sisi kutumia vitambulisho katika HTML na tags-- hizi
hii markup-- semantically amefafanua muundo wa ukurasa
na husababisha Nakala wazi kwamba uliopo kati ya vitambulisho kutafsiriwa
na browsers kwa njia tofauti.
Na pengine ni bora kueleza njia hii na ya kielelezo.
>> Hapa ni rahisi sana HTML ukurasa, si Mpango HTML, tena, ukurasa HTML.
Na tunajua ni HTML ukurasa kwa sababu tumekuwa
imepakana kila kitu kwa HTML.
Hivyo hii ni nini HTML tag inaonekana kama.
Ni kati ya mabano pembeni.
Na taarifa juu tuna HTML na chini sana,
baada ya tumefanya nini inaonekana mengi ya HTML mengine,
tuna pembe mabano kufyeka HTML.
Hivyo kwamba aina ya ni mpaka kati ya kile ni HTML na nini si.
Na bila shaka, conventionally, tu kama wewe aliandika wote wa programu yako C
kwa nukta C upanuzi, wote wa files yako HTML
itaisha kwa nukta HTML upanuzi.
Lakini kuna zaidi kinachoendelea hapa.
Sisi si tu kuwa na haya tags.
Sisi inaonekana kuwa hii Jambo aitwaye tag kichwa.
Naam, OK, nini hiyo?
>> Vizuri labda ni bora kupambanua kwa njia ya mwili,
mwili kuwa maudhui ya ukurasa wa mtandao.
Hivyo labda tag kichwa amefafanua mambo hiyo siyo katika dirisha browser sahihi,
lakini ni kwa namna fulani muhimu wetu mtandao ukurasa kuwa kulipwa kwa usahihi.
Kwa mfano, ndani ya tag kichwa tuna vitambulisho cheo.
>> Hivyo kichwa kuwa hujambo dunia, hiyo ni kweli kwenda kuwa nini
inaonyesha juu katika tabo katika Chrome au katika safari au Firefox--
chochote kivinjari prefer-- hiyo ni nini kinaendelea show up katika cheo.
Na kabla ya tabo ni wataonyesha up katika browser yako nzima dirisha
na unaweza tu kuwa na ukurasa mmoja kufungua katika dirisha browser wakati huo.
Hivyo kwamba kinaendelea kuwa jina la ukurasa wangu katika tabo
au bar browser window, hello dunia.
Na kisha maudhui ya yangu mtandao ukurasa watakuwa dunia, hodi.
Basi hebu tuangalie nini baadhi Jambo kama hili ili kuangalia kama.
Hii ni pretty rahisi HTML ukurasa.
Hivyo mimi niko hapa katika CS50 yangu IDE na Nimekuwa zoomed katika kidogo.
Na mimi nina kwenda tu kwa kufungua hodi nukta HTML
na kuonyesha kwamba hii ni kiasi pretty ukurasa maudhui ambayo tuliona kabla.
My vitambulisho rahisi HTML, kichwa, vitambulisho cheo, mwili, na kadhalika.
Nimekuwa indented kuwa safi.
>> Na kisha nini siwezi kufanya katika wangu IDE ni hakikisho tu ukurasa.
Na kuna sisi kwenda.
Maudhui ya ukurasa wangu ni dunia, hello, na sioni chochote
katika kutoka vitambulisho kichwa huko.
Ni tu maudhui ya mwili.
Dunia, hodi.
Na tena mwili tu Alisema, dunia, hodi.
Sehemu nyingine ni kukosa.
>> Hivyo hiyo ni kweli wote ni.
Hii ni rahisi sana msingi HTML ukurasa.
Sasa nimekuwa indented HTML yangu kwa kuwa ni nzuri na kupangwa,
lakini mimi si kweli kuwa na.
Mimi naweza kufanya ni kuangalia pretty mbaya.
Na hii bado ingekuwa kazi.
Hii itakuwa exact mtandao ukurasa.
Nimekuwa tu wamezipata kuondoa wote wa nafasi nyeupe.
>> Kama ni zamu nje, nafasi nyeupe ni data.
Na hivyo wakati sisi ni kutuma taarifa kutoka mtumaji na mpokeaji, kutoka server
kwa mteja, data gharama za fedha.
Na hivyo kupata kuondoa whitespace ni kweli wazo nzuri
kama wewe ni mtu ambaye mtumishi mengi ya maudhui ya mtandao.
Ni wazo mbaya kama wewe ni mtu ambaye ni kujifunza mambo haya
na unataka kuwa na ni vizuri kupangwa.
Hii ni rahisi sana kuchanganua zaidi kuliko huu.
Lakini ni functionally kufanana.
>> Indentation na mambo kama hayo haina kweli jambo katika HTML.
Mambo ambayo yote ni kufungua vitambulisho na kufunga vitambulisho katika mpangilio sahihi.
Fikiria kilichotokea hapa, ingawa.
Ghafi inatupa njia ya kuwasilisha taarifa za ziada
kuhusu nini tumekuwa imeandikwa.
Sehemu Hello, Dunia ilikuwa kufasiriwa kama jina.
Na dunia, hodi sehemu ikawa kufasiriwa kama maudhui
au kile lazima inayoonekana kwenye mtandao ukurasa wangu.
>> Kuna zaidi ya 100 wa haya mbalimbali vitambulisho na kura ya rasilimali kubwa
online kupata yao.
Tunakwenda kuzungumzia wachache wao katika video hii, baadhi
ya mambo ya kweli ya msingi.
Lakini sisi siyo kwenda kuzungumza juu ya yote kwa sababu
itakuwa kamilifu kufanya hivyo.
>> Kitu kingine unaweza kufanya, ingawa, ni kufungua zana developer.
Na kama unakumbuka kutoka video wetu juu ya HTTP,
Nilivyoeleza jinsi ya kufungua up zana developer.
Katika Chrome ni kawaida F12 muhimu kufungua developer toolbar.
Kisha badala ya kuchagua Mtandao tabo, unaweza kuchagua tab Mambo.
Na kama wewe mzigo mtandao ukurasa, utasikia kweli
ona HTML ambayo inajenga kwamba ukurasa wa mtandao.
Na hivyo unaweza kujifunza mengi kuhusu HTML kwa kuangalia tovuti yako favorite
na kuona ni jinsi gani wao kujenga vipande mbalimbali ya kwao kwamba wewe kama.
Hivyo labda kuna baridi hii mfano au kitu kama hicho.
Jinsi gani wao kufanya hivyo na HTML?
Vizuri unaweza tu kufungua developer yako zana na hover juu kwamba kipengele
na kuona nini hasa HTML inafanya.
Hivyo hiyo ni kweli njia nzuri ya kujifunza HTML,
na mimi sana kupendekeza kwamba kufanya hivyo wote kujifunza HTML
na pia kujifunza kidogo kidogo kuhusu baadhi ya chaguzi
inapatikana na wewe katika zana developer, ambayo
bila ya shaka kuja katika Handy kama wewe kuanza kufanya kubwa zaidi mtandao
programu.
>> Basi hebu tuangalie michache ya kawaida HTML.
Na tutaweza kuruka na kuangalia nini hawa vitambulisho pia atatoa
kama kwa kuangalia baadhi files katika IDE yangu.
Hivyo hapa ni tatu vitambulisho msingi sana kwa tweaking kuonekana Visual ya maandishi.
Kuna vitambulisho B, mimi vitambulisho, na U vitambulisho.
Na mtiririko wanachokifanya ni kutoa maandishi baina yao katika ujasiri,
italics, na betona.
Basi hebu angalia nini kwamba bila kuangalia kama juu ya halisi ukurasa wa mtandao katika IDE yangu.
>> Hivyo hapa katika IDE yangu nina faili inayoitwa Biu nukta HTML.
Biu nukta HTML tu kuwa ujasiri, italiki, betona.
Mimi itabidi kufungua it up.
>> Na tutaweza kuona kwamba hapa mimi na kifungu hiki ni vitambulisho B ujasiri.
Nakala hii ni mimi vitambulisho italiki.
Na kifungu hiki ni U vitambulisho alitilia.
Kile ni hii kwenda kuangalia kama?
Vizuri tena, kila nina kufanya ni kwenda juu hapa
kwa browser yangu, faili browser yangu, bonyeza Hakikisho, na hii ni nini anakuja juu.
>> Nakala katika kati ya B vitambulisho ni kweli sasa ujasiri.
Nakala katika kati ya mimi vitambulisho ni kweli sasa italiki.
Na asilia katika kati ya U vitambulisho ni kweli sasa mkazo.
Hivyo hiyo ni nzuri sana.
Sisi sasa kujua jinsi ya kufanya Nakala kuangalia kidogo zaidi dhana
au kuchora msisitizo kwa mambo fulani.
Mwingine wanandoa wa vitambulisho kawaida hapa ni vitambulisho aya, P, na kichwa vitambulisho,
ambayo nimekuwa zilizotolewa hapa kama HX.
>> Vitambulisho hivi P, vitambulisho hivi aya, kuvunja maandishi yako juu katika aya.
Ni haitoshi tu hit Enter na kuondoka nafasi,
kwa sababu ya kompyuta ni kwenda tu kufanya nini kuwaambia ni kufanya
na huacha nyeupe nafasi kwa sehemu kubwa.
Hivyo hatuwezi tu hit Enter na kutarajia kompyuta yetu
kutafsiri kwamba tunataka kuanza aya mpya.
Tuna kupanga sana kusema hii ni moja paragraph-- hii ni another--
na enclosing kila mmoja kwa seti ya P vitambulisho.
>> Na sisi pia kuwa chaguzi hizo kwa H vitambulisho, vitambulisho hivi kichwa.
Tuna ngazi sita tofauti ya headers, moja, mbili, tatu,
nne, tano, na sita, ambayo ni kuendelea kubwa na kubwa
headers.
Na wao kupata ndogo na na ndogo ndogo na ndogo.
Hivyo tuna juu ya kichwa cha, pili kiwango cha mpira wa kichwa, na kadhalika, na kadhalika.
>> Hebu tuangalie labda baadhi Vitambulisho P na baadhi vitambulisho kichwa
katika hatua kwenye mtandao.
Hivyo hapa katika IDE yangu nina faili inayoitwa PH nukta HTML, PH kuwa aya
na kichwa vitambulisho.
Fungua kwamba up.
Kuna mengi kinachoendelea hapa kwa sababu nimekuwa kuweka baadhi lorem
ipsum, baadhi ya maandishi tu bila mpangilio katika hapa.
Hivyo mimi itabidi zoom nje kidogo kwa sababu kuna mambo mengi kinachoendelea.
Lakini taarifa kwamba nina katika sana Juu hapa nina H1, ngazi moja,
kichwa tag.
Basi nina aya, ambayo ni tu rundo la random text-- lorem ipsum--
tu chaguo kiwango kujaza katika maandishi.
Hivyo nina aya mbili ndani ya kwamba kiwango cha mpira wa kichwa moja na kisha chini chini mimi
na kichwa cha mawili hapa kwenye mstari 24, pili ngazi kichwa, na nyingine mbili
aya.
Vizuri nini hii kuangalia kama kama mimi kuona ni katika hakikisho wangu?
Hebu angalia.
>> Hivyo taarifa kwamba ngazi ya kwanza kichwa hapa
ni kweli kabisa kidogo kubwa kuliko cha pili cha mpira wa kichwa.
Hivyo tulikuwa vitambulisho H1.
Na taarifa kwamba vitambulisho P kuruhusu sisi kuvunja mambo ya nje katika aya.
Kama tungekuwa wamezipata kuondoa vitambulisho wale P na kwa kweli tu ya kuweka inaingia au anarudi
katika kati ya kile sisi matumaini ingekuwa kuwa aya mbalimbali,
wangeweza wote tu slam pamoja na bila kuwa hii aya nzuri
kujitenga na nafasi ya juu na chini.
Na hivyo hiyo ndiyo aya vitambulisho na kichwa vitambulisho
ni kawaida kutumika kufanya kuteka makini na sehemu ya mtandao wetu ukurasa
katika njia hiyo.
>> Next up ni baadhi ya vitambulisho kwamba sisi kutumia kujenga orodha kwenye mtandao wetu ukurasa.
Hivyo tuna unordered lists-- ULs-- ambayo ni haki
orodha orodha, kuamuru orodha ambayo ni numbered--
OLs-- na ndani ya ama mmoja wa wale tunahitaji kuwa na
seti ya jinsi ya kuonyesha vitu orodha, li.
Na hivyo tuna wazi ul tag na sisi kuweka vitu ndani yake.
Na kisha wakati sisi ni kosa kwa kwamba, tunaweza kuifunga tag ul.
>> Na vile vile tunaweza kuwa kuamuru au kuhesabiwa orodha
na kuweka vitu orodha ndani ya kwamba.
Hivyo hebu tuangalie katika michache ya orodha
na kile wangeweza atatoa kama juu ya CS50 IDE.
Hivyo nina hapa katika IDE yangu a faili inayoitwa orodha dot HTML.
Hebu tuangalie.
>> Na taarifa hapa nina unordered orodha kwa mambo matano katika hayo.
Na kisha mimi kuwa na orodha amri, na Nimekuwa iliyopita tag kidogo,
sawa?
Nilivyosema mwanzo ni sawa na sita.
Ni zinageuka na kuamuru orodha mimi Unaweza kuweka kianzio popote
Mimi want-- na msingi itakuwa one-- kwa kuongeza tu hii kinachojulikana sifa
kwa OL tag yangu.
Na hivyo orodha hii itakuwa kuanza kuhesabu saa sita.
Hivyo mambo ya kwamba orodha kuhesabiwa lazima sita, saba, nane, tisa, kumi,
kwa sababu kuna mambo matano katika orodha, kinyume na moja,
mbili, tatu, nne, tano, ambayo itakuwa kesi kama alikuwa alisema OL
bila kutaja mwanzo sifa.
>> Hivyo tutaweza tu preview hii hivyo unaweza kupata hisia kwa nini kinaendelea hapa.
Na kuna sisi kwenda.
Kuna orodha yangu.
Kwanza mambo matano ni unordered au orodha orodha.
Na wa pili mambo matano ni tofauti kuamuru orodha
kuanzia sita.
Hivyo hiyo ni jinsi tunaweza kujenga orodha kwa kutumia HTML.
Kitu kingine waweza wanataka kufanya na HTML
ni kujenga meza ya Maelezo ya safu na nguzo
kuwasilisha taarifa katika hasa kupangwa njia.
Kwa kufanya hivyo kwa HTML tunaweza kuwa meza ufafanuzi mwanzo mabano wazi
meza.
Na kisha ndani ya meza kwamba sisi inaweza kuwa na seti ya mistari, vitambulisho TR
zinaonyesha kila mstari.
Na kisha vitambulisho TD kwenda ndani ya vitambulisho TR kutaja safu ndani ya mfululizo.
>> Kwa nini ni kuitwa TD na si Mama?
Naam, TD anasimama kwa data meza.
Kwa kawaida wewe ni kuweka taarifa yako huko.
Hivyo kwamba ni kwa nini ni TD na si Mama.
Ni kidogo utata.
>> Hivyo kuwa vitambulisho meza na ndani ya vitambulisho yako meza
una idadi ya mistari, TRS.
Na ndani ya kila mstari una TDS kwa idadi ya nguzo
kwamba unataka kuwa mfululizo huo.
Hebu tuangalie sana rahisi meza juu katika CS50 IDE.
>> Hivyo nina hapa faili aitwaye meza nukta HTML.
Hebu kuwa na kuangalia nini kwamba inaonekana kama.
Kuna mengi kinachoendelea hapa lakini kama taarifa nina meza ya wazi.
Mimi nina kuanza ufafanuzi na meza.
Na kisha katika mstari yangu ya kwanza mimi inaonekana na nguzo nne, moja, mbili, tatu,
minne.
Na kisha mimi nina kufanyika kwa mstari huo.
>> Kisha mimi kuanza mstari mwingine na kufanya mbili, nne, sita, nane.
Kumaliza mstari huo.
Kufanya mwingine mstari, tatu, sita, tisa, 12.
Na kisha mstari wa mwisho, nne, nane, 12, na ingawa ni
a kidogo kukatwa hapa, 16.
>> Mimi kumaliza mstari huo.
Mimi kumaliza meza.
Na kisha mimi nina kufanyika kwa HTML yangu.
Je, hii kuangalia kama?
Naam, ni kweli mengi ya kuona.
Nimekuwa wazi kupangwa maelezo yangu kwa njia fulani zaidi ya kupangwa.
Lakini siyo super pretty hapa.
Na sisi ni kwenda kukabiliana na kwamba wakati sisi majadiliano juu CSS.
Tutaweza kupitia upya wazo hili la nini cha kufanya ili kufanya table--
labda muundo ni kidogo kidogo bora?
Lakini mimi bado wana safu nne, ambayo kila mmoja ina nguzo nne,
na kwa kweli ni nini hii ni sawa na ni rahisi sana manne karibu na kuzidisha nne
meza.
>> Chache tu zaidi ya vitambulisho tutaweza majadiliano juu.
Hebu majadiliano juu ya Dhana ya aina HTML.
Hivyo unaweza tumeona hii katika mazingira ya magogo katika ukurasa wa mtandao.
Kwa kawaida wewe aina katika jina la mtumiaji yako.
Wewe aina katika password yako, na wewe ni vizuri kwenda.
Hiyo itakuwa mwanzo wa fomu.
>> Kuruka juu div pili.
Sisi pia kuwa pembejeo ambayo aina ya kufaa ndani ya fomu.
Hizi ni mambo ambayo wewe ni kweli kuandika katika,
au kifungo cha redio uko Baada ya kuangalia, au kuangalia
masanduku kwamba wewe ni ticking mbali.
Basi hizi kwenda ndani ya fomu.
Nao wanaunda kimsingi kila mstari wa aina
kama fomu yako ni formatted vizuri.
Kisha kuna dhana hii ya div, ambayo haina kweli
fit katika jamii yoyote ile ya vitambulisho kama wale nimekuwa
wamekuwa wakifanya hapo awali.
Ni tu aina ya demarcates mwanzo wa baadhi division-- holela
div-- ya ukurasa.
Hakuna mapumziko ya kuona.
Hakuna mstari.
Siyo kuweka mbali kama chunk tofauti moja kwa moja.
Wewe d na style yake njia hiyo kufanya hivyo.
>> Ni tu aina ya anasema nataka kipande cha nafasi kwenye mtandao ukurasa wangu,
na mimi nina kwenda tu kuiita ni mgawanyo huu wa ukurasa wangu.
Tunaweza kuweka mambo ndani ya ya divs, na kwa kweli,
wakati sisi kichwa juu ya IDE katika pili, tutaweza
kuona kwamba mimi nina kuweka yangu kuunda ndani ya div.
>> Hivyo nina hapa katika IDE yangu a faili inayoitwa div fomu nukta HTML.
Hebu kufungua it up.
Taarifa kwamba kama nilivyosema, div ni aina ya holela.
Sawa?
Ni kweli haina maana yoyote.
Hivyo nina holela zamu ya kwanza ya ukurasa wangu.
Na kisha badala ya mwingine div baadaye, kuanzia kwenye mstari nane,
Nina fomu hii.
Na ndani ya fomu nina idadi ya pembejeo, mashamba ya fomu.
Hivyo nina uwanja ambaye jina lake ni A-- ambayo haina maana yoyote kweli
now-- haki kwamba inaonekana inachukua maandishi, mtu mwingine kwamba
inachukua neno la siri, mwingine ambaye yuko Radio kifungo, mwingine ambaye yuko sanduku kuangalia,
na mwingine ambaye yuko Kuwasilisha kifungo.
Naam, ni nini hii zote kweli kuangalia kama?
Naam, hebu tuangalie.
Tutaweza kufungua it up katika dirisha hakikisho yetu.
Taarifa kwamba hii holela kwanza division-- kuna
hakuna mgawanyo Visual hapa.
Haikuwa kweli kufanya kitu chochote, sawa?
>> Na kisha mimi kuwa fomu yangu.
Na mimi si kufanya formatting yoyote maalum.
Hivyo fomu ni moja tu kubwa mfululizo wa habari.
Kama mimi alikuwa mpangilio fomu yangu tofauti, Nipate kuwa ni kujipanga kwa mstari kwa mstari.
Lakini sikuweza kufanya styling yoyote.
Tena, sisi siyo kuzungumza juu CSS hapa.
Tunazungumzia tu juu HTML.
>> Vizuri katika fomu yangu Nakala siwezi type-- kukumbuka kwamba aina ya aina maandishi
hivyo siwezi kuweka jina langu.
Na katika neno langu la siri mimi Unaweza aina nenosiri langu.
Na kwa sababu shamba hilo ni ya aina password,
wewe hawajui nini nenosiri langu ni.
Ni dots wote.
>> Siwezi pia kuchagua Jibu mbali redio kifungo au Jibu mbali kisanduku.
Au mimi naweza kuwasilisha fomu yangu.
Na sikuweza kufanya chochote, hivyo wakati mimi kuwasilisha fomu yangu,
ukurasa tu refreshes.
Lakini mimi naweza labda configure yangu Kuwasilisha kifungo kufanya kitu kingine chochote.
Na tutaweza kuona nini tunaweza kufanya kwa kwamba katika video ya baadaye juu ya PHP.
Lakini hii hujenga sana fomu rahisi kwamba sisi
unaweza kutumia ili kuwa na watumiaji kuingiliana na kuwasilisha taarifa kwenye tovuti yetu.
>> Moja ya mwisho kabla ya sisi maoni hoja juu ya baadhi ya vitambulisho vingine
ni kwa tuangalie hii tag pembejeo mara moja zaidi.
Taarifa kwamba nimekuwa yalionyesha ncha za tag katika nyekundu.
Kila tag wengine tumeona hadi sasa ina alikuwa mwanzo na mwisho, ufunguzi
tag na kufunga tag.
>> Lakini pembejeo tag hana.
Hakuna maandishi kwamba huenda ni katika kati ya vitambulisho pembejeo.
Wote wa habari sisi ni na madhumuni ya kufikisha
umefungwa kama sehemu ya sifa ya pembejeo kwamba.
Taarifa tuna jina pembejeo sawa na x.
Aina sawa na y.
Hiyo ni kweli wote habari tunahitaji.
>> Hii inaitwa binafsi kufunga tag.
Ni hauhitaji kufungua na a karibu wote wa habari kwa sababu
ni zilizomo ndani ya tag na sifa zake.
Hivyo wakati mwingine utaona hii, pia.
Hivyo tu kuwa na ufahamu kwamba kama una tag kwamba ni kabisa binafsi zilizomo,
kufungua na kufunga yenyewe na wazi pembe mabano upande wa kushoto
na kufyeka pembe mabano ya juu ya haki.
Tutaweza kuona mwingine mmoja wa wale sasa hivi kwa vitambulisho picha pia.
>> Kabla ya sisi majadiliano juu ya picha, sisi haja ya kuzungumzia viungo.
Kama tunataka mtandao wetu ukurasa kuwa mwingiliano na hoja yetu karibu,
itakuwa nzuri na uwezo kwa bonyeza mmoja wa wale
kile ambacho kwa kawaida wamekuwa kiungo bluu.
Hii ni kweli jinsi sisi kujenga hyperlink katika mtandao wetu ukurasa.
Na cha kuvutia kuna tag mwingine HTML
aitwaye kiungo, ambayo si hyperlink.
Hapa anasimama kwa nanga, na hiyo ni jinsi sisi zinaonyesha hyperlink.
>> Href sawa na x njia kwenda mtandao ukurasa X. Na kila kitu
kati ya wazi tag na karibu tag
ni nini kinaendelea kuwa kwamba alitilia bluu Nakala kwamba inaonekana kama kiungo
kwamba sisi ni ukoo na.
Chini kwamba tuna tag picha, ambayo ni binafsi kufunga tag kwa ajili ya kuonyesha
picha ziko katika X. Na unaweza kuwa na uwezo wa kubadilisha
kwamba picha na kubainisha upana na urefu
na sifa nyingine katika kwamba dot dot dot huko.
>> Chini kabisa hapa tuna kuvutia sana
kuangalia tag kwamba hana na kufunga tag.
Ni mshangao uhakika doctype HTML.
Hivyo HTML imekuwa karibu tangu miaka ya 1990 kwa ajili ya kujenga kurasa za mtandao,
na ni gone wamekwisha marekebisho kadhaa tangu wakati huo.
Hivi karibuni mwaka 2014 ni alifanyiwa marekebisho
aitwaye HTML5 ambayo sasa ni ya sasa aina ya halisia HTML standard.
>> Zinaonyesha kwamba mtandao wetu kurasa ni kuandikwa kwa kutumia HTML5,
hii ni jinsi sisi kuanza mbali.
Ni inaweza kuachwa lakini nini kwamba kimsingi
njia ni huwezi kutumia yoyote ya vitambulisho ambazo ni vitambulisho HTML5, wale vitambulisho mpya.
Hivyo sisi daima kuanza mbali kama sisi ni kutumia HTML5.
Na vitambulisho wote tumekuwa aliyesema kuhusu awali si vitambulisho HTML5.
Lakini hii ingekuwa zinaonyesha kwamba Vitambulisho HTML5 atakuwepo.
Na hivyo tuna mshangao doctype HTML, ambayo
ni mwanzoni mwa yetu HTML faili, na kisha baada ya hatua hiyo
sisi kweli kuwa HTML yetu wazi kumtambulisha na kuendelea kutoka huko.
>> Moja ya mwisho ni maoni tag, ambayo inaonekana tofauti kidogo, pia.
Ni kuanza mbali na pembe mabano mshangao dash
dash lakini hakuna mabano kufunga.
Katika kati ya mambo hayo mawili huko ni wapi kuandika maoni yako.
Na hebu tuangalie picha na maoni na viungo katika CS50 IDE.
>> Hivyo nina hapa faili inayoitwa kiungo cha picha dot HTML ambayo mimi nina kwenda kufungua.
Na ilani Mimi nimepata michache ya maoni hapa katika HTML maoni yangu.
Hivyo tu kama katika C na wengine lugha ya programu,
HTML tu kwa kuwa lugha ghafi haina uwezo wa kuwa na maoni.
Na hivyo mimi nina inaonekana kwenda mahali picha ya Rick Astley
mahali fulani kati div hii tag, mgawanyo huu holela.
Inavyoonekana faili kwamba ni ziko katika Rick nukta JPEG, ambayo
kama sisi kichwa nyuma juu ya faili yangu mti kwa ajili ya pili,
ni faili kwamba ipo katika saraka ya sasa.
Hivyo hiyo ni sawa.
Siwezi rejea yake.
>> Kisha siwezi kuwa viungo vya ndani.
Hivyo taarifa juu ya mstari 11 hapa href yangu ni hodi nukta HTML.
Ili tu inahusu hodi nukta HTML ambayo ipo katika saraka ya sasa.
Na siwezi pia kuwa nje viungo na kubainisha tu HTTPS
zinaonyesha kwamba Mimi si kuzungumza kuhusu faili katika saraka yangu ya sasa.
Mimi kuzungumza juu ya faili kwamba ipo mahali fulani kwenye mtandao, ambayo nina
kuomba kutumia itifaki HTTP.
>> Basi hebu tuangalie nini ukurasa huu ili kuangalia kama
na kupata tayari kwa ajili ya Rick picha Astley show up kwenye kioo.
Hivyo mimi itabidi hakikisho hili.
Kuna Rick Astley katika sana juu katika hii holela
mgawanyiko mimi kuiweka juu.
Na kisha chini chini mimi na viungo yangu, sawa?
>> Mimi kuwa na uhusiano na hodi nukta HTML.
Na kama mimi bonyeza kwamba, mimi kupata wakiongozwa juu ya ukurasa huu
kuwa tuko familiar sana na kutoka mwanzo wa mpango wetu.
Kama mimi pop kwamba ukurasa wazi tena, kama mimi pop kiungo cha picha kufungua mara moja zaidi,
Mimi pia kwenda nje na tovuti CS50.
Na kuna sisi see-- mimi itabidi zoom nje kidogo here--
tutaona CS50 tovuti aina ya iliyoingia katika katikati ya ukurasa wetu.
Hivyo nilikuwa na uwezo wa kufanya ndani kuunganisha pamoja na kiungo nje.
>> Utawala mwisho na HTML kwamba tunakwenda kuzungumzia hapa
ni kwamba HTML yako lazima pia sumu.
Katika C sisi aliongea mengi kuhusu syntax mbalimbali ya mambo.
Katika HTML syntax kweli mhusisha vitambulisho.
Kila tag kufungua mahitaji ya kuwa imefungwa.
Na kwa kweli, kila tag kufungua lazima imefungwa katika kubadili utaratibu.
>> Hivyo kama wewe kufungua tag ujasiri, italiki tag, na kisha tag kusisitiza
kufanya yote matatu kwa Hasa seti ya maandishi,
unapaswa karibu yao ili reverse.
Hivyo kama wewe kufunguliwa ujasiri, italiki, kusisitiza, wewe
Unataka kuifunga kusisitiza, italiki, ujasiri.
Aina hii ya encapsulation ni nini anaendelea HTML nzuri na kupangwa.
>> Tofauti na C, ingawa, makosa syntax si kweli kudhoofisha HTML yako uwezekano.
HTML yako inaweza kuwa si vizuri sumu lakini bado kazi.
Na hivyo makosa hayo Unaweza aina ya slide kwa.
Ni juu yako na kweli kuwa macho.
Wao wakati mwingine kushindwa lakini wakati mwingine unaweza kupata mbali na hayo.
>> Ni inaweza kuwa kweli kazi ngumu, ingawa,
kuweka wimbo wa wakati kufunguliwa tag, wakati kufungwa,
hasa kama HTML yako mafaili kupata makubwa na kubwa.
Utasikia wanataka baadhi ya msaada.
Na kuna online zana validator kwamba
unaweza kutumia ili kuwa na kuangalia mtandao wako ukurasa na kuona kama ni vizuri HTML sumu.
Na unapaswa dhahiri tuangalie wale
na kuanza kutumia yao kama wewe kuanza kufanya baadhi ya kazi na HTML,
kuandika HTML, ili tu kupata baadhi ya tabia nzuri kuhusu kuandaa
HTML yako katika njia nzuri na style nzuri na kuhakikisha
kwamba wewe si kufanya kitu chochote ambacho inaweza kujenga hitilafu ya kisintaksia kwamba
inaweza kusababisha kidogo ya Tatizo chini ya barabara.
>> Mimi nina Doug Lloyd.
Hii ni CS50.