DAVEN Farnham: Šodien, es esmu gatavojas runāt mazliet par HTML, Hiperteksta iezīmēšanas valoda. Redzat HTML visur šajās dienās. Patiesībā, ja jūs skatītos šo video pārlūkprogrammā, jūs redzot HTML tieši tagad. HTML nav programmēšanas valoda, Drīzāk, tas ir iezīmēšanas valoda, ko izmanto interneta pārlūkiem, lai padarītu lapas internetā. 

Tātad, jūs varētu jautāt, kā tieši ir rakstiski mājas lapa HTML dažādās no rakstīšanas programmu plānošanas valodas, piemēram, C? Nu, C ir valoda ar ļoti stingriem sintakses noteikumi, kas vajadzīga, lai būtu apkopoti pirms tā var darboties. Ja esat kādreiz aizmirst iekļaut semikols beigās apgalvojumu savu C kodu, jūs zināt, ko es runāju par to, kas attiecībā uz stingri sintaksi. 

Interneta pārlūkprogrammas, lai gan, ir nedaudz vairāk piedošanu, kad runa ir par HTML. Pat ja jūsu HTML nav sintaktiski pareizi, jūsu lapā joprojām var būt parādīts ar pārlūku, bet tas varētu neizskatās, kā paredzēts. Tātad, tas vienmēr ir labākais, lai ievēro noteikumus. Labākais veids, kā iegūt intuīcija par to, kā lietas darbu ir iet caur piemēru. 

Tātad, ko mēs esam šeit ir pamata projektu par mājas lapā. Jūs droši vien ievērojuši, daudz lietas starp leņķveida iekavās. Nu, tie ir tikai tagus. Tags būtībā informēt interneta pārlūkiem ka, hey, kaut nāk savu ceļu. Atcerieties, lai gan, kad jūs atverat tag, jums ir nepieciešams, lai novērstu to, kad esat darīts, izmantojot to. 

Tā, piemēram, I atvērt sekciju Koda ar atvērtu kronšteins ķermenis, tuvu kronšteins. Tad es pievienot tekstu, šajā gadījumā, my Pirmā mājas lapa, tad, kad es devos uz slēgt šo sadaļu, es izmantoju gandrīz identiski tag izņemot šajā laikā ar slīpsvītra pirms organismā. Kopumā, tas ir formāts tu esi gatavojas izmantot ikreiz, kad atverat un noslēguma tagus. Kopā, atvērtu tagu un beigu tagu sacerēt ko sauc elements. 

Ja paskatās pirmajā rindā, jūs redzat izsaukuma zīmi, kam seko DOCTYPE html. Tas ir patiešām vienkārši stāsta savu pārlūkprogrammu ka fails ir mājas lapa rakstīts HTML. HTML tag būtībā saka, Šeit nāk daži HTML. Tad mums ir galvas tagu ar nosaukums tag tā iekšpusē. Galva tag jūs varat iedomāties, kā ietver HTML kods, kas nāk par lielākā daļa no jūsu mājas lapā ir faktiskais saturs. 

Vispār, jūs nodot nosaukumu jūsu mājas lapā šeit, lai gan ir daži citi tagus, kas var parādīties arī šeit. Tālāk seko jūsu mājas lapa ķermenis, faktiskais gaļa un kauli jūsu mājas lapā. Mūsu Piemēram, mēs esam tikai izvirzīti vienkārši teikumu, Mans pirmais adrese, kas, ja mēs palaist mūsu vietni, meklēs mazliet kaut kas līdzīgs šim. Mūsu mājas lapa ir ne pārāk savādi, bet neuztraucieties. Mēs egles to uz augšu ātrāk. 

Tāpēc iepriekš HTML, mēs jums ļoti Pamata šablons mājas lapā, nekas fancy, tikai tukša kauli. Bet, ja es esmu veidojot mājas lapā, Ko darīt, ja es gribu, lai pievienotu attēlu, teiksim, sevi? Nu, es varu darīt. Ir vairāki veidi, kā pievienot attēlus, lai jūsu vietnē. Ja attēls ir vienā mapē jūsu HTML failu, jūs varat saistīt ar attēlu pa ceļu, kā šis. 

Jūs atvērt ar attēla tagu seko ar Alt atribūtu avots attēla. ALT atribūta vērtība ir tikai daži alternatīvo tekstu, ja lietotājs nevar skatīt attēlu. Varat arī saistīt ar attēlus, izmantojot pilnu URL, piemēram, šo. Tagad, ka mājas lapā nav īsti nepastāv, bet, ja tur bija bilde man šajā adresē, es varētu izmantot avota URL iekļaut tās tēls manā mājas lapā. Nu tā, jūs galu galā ar daudz glītāka mājas lapā, kaut kas līdzīgs šim. 

Nu, tas ir diezgan foršs, bet es veida un vēlaties kādu tekstu šeit, kā labi. Tāpēc pieņemsim tikai piebilst super vienkārši iepriekš attēlu, piemēram, galvenes. Viss, ko es esmu darījusi līdz šim, ir izmantot galveni tag, H1, un līnijas pārtraukumu tag, br. Header tag padara Fonts nedaudz nedaudz lielāks un pamanāmāks. Line break tag, no otras puses No otras puses, ir veida atdzist. Atšķirībā no vairuma citu tagus, jums nav atvēršana un aizvēršana pauze tag, vienkārši viena parādīts iepriekš. Tas ir tāpēc, ka pārtraukums nav satura un tādēļ, tukša elements. 

Tukšas elementi, piemēram, tas, jūs varat atvērt un gandrīz vienlaicīgi vienkārši ieskaitot slīpsvītra pie beigas sākotnējā deklarācijā. Tātad tagad manā mājas lapā izskatās nedaudz kaut kas līdzīgs šim. Labāk, bet tas veida jūtas kā strupceļā. Tur ir nekur citur iet malā No šīs galvenajā lapā. Nu, pieņemsim noteikt, ka, ieskaitot saiti. 

Ko es esmu gatavojas darīt, šeit ir izmantot atribūtika apzīmē ar A un padarīt attēlu saiti uz, teiksim, CS50 TV. Tādā veidā, kad kāds noklikšķina uz mani, viņu pārlūkprogramma tiks novirzīti citu, iespējams, vairāk noderīgi, web lapas. Man bija, lai samazinātu izmēru teksta mazliet, jo mūsu mājas lapā ir kļūst vairāk uzlabotas. Bet, cerams, tas joprojām ir skaidrs. Mana mājas lapa izskatās tieši tāds pats tikai Tagad, kad es noklikšķiniet uz attēla, mana pārlūkprogramma atvērs vēl vienu tab par CS50.tv mājas lapā. 

Visbeidzot, pieņemsim, ka es esmu gatavojas stilu šajā mājas lapā vēlāk, izmantojot CSS. CSS ir tas, kas ir pazīstams kā kaskādes stila lapas. Un tas būtībā sniedz efektīvu veids, rediģēt un stils līdzīgi bloki kodu. Es gribu, lai sāktu organizēt savu HTML vieglāk stils vēlāk. Lūk, es izveidot divas dažādas identifikatori, lai palīdzētu organizēt savu kodu. Esmu izmantojis ID atribūts iekšpusē nodaļa, vai div tag, un es esmu, ko izmanto Klases atribūts iekšpusē cits div tag. 

ID un klases atribūti strādā līdzīgi. Vienīgā atšķirība ir tā, jūs varat tikai viens elements, īpaša ID, bet jebkuru no vairākiem elementiem var dalīties klasi. Tā, piemēram, var izmantot klasi attēlu vairākas reizes, bet es nevaru izveidojiet citu sadalījumu ar ID augšpusē. Lai gan es neesmu gājusi uz CSS, citā valodā, ko parasti izmanto kopā ar HTML, kad es sāku stils mans kods ar CSS, es varu izmantot šos organizatoriskās atribūti ietekmēt mana web lapas estētika. 

Viss ietvaros rajons augšu būs līdzīgas stylings vai jebkura otra grupa HTML I grupas uz klases attēla dalīsies līdzīgu izskatu. Tas ir daudz vieglāk, nekā mēģināt rediģēt un stila attēlus vai bloki individuāli tekstu. 

Tātad, mēs devāmies pār pamatus par to, kā padarīt mājas lapu ar HTML. HTML ir ķekars citas funkcijas too ka tad, kad pārī ar citām valodām piemēram, CSS un JavaScript, tiešām var padarīt lapas izceļas. Labākais veids, kā iegūt apmierināti ar HTML ir tikai putru apmēram ar to, redzēt, kas darbojas un kas ne. 

Mans vārds ir Daven Farnham. Tas ir CS50. 

Tā, piemēram, var izmantot klase image - Nē, tur ir tik daudz īpašības. Mans vārds ir Daven Farnham. Tas ir CS 650. Es gribu teikt CSS. Tas ir CSS.