DOUG LLOYD: Kaya namin na ginugol about-- kung ang aking math ang tama, at sa tingin ko naghahanap back-- tingin ko namin na ginugol ang tungkol sa 35 mga video na pakikipag-usap tungkol sa iba't ibang aspeto ng C, siguro ng kaunti pa, marahil ng isang maliit na mas mababa. At hindi namin ginawa masaklawan lahat ng bagay sa C, ngunit hindi namin sakop ng isang malaking tipak ng wika, ang karamihan sa mga ito, tiyak para sa mga karaniwang gumagamit. Ngayon kami ay pagpunta sa makipag-usap tungkol sa isa pang wika, HTML. At kami ay pagpunta upang masakop ito sa isang video lamang. 

Ngunit iyon ay magiging OK. Iyan ay pagpunta sa tunay na maging isang bagay na ikaw ay pagpunta sa masanay. Ngayon na mayroon ka ng mga mga batayan ng isang wika, ito ay aktwal na medyo madali upang simulan ang pag-aaral ng iba. Kaya kami ay pagpunta upang simulan ang sa hakbang ng isang maliit na bumalik at pagtakpan ang basic pagkakaiba sa pagitan ng mga wikang ito at ang uri ng mga iniwan mo dito. May isang pulutong ng mga tunay na magaling resources sa internet, kung saan kami ay pagpunta sa simulan ang nagtutulak sa iyo patungo dahil ang internet ay isang malawak na imbakan ng impormasyon. At kaya ito ay hindi na gusto mo makikita maging pagkawala out kinakailangang sa pamamagitan ng hindi pagkakaroon ng impormasyon sakop sa isang video. Makikita mo pa rin ay maaaring makakuha ng lahat ng kailangan mo at gamitin ang kaalaman na sa iyo na binuo sa pamamagitan ng pag-unawa sa C upang gawin ang mga pag-aaral curve para sa mga iba pang mga wika tunay na isang pulutong mambola. Pangako ko. 

Ngunit makipag-usap tungkol sa isang wika hayaan iyan ay talagang pangunahing para sa bawat web pahina, na kung saan ay HTML. HTML ay ang Hyper Text Markup Language. HTML ay isang wika ngunit ito ay hindi isang programming language. 

HTML ay hindi magkaroon ng mga variable. Hindi nito ay may lohika o andar o anumang bagay tulad na. Hindi namin maaaring gawin ang anumang programming per se sa HTML. Minsan makikita mo marinig tao ilarawan ang kanilang sarili bilang programmer HTML, na kung saan ay hindi ganap na tumpak. Hindi namin maaaring sumulat ng mga programa HTML. 

HTML ay ginagamit lamang upang markahan up teksto. Ito ay tinatawag na isang markup language. At kung ano ito does-- ito markup-- ginagamit namin ang mga tag sa HTML at mga tags-- ito markup-- semantically tumutukoy sa istraktura ng isang pahina at nagiging sanhi ng mga plain text na umiiral sa pagitan ng mga tag upang bigyang-kahulugan sa pamamagitan ng browser sa iba't ibang paraan. At marahil ito ay pinakamahusay upang ipaliwanag ito sa pamamagitan ng paraan ng isang paglalarawan. 

Narito ang isang napaka-simpleng pahina ng HTML, hindi isang programa ng HTML, muli, isang HTML na pahina. At alam namin na ito ay isang HTML page dahil hindi namin bounded ang lahat ng bagay na may mga tag na HTML. Kaya ito ay kung ano ang hitsura ng isang HTML tag tulad ng. Ito ay sa pagitan ng angle bracket. At mapansin sa tuktok kami HTML at sa pinakadulo ibaba, matapos ang aming nagawa kung ano ang tila isang pulutong ng iba pang mga HTML, kami ay may angle bracket slash HTML. Kaya na uri ng ay ang hangganan pagitan ng kung ano ang HTML at ano ang hindi. At siyempre, conventionally, makatarungan gaya ng isinulat mo ang lahat ng iyong C programa may tuldok C extension, ang lahat ng iyong mga file na HTML ay nagtatapos sa tuldok extension HTML. Ngunit mayroong higit pa sa pagpunta dito. Hindi namin lamang magkaroon ng mga tag na HTML. Malas naming magkaroon ito bagay na tinatawag na isang ulo tag. Well, OK, ano na? 

Well marahil ito ay pinakamahusay na makilala sa pamamagitan ng paraan ng isang katawan, katawan na ang nilalaman ng mga web page. Kaya siguro ang ulo tag tumutukoy stuff na ito ay hindi sa window ng browser tamang, ngunit sa anuman ay mahalaga sa aming mga web page na nai-render nang tama. Halimbawa, sa loob ng head tag na namin title tag. 

Kaya title pagiging kumusta mundo, na ang tunay na pagpunta sa kung ano nagpapakita sa mga tab sa Chrome o sa safari o Firefox-- kahit anong browser prefer-- ka na ano ang pagpunta sa magpapakita sa mga pamagat. At bago tabs ito ay magpapakita ng up sa iyong buong window ng browser at maaari ka lamang magkaroon ng isang pahina buksan sa isang window ng browser sa isang pagkakataon. Kaya na ang pagpunta sa maging ang pamagat ng aking pahina sa tab o window ng browser bar, hello mundo. At pagkatapos ay ang nilalaman ng aking web page ay mundo, hello. Kaya sabihin kumuha ng isang pagtingin sa kung ano ang ilang mga bagay na tulad nito ay maaaring magmukhang. Ito ay isang medyo simpleng pahina ng HTML. Kaya ako dito sa aking CS50 IDE at Na naka-zoom ko sa ilang sandali. At lamang ako ng pagpunta sa magbukas kumusta dot HTML at ipakita sa iyo na ito ay medyo marami nilalaman ng pahina na nakita natin dati. My simple HTML, ulo ng mga tag, tag ng pamagat, katawan, at iba pa. Na naka-indent kong maging malinis. 

At pagkatapos ay kung ano ang maaari kong gawin sa aking IDE ay i-preview lamang ang pahina. At doon kami pumunta. Ang nilalaman ng aking pahina ay mundo, hello, at hindi ko makita ang anumang bagay in mula sa ulo ng mga tag doon. Ito lang ang nilalaman ng katawan. World, hello. At muli ang katawan lamang sinabi, mundo, hello. Ang iba pang mga bahagi ay nawawala. 

Kaya na talagang lahat ng ito ay. Ito ay isang napaka-simpleng basic HTML na pahina. Ngayon na naka-indent ko na ang aking HTML sa maging talagang maganda at inorganisa, ngunit hindi ko talaga kailangang. Kaya kong gawin itong magmukhang medyo pangit. At ito ay gagana pa rin. Ito ay ang eksaktong parehong web page. Ko na lang nakuha mapupuksa lahat ng mga white space. 

Bilang ito ay lumiliko out, white space ay data. At kaya kapag kami ay nagpapadala ng data mula sa sender sa receiver, mula sa server sa client, gastos sa pera ng data. At kaya pagkuha ng alisan ng whitespace ay talagang isang magandang ideya kung ikaw ay isang tao na naglilingkod up ng isang pulutong ng mga web content. Ito ay isang masamang ideya kung ikaw ay isang tao kung sino ang pag-aaral ng mga bagay-bagay na ito at gusto mong magkaroon ng ito mabuti na inayos. Ito ay isang pulutong mas madali upang i-parse kaysa ito. Ngunit ito ay pagtakbo kapareho. 

Ang indentation at bagay-bagay na tulad ng ay hindi tunay na mahalaga sa HTML. Ang lahat na bagay ay pagbubukas ng mga tag at mga pagsasara ng mga tag sa tamang pagkakasunod-sunod. Pansinin kung ano ang nangyari dito, bagaman. Markup ay nagbibigay sa amin ng isang paraan upang makipag-usap sa dagdag na impormasyon tungkol sa kung ano na aming sinulat. Ang Hello, World bahagi ay kahulugan bilang ang pamagat. At ang mundo, hello bahagi ay kahulugan bilang ang nilalaman o kung ano ang dapat na makikita sa aking mga web page. 

Mayroong higit sa 100 sa mga ito ang iba't ibang tag at maraming ng mahusay na mga mapagkukunan online upang mahanap ang mga ito. Kami ay pagpunta sa makipag-usap tungkol sa isang ilan sa mga ito sa video na ito, ang ilang mga sa mga tunay na mga pangunahing bagay-bagay. Ngunit hindi namin pagpunta talk tungkol sa lahat ng ito dahil ito ay magiging napakahirap na gawin ito. 

Isa pang bagay na maaari mong gawin, bagaman, ay bukas hanggang tool ng developer. At kung ang pagpapabalik sa iyo mula sa aming mga video sa HTTP, Ipinaliwanag ko kung paano buksan up tool ng developer. Sa Chrome ito ay karaniwang ang F12 key para buksan ang toolbar developer. Pagkatapos ay sa halip ng pagpili ng Network tab, maaari mong piliin ang tab na Mga Elemento ng. At kung nag-load ang isang web page, makikita mo ang tunay na makita ang mga HTML na lumilikha na web page. At upang maaari mong malaman ng maraming tungkol sa HTML sa pamamagitan ng pagtingin sa iyong mga paboritong website at makita kung paano sila ay bumuo ng iba't-ibang mga piraso ng mga ito na gusto mo. Kaya marahil may ito cool pattern o isang bagay tulad na. Paano nila gawin ito sa HTML? Well maaari mo lamang buksan ang iyong developer mga kasangkapan at mag-hover sa mga sangkap na at makita kung ano mismo ang gumagawa ng mga ito HTML. Kaya na ang isang tunay na mahusay na paraan upang malaman ang HTML, at ako Matindi ang pinapayo na gawin mo ang parehong mga ito upang malaman ang HTML at din upang malaman ang kaunti kaunti tungkol sa ilan sa mga opsyon magagamit mo sa mga tool ng developer, na kung saan ay tiyak na darating sa madaling bilang magsisimula ka sa paggawa ng mas intensive web programming. 

Kaya sabihin kumuha ng isang pagtingin sa isang pares ng mga karaniwang mga tag na HTML. At kami na tumalon at tingnan ang kung ano ang mga tag na ito ay magkakaroon din ng render tulad ng sa pamamagitan ng pagtingin sa ilang mga file sa aking IDE. Kaya narito ang tatlong tunay pangunahing mga tag para sa ng pagsasaayos ng mga visual na hitsura ng text. May B tags, I tag, at U tag. At ayon sa pagkakabanggit ano ang ginagawa nila ay render ang teksto sa pagitan ng mga ito na naka-bold, italics, at salungguhit. Kaya sabihin makita kung ano na ang magiging hitsura tulad ng sa isang aktwal na web page sa aking IDE. 

Kaya dito sa aking IDE mayroon akong isang file na tinatawag na biu dot HTML. Lamang pagiging biu dot HTML bold, italics, salungguhit. Kukunin ko buksan ito. 

At kami na makita na ako dito Mayroon text na ito ay naka-bold tag B. Ang tekstong ito ay kong tag italic. At ang text na ito ay nakasalungguhit U tag. Ano itong nangyayari sa hitsura? Well muli, mayroon ako ng lahat gawin ay pumunta sa paglipas dito sa aking browser, ang aking mga file browser, i-click ang Preview, at ito ay kung ano ang dumating up. 

Ang teksto sa pagitan ng B tags ay sa katunayan ng bold ngayon. Ang teksto sa pagitan ng ko tags ay sa katunayan italic ngayon. At ang teksto sa pagitan ng U tags ay sa katunayan ngayon salungguhit. Kaya na medyo magandang. Alam na namin ngayon kung paano gumawa ng text tumingin ng kaunti pa-iisip o gumuhit ng diin sa mga tiyak na mga bagay. Ang isa pang pares ng mga karaniwang mga tag dito ay tag talata, P, at header tag, na kung saan ko na nai-render dito bilang HX. 

Ang mga P tag, ang mga tag ng talata, masira ang iyong teksto ng hanggang sa mga talata. Ito ay hindi sapat upang lamang pindutin ang Enter at mag-iwan ang mga puwang, dahil ang isang computer ay lamang ang pagpunta upang gawin kung ano sabihin mo ito gawin at ito pinapansin puti puwang para sa pinaka-bahagi. Kaya maaari naming hindi lamang pindutin ang Enter at inaasahan ang aming mga computer upang bigyang-kahulugan na gusto naming upang simulan ang isang bagong talata. Mayroon kaming na masyadong malinaw na sinasabi na ito ay isa paragraph-- ito ay another-- sa pamamagitan ng nasasakupang bawat isa sa isang set ng mga P tag. 

At mayroon din namin ang mga pagpipiliang ito para sa H tag, mga header tag. Mayroon kaming anim na iba't ibang mga antas ng mga header, isa, dalawa, tatlo, apat, lima, at anim na, na kung saan ay progressively mas malaki at mas malaki header. At sila makakuha ng mas maliit at mas maliit at mas maliit at mas maliit. Kaya kami ay may isang top header antas, ang pangalawang level header, at iba pa, at iba pa. 

Tingnan natin ang isang pagtingin sa marahil ilang P tag at ang ilang mga header tag sa pagkilos sa isang web page. Kaya dito sa aking IDE Mayroon akong isang file na tinatawag na PH dot HTML, PH pagiging talata at header tag. Buksan na up. Mayroong maraming nagaganap dito dahil inilagay ko ang ilang lorem ipsum, ilan lang random text in dito. Kaya ko na mag-zoom out nang kaunti dahil mayroong kaya magkano ang pagpunta sa. Ngunit mapansin na mayroon akong sa pinakadulo itaas dito Mayroon akong isang H1, isang antas ng isa, header tag. Pagkatapos Mayroon akong isang talata, kung saan ay lamang ng grupo ng mga random text-- lorem ipsum-- default lang standard pagpuno sa text. Kaya ako ay may dalawang mga talata sa loob ng na antas ng isa header at pagkatapos ay down sa ibaba ko magkaroon ng isang antas ng dalawang header dito sa 24 na linya, isang pangalawang antas header, at isa pang dalawang talata. Well kung ano ang ibig hitsura kung ang mga ito sa aking preview? Tingnan natin. 

Kaya mapapansin na ang unang header antas dito ay talagang lubos isang bit mas malaki kaysa sa ikalawang header level. Kaya ginamit namin ang H1 tag. At mapansin na ang P tag-daan sa amin na masira ang mga bagay out sa mga talata. Kung nakuha namin ay alisan ng mga P tag at talagang lamang ilagay pumapasok o Ibinabalik sa pagitan ng kung ano ang aming inaasahan ay maging ang iba't-ibang mga talata, ang mga ito ay ang lahat ng slam lang na magkasama at ito ay hindi na ito magandang talata paghihiwalay sa espasyo sa itaas at sa ibaba. At kaya na kung ano ang talata tags at header tag ay karaniwang ginagamit upang gawin upang gumuhit pansin sa mga bahagi ng aming pahina ng web sa paraang iyon. 

Next up ang ilang mga tag na ginagamit namin upang bumuo ng mga listahan sa aming web page. Kaya kami unordered lists-- ULs-- na lamang bullet na listahan, iniutos list na numbered-- OLs-- at sa loob ng alinman sa isa sa mga kailangan naming magkaroon ng set ng kung paano upang ipahiwatig item sa listahan, li. At kaya kami ay may open ul tag at ilalagay namin ang mga bagay sa loob ng mga ito. At pagkatapos ay kapag tapos na kami sa na, maaari naming isara ang ul tag. 

At katulad maaari kaming magkaroon ng isang order o ng bilang na listahan at ilagay ang mga item sa listahan sa loob ng na. Kaya sabihin tumagal ng isang pagtingin sa isang pares ng mga listahan at kung ano ang gagawin nila render na rin sa CS50 IDE. Kaya ko dito sa aking IDE isang file ng mga listahan na tinatawag na tuldok HTML. Tignan natin. 

At pansinin dito Mayroon akong isang unordered ilista sa limang bagay sa loob nito. At pagkatapos ay mayroon akong isang order listahan, at Binago ko na ang tag nang kaunti, right? Sinabi ko na start katumbas ng anim. Ito ay lumiliko out na may isang iniutos listahan ko maaaring i-set ang panimulang punto kung saan man Want-- ko sa pamamagitan ng default ito ay one-- sa pamamagitan ng pagdaragdag lamang ito sa tinatawag na attribute sa aking ol tag. At kaya ang listahan na ito ay simulan ang pagbibilang sa anim. Kaya ang mga elemento ng bilang na listahan dapat na anim, pitong, walong, siyam, sampu, dahil may mga limang mga sangkap sa listahan, bilang laban sa isa, dalawa, tatlo, apat, lima, na ay ang kaso kung ako ay sinabi ol nang hindi tinutukoy ang simula attribute. 

Kaya makikita lamang i-preview namin ito sa gayon maaari mong makakuha ng isang kahulugan para sa kung ano ang nangyayari sa dito. At doon kami pumunta. May ang aking listahan. Ang unang limang mga sangkap ay unordered o bullet na listahan. At sa susunod na limang mga sangkap ay isang hiwalay na order list simula sa anim. Kaya na kung paano namin magagawa bumuo ng mga listahan ng paggamit ng HTML. Isa pang bagay maaari ka gusto mong gawin sa HTML ay bumuo ng isang talaan ng mga impormasyon ng mga hanay at haligi upang ipakita ang impormasyon sa isang lalo na inayos paraan. Upang gawin ito na may HTML na maaari naming magkaroon ng isang table definition simula bukas bracket table. At pagkatapos ay sa loob ng talahanayan na tayo ay maaaring magkaroon ng isang hanay ng mga hilera, TR tags upang ipahiwatig ang bawat hilera. At pagkatapos td tags pumunta sa loob ng TR tags upang tukuyin ang isang hanay sa loob ng isang hilera. 

Bakit tinatawag na ito ay td at hindi TC? Well, td ibig sabihin para sa mga talahanayan ng data. Karaniwan ikaw ay paglagay ang iyong impormasyon doon. Kaya na ang dahilan kung bakit ito ay td at hindi TC. Ito ay isang maliit na bit nakalilito. 

Kaya ikaw ay may mga tag ng talahanayan at sa loob ng iyong mga tag ng talahanayan mayroon kang isang bilang ng mga hilera, TRs. At sa loob ng bawat hilera mayroon kang TDS para sa bilang ng mga haligi na nais mong magkaroon ng sa partikular na hanay. Tingnan natin ang isang pagtingin sa isang napaka simpleng mesa sa ibabaw sa CS50 IDE. 

Kaya ko dito ang isang file tinatawag talahanayan dot HTML. Mayroon ng isang pagtingin sa Ipaalam kung ano na kamukha. Mayroong maraming nagaganap dito ngunit kung napansin mo ako bukas sa isang table. Ako simula sa kahulugan na may table. At pagkatapos ay sa aking unang row ako sa malas Mayroon apat na mga haligi, isa, dalawa, tatlo, apat. At pagkatapos ay ako tapos sa hilerang iyon. 

Pagkatapos ko simulan ang isa pang hilera at gawin dalawa, apat, anim, walo. Tapos na hilera. Gawin ang isa pang hilera, tatlo, anim, siyam, 12. At pagkatapos ay isang huling hilera, apat, walo, 12, at kahit na ito ay isang maliit na cut-off dito, 16. 

Natapos ko na hilera. Natapos ko ang table. At pagkatapos ay ako na ginawa sa aking HTML. Ano ang nilalaman ng hitsura? Well, ito ay hindi tunay marami na makita. Malinaw ko na inayos ang aking impormasyon sa isang medyo mas maayos na paraan. Ngunit ito ay hindi sobrang pretty dito. At kami ay pagpunta sa pakikitungo sa na kapag ang usapan namin tungkol CSS. Susubukan naming muling bisitahin ito ideya ng ano ang ginagawa namin upang makagawa ng isang table-- siguro format na ito ng isang maliit na bit mas mahusay? Ngunit ko pa rin magkaroon ng apat na hanay, bawat isa ay may apat na haligi, at talagang kung ano ang halaga na ay isang napaka-simple apatan pagpaparami table. 

Lamang ng ilang higit pang mga tag namin makipag-usap tungkol sa. Makipag-usap tungkol sa mga Ipaalam konsepto ng isang HTML form. Kaya maaaring may nakita mo na ito sa konteksto ng pag-log sa isang web page. Karaniwan type ka sa iyong user name. Nag-type ka sa iyong password, at ikaw ay handa na upang patakbuhin. Iyon ay magiging simula ng isang form. 

Nilalaktawan paglipas div isang segundo. Kami rin ay may input na uri ng magkasya sa loob ng mga form. Ang mga ito ay ang mga elemento na tunay na ikaw ay pag-type sa, o ang mga pindutan ng radyo ikaw gris, o ang check kahon na kayo ay gris off. Kaya ang mga ito pumunta sa loob ng mga form. At bumubuo sila talaga ang bawat hilera ng form kung ang iyong mga form ay naka-format na rin. Pagkatapos ay may ito konsepto ng isang div, na kung saan ay hindi tunay magkasya sa anumang partikular na kategorya ng mga tag tulad ng mga na hindi ko na ay ginagawa na dati. Ito lamang ang uri ng demarkasyon sa simula ng ilang di-makatwirang division-- div-- ng pahina. Walang visual break. Walang linya. Hindi ito naka-set off bilang hiwalay na awtomatikong tipak. Gusto mo na estilo ito na paraan upang gawin iyon. 

Ito lamang ang uri ng sabi gusto ko ng piraso ng puwang sa aking web page, at ako lamang ang pagpunta sa tawag ito ang pagkakahati ng aking page. Maaari naming ilagay ang mga bagay-bagay sa loob ng divs, at sa katunayan, kapag tumuloy kami ng mahigit sa IDE sa isang segundo, bibigyan namin ng makita na ako ng paglalagay ng aking form sa loob ng isang div. 

Kaya ko dito sa aking IDE isang file na tinatawag na div anyo dot HTML. Buksan up natin ito. Pansinin na tulad ng sinabi ko, div ay uri ng di-makatwirang. Right? Hindi ito tunay na ibig sabihin ang anumang bagay. Kaya Mayroon akong isang arbitrary first division ng aking page. At pagkatapos ay sa halip ng isa pang div sa susunod, na nagsisimula sa walong linya, Mayroon akong na ito form. At sa loob ng form mayroon akong isang bilang ng mga input, mga patlang ng form. Kaya ako ay may isang patlang na ang pangalan ay A-- na kung saan ay hindi tunay na ibig sabihin ng kahit na ano karapatan now-- na tila tumatagal ng teksto, isa pa na tumatagal ng isang password, ang isa pang iyon ang isang Radio button, ang isa pang iyon ang isang check box, at isa pa na ang isang pindutan ng Isumite. Well, kung ano ang ibig lahat ng tunay na hitsura? Well, sabihin kumuha ng isang hitsura. Susubukan naming buksan ito sa aming window preview. Pansinin na ang arbitrary unang division-- mayroong walang visual paghihiwalay dito. Ito ay hindi tunay na gumawa ng kahit ano, tama? 

At pagkatapos ay ako ang aking form. At hindi ko gawin ang anumang espesyal na format. Kaya ang form ay isa lamang malaking hanay ng impormasyon. Kung naiiba ako ay na-format ang aking form, Maaari ba akong magkaroon ito line sa pamamagitan ng linya sa pamamagitan ng linya. Ngunit hindi ko gawin ang anumang estilo. Muli, hindi namin kausap tungkol sa CSS dito. Kami ay pakikipag-usap lamang tungkol sa HTML. 

Well sa aking form na teksto ang maaari kong type-- tandaan na ang mga anyo ng uri ng teksto kaya maaari ko bang ilagay ang aking pangalan. At sa aking password ko maaaring i-type ang aking password. At dahil ang patlang na ay uri ng password, Hindi mo alam kung ano ang aking password. Lahat ng ito ay mga tuldok. 

Maaari ko ring piliin na pagsabihan ng isang radio button o pagsabihan ng isang check box. O maaari ko isusumite ang aking form. At hindi ko gawin ang anumang bagay, kaya kapag isusumite ang aking form, mga pahina lamang nagre-refresh. Ngunit marahil ko maaaring i-configure ang aking Isumite ang pindutan upang gawin ang iba pa. At kami na makita kung ano ang maaari naming gawin sa na sa isang susunod na video sa PHP. Ngunit ito ay gagawa ng isang napaka simpleng form na kami ay maaaring gamitin upang magkaroon ng ugnayan ang mga user at isumite ang impormasyon sa aming website. 

Isang huling komento bago namin lumipat sa sa ilang iba pang mga tag Isasama na kumuha ng isang pagtingin sa ito input tag isa pang beses. Notice na ako naka-highlight mga dulo ng tag ng pula. Bawat iba pang mga tag na nakita namin sa ngayon ay ay nagkaroon ng isang simula at isang dulo, ang isang pambungad tag at isang closing tag. 

Ngunit isang input tag ay hindi. Walang teksto na napupunta sa pagitan ng input tag. Ang lahat ng impormasyon kami ay nagbabalak na magbigay-kahulugan ay iniugnay bilang bahagi ng katangian ng input na. Pansinin na namin name input ay katumbas ng x. Uri katumbas y. Iyan ay talagang ang lahat ng mga impormasyon na kailangan namin. 

Ito ay tinatawag na isang self closing tag. Ito ay hindi nangangailangan ng isang pambungad at isang malapit dahil ang lahat ng mga impormasyon ay nilalaman sa loob ng tag at mga katangian nito. Kaya kung minsan makikita mo na ito, masyadong. Kaya lamang magkaroon ng kamalayan na kung ikaw ay may isang na tag na ay ganap na self-contained, ito ay bubukas at magsasara ang sarili sa ang open angle bracket sa kaliwang at ang mga anggulo slash bracket sa kanan. Susubukan naming makita ang isa pang isa sa mga ngayon gamit ang mga tag ng imahe pati na rin. 

Bago namin makipag-usap tungkol sa mga imahe, kami kailangang makipag-usap tungkol sa mga hyperlink. Kung gusto namin ang aming mga web page upang maging interactive at ilipat sa amin sa paligid, magiging maganda ma mag-click sa isa sa mga kung ano ang karaniwang naging isang asul na link. Ito ay talagang kung paano namin bumuo ng isang hyperlink sa aming web page. At kawili-wili sapat may isa pang HTML tag tinatawag na link, na kung saan ay hindi isang hyperlink. A dito ay kumakatawan sa mga anchor, at na kung paano namin ipahiwatig ang isang hyperlink. 

Ay katumbas ng isang href x paraan pumunta sa X. web page At lahat ng bagay sa pagitan ng mga bukas na A tag at ang malapit na A tag ay kung ano ang nangyayari na na nakasalungguhit asul na text na ganito ang hitsura ng isang link na hindi namin alam. Nasa ibaba na kami ay may isang imahe na tag, na kung saan Magsasara na ang isang self tag para sa pagpapakita ng isang imahe na matatagpuan sa X. At maaaring ikaw ay maaaring baguhin na imahe sa pamamagitan ng pagtukoy lapad at taas at iba pang mga katangian sa na tuldok tuldok tuldok doon. 

Sa ibaba very dito kami ay may isang napaka-interesante naghahanap tag na hindi magkaroon ng isang closing tag. Ito ay exclamation point doctype HTML. Kaya HTML ay dahil sa paligid ng unang bahagi ng 1990 para sa pagbuo ng mga web page, at ito ay nawala undergone ng ilang mga pagbabago mula noon. Karamihan sa kamakailan lamang sa 2014 ito ay sumailalim sa isang rebisyon tinatawag na HTML5 na ngayon ang kasalukuyang uri ng talaga HTML standard. 

Upang ipahiwatig na ang aming web mga pahina ay nakasulat gamit HTML5, ito ay kung paano namin simulan off. Ito ay maaaring tinanggal na ngunit kung ano na talaga ibig sabihin nito ay hindi mo maaaring gamitin ang alinman sa mga tags na HTML5 tag, mga bagong tag. Kaya laging simulan namin off kung kami ay gumagamit ng HTML5. At ang lahat ng mga tag na usapan natin ang tungkol dati ay hindi HTML5 tag. Ngunit ito ay nagpapahiwatig na HTML5 tags ay kasalukuyan. At kaya kami ay may exclamation doctype HTML, na kung saan ay sa pinakadulo simula ng aming HTML file, at pagkatapos ay pagkatapos ng puntong iyon talaga kami bukas sa aming HTML tag at magpatuloy mula doon. 

Ang huling isa ay isang tag ng komento, na kamukha bahagyang naiiba, masyadong. Ito ay nagsisimula sa anggulo bracket exclamation dash dash ngunit walang closing bracket. Sa pagitan ng mga dalawang mga elemento doon ay kung saan mo isulat ang iyong mga komento. At tumagal ng isang pagtingin sa mga imahe ipaalam at ang mga komento at mga link sa CS50 IDE. 

Kaya ako dito ng isang file na tinatawag na link image dot HTML kung saan ako pupunta upang buksan up. At mapansin Mayroon akong isang pares ng mga comments dito sa aking mga komento HTML. Kaya lang tulad sa C at iba pang mga programming languages, HTML sa pamamagitan lamang ng pagiging isang markup language hindi na magkakaroon ng kakayahan upang magkaroon ng mga komento. At kaya tila ako pagpunta sa maglagay ng isang larawan ng Rick Astley saanman sa pagitan ng mga ito div tag, ito arbitrary division. Tila file na na matatagpuan sa Rick dot JPEG, na kung ulo namin pabalik sa paglipas ng sa aking file tree para sa isang segundo, ay isang file na umiiral sa kasalukuyang directory. Kaya na ang OK. Maaari ko bang isangguni ito. 

Pagkatapos ay maaari akong magkaroon ng panloob na mga link. Kaya mapapansin sa linya 11 dito aking href ay hello dot HTML. Kaya na lamang tumutukoy sa kumusta dot HTML na umiiral sa kasalukuyang direktoryo. At ako ay maaari ding magkaroon ng mga panlabas mga link sa pamamagitan lamang ng pagtukoy HTTPS upang ipahiwatig na hindi ko pakikipag-usap tungkol sa isang file sa aking kasalukuyang direktoryo. Pakikipag-usap ako tungkol sa isang file na umiiral isang lugar sa internet, kung saan mayroon akong upang humiling ng paggamit ng HTTP protocol. 

Kaya sabihin kumuha ng isang pagtingin sa kung ano Maaaring tumingin ang pahinang ito tulad ng at maghanda para sa isang larawan ng Rick Astley na magpapakita sa iyong screen. Kaya kailangan ko i-preview ito. May Rick Astley sa pinakatuktok sa arbitrary division ko bang ilagay ito sa itaas. At pagkatapos ay down sa ibaba ko ang aking mga link, di ba? 

Mayroon akong isang link sa hello dot HTML. At kung i-click ko na, nakukuha ko inilipat sa pahinang ito na kami masyadong pamilyar sa mula sa ang simula ng aming programa. Kung pop kong muli ang pahinang open na, kung ako ay pop link image buksan ang isa pang beses, Maaari ko ring pumunta sa labas sa website CS50. At may see-- namin idedetalye ko mag-zoom out nang kaunti here-- kami makita website uri ng CS50 naka-embed sa gitna ng aming mga pahina. Kaya ako ay maaaring gumawa ng isang panloob na link pati na rin ang isang panlabas na link. 

Ang huling rule na may HTML na kami ay pagpunta sa makipag-usap tungkol dito ay na ang iyong HTML ay dapat na maayos na binuo. Sa C usapan natin ng maraming tungkol sa ang iba't-ibang mga syntax ng mga bagay. Sa HTML syntax talagang umiikot na mga tag. Tuwing tag binuksan mo kailangang maging sarado. At sa katunayan, ang bawat tag na buksan mo dapat na sarado sa reverse order. 

Kaya kung nagbukas ka ng isang naka-bold tag, isang italic tag, at pagkatapos ay isang salungguhit tag na gawin ang lahat ng tatlong sa isang partikular na hanay ng teksto, dapat mong isara ang mga ito sa reverse order. Kaya't kung ikaw binuksan bold, italic, salungguhit, mo nais upang isara salungguhit, italic, bold. Ito ay uri ng encapsulation ay kung ano ang mapigil ang HTML maganda at organisadong. 

Hindi tulad ng C, bagaman, syntax error ay hindi talagang lumpo iyong HTML posibleng. Maaaring hindi na rin Ang iyong HTML binuo ngunit nais pa rin gumagana. At kaya ang mga error Maaaring ayusin ng slide sa pamamagitan ng. Ito ay nasa sa iyo na talagang maging mapagbantay. Minsan sila mabibigo ngunit paminsan-minsan maaari kang makakuha ng malayo sa mga ito. 

Maaari itong maging isang tunay na mahirap na gawain, bagaman, upang subaybayan kapag binuksan mo isang tag, kapag isinara mo ito, lalo na bilang iyong HTML file makakuha ng mas malaki at mas malaki. Makikita mo gusto ng ilang tulong. At may mga online tools validator na kayo ay maaaring gamitin upang magkaroon ng isang pagtingin sa iyong web pahina at makita kung ito ay mahusay na nabuo HTML. At dapat mo talaga tingnan ang mga at simulang gamitin ang mga ito bilang ka simulan ang paggawa ng ilang trabaho sa HTML, pagsulat ng HTML, kaya lang makakuha ka ang ilang mga magandang gawi tungkol aayos iyong HTML sa isang mabuting paraan at magandang style at siguraduhin na hindi ka gumagawa ng anumang bagay na maaaring lumikha ng isang syntax error na ay magdudulot ng isang piraso ng isang problema down ang kalye. 

Ako Doug Lloyd. Ito ay CS50.