DOUG LLOYD: Oleh itu, kita menghabiskan about-- jika matematik saya adalah betul, dan saya fikir mencari back-- saya fikir kita membelanjakan kira-kira 35 video bercakap tentang pelbagai aspek C, mungkin lebih sedikit, mungkin sedikit kurang. Dan kami tidak meliputi segala-galanya dalam C, tetapi kita meliputi sebahagian besar daripada bahasa, sebahagian besar daripadanya, pasti untuk kegunaan biasa. Sekarang kita akan bercakap tentang bahasa lain, HTML. Dan kita akan meliputi ia hanya dalam satu video. 

Tetapi itu akan menjadi OK. Yang akan benar-benar menjadi sesuatu yang anda akan membiasakan diri. Sekarang bahawa anda mempunyai asas-asas satu bahasa, ia sebenarnya agak mudah untuk mula belajar orang lain. Oleh itu, kita akan mula untuk melangkah belakang sedikit dan menyembunyikan asas perbezaan di antara bahasa-bahasa ini dan jenis meninggalkan anda kepadanya. Ada banyak benar-benar hebat sumber di internet, yang kita akan mula mengarahkan anda arah kerana internet adalah repositori maklumat yang luas. Dan supaya ia tidak seperti yang anda akan menjadi tewas semestinya dengan tidak mempunyai maklumat yang dibincangkan dalam video. Anda masih boleh mendapatkan semua yang anda perlukan dan penggunaan pengetahuan yang anda telah pun dibina dengan memahami C untuk membuat keluk pembelajaran untuk ini bahasa lain sebenarnya adalah lebih rata lot. Saya berjanji. 

Tetapi mari kita bercakap tentang satu bahasa itu benar-benar asas untuk setiap web halaman, iaitu HTML. HTML adalah Hyper Text Markup Language. HTML adalah bahasa yang tetapi ia adalah bukan bahasa pengaturcaraan. 

HTML tidak mempunyai pembolehubah. Ia tidak mempunyai logik atau fungsi atau apa-apa seperti itu. Kita tidak boleh berbuat apa-apa pengaturcaraan per se dalam HTML. Kadang-kadang anda akan mendengar orang menggambarkan diri mereka sebagai pengaturcara HTML, yang tidak sepenuhnya tepat. Kita tidak boleh menulis program HTML. 

HTML hanya digunakan untuk menandakan teks. Ia dipanggil bahasa markup. Dan apa ini does-- markup-- ini kita menggunakan tag HTML dan tags-- ini ini markup-- semantik mentakrifkan struktur halaman dan menyebabkan teks yang jelas bahawa wujud di antara tag untuk ditafsirkan oleh pelayar dalam cara yang berbeza. Dan mungkin ia adalah yang terbaik untuk menerangkan cara oleh ini ilustrasi. 

Berikut adalah halaman HTML sangat mudah, tidak program HTML, sekali lagi, dalam halaman HTML. Dan kita tahu ia adalah satu Halaman HTML kerana kami telah disempadani segala-galanya dengan tag HTML. Jadi ini adalah apa tag HTML kelihatan seperti. Ia antara kurungan sudut. Dan perhatikan di bahagian atas kita ada HTML dan di bahagian paling bawah, selepas kita telah melakukan apa yang nampaknya banyak HTML yang lain, kita ada kurung sudut slash HTML. Jadi yang jenis adalah sempadan antara apa yang HTML dan apa yang tidak. Dan sudah tentu, konvensional, hanya kerana anda telah menulis semua program C anda dengan sambungan titik C, semua fail HTML anda akan berakhir dengan sambungan HTML titik. Tetapi ada lagi berlaku di sini. Kami bukan sahaja mempunyai tag HTML. Kami nampaknya mempunyai ini Perkara yang dipanggil tag kepala. Nah, OK, apa itu? 

Well mungkin ia adalah yang terbaik untuk membezakan melalui sebuah badan, badan menjadi kandungan laman web. Jadi mungkin tag kepala mentakrifkan barangan yang bukan dalam tetingkap penyemak imbas yang betul, tetapi entah bagaimana penting untuk kami laman web yang diberikan dengan betul. Sebagai contoh, bahagian dalam tag kepala kita mempunyai tag tajuk. 

Jadi tajuk yang dunia hello, yang sebenarnya akan menjadi apa muncul dalam tab dalam Chrome atau dalam safari atau Firefox-- apa sahaja pelayar anda prefer-- itulah apa yang akan muncul dalam tajuk. Dan sebelum tab ia akan menunjukkan dalam tetingkap pelayar keseluruhan anda dan anda hanya boleh mempunyai satu halaman membuka dalam tetingkap penyemak imbas pada satu masa. Jadi yang akan menjadi yang tajuk halaman saya sehingga dalam tab atau bar tetingkap pelayar, hello dunia. Dan kemudian kandungan saya Laman web akan menjadi dunia, hello. Oleh itu, mari kita lihat apa yang ada Perkara seperti ini mungkin kelihatan seperti. Ini adalah halaman HTML yang agak mudah. Jadi saya di sini dalam IDE CS50 saya dan Saya telah dizum dalam sedikit. Dan saya hanya akan membuka hello dot HTML dan menunjukkan kepada anda bahawa ini adalah cukup banyak kandungan halaman yang kita lihat sebelum ini. Mudah tag HTML, kepala saya, tag tajuk, badan, dan sebagainya. Saya telah dilekukan menjadi bersih. 

Dan kemudian apa yang boleh saya lakukan pada saya IDE hanya pratonton halaman. Dan kita pergi. Kandungan halaman saya adalah dunia, hello, dan saya tidak melihat apa-apa dari tag kepala di sana. Ia hanya kandungan badan. Dunia, hello. Dan sekali lagi tubuh, berkata, dunia, hello. Bahagian lain yang hilang. 

Jadi, itu benar-benar semua itu. Ini adalah asas halaman HTML sangat mudah. Sekarang saya telah dilekukan HTML saya untuk menjadi benar-benar baik dan teratur, tetapi saya tidak benar-benar perlu. Saya boleh membuat ia kelihatan agak hodoh. Dan ini masih akan bekerja. Ini akan menjadi laman web yang sama yang tepat. Saya baru sahaja mendapat menghapuskan semua ruang putih. 

Ternyata, ruang putih adalah data. Dan setelah kami menghantar data dari Pengguna kepada penerima, dari pelayan kepada pelanggan, data kos wang. Dan supaya menghapuskan ruang kosong sebenarnya adalah idea yang baik jika anda seseorang yang berkhidmat sehingga banyak kandungan web. Ia adalah idea yang buruk jika anda seseorang yang yang belajar barangan ini dan anda mahu mempunyai ia baik yang dianjurkan. Ini adalah lebih mudah untuk menghuraikan daripada ini. Tetapi ia adalah fungsi yang serupa. 

Lekukan dan barangan seperti itu sebenarnya tidak kira dalam HTML. Apa yang penting ialah tag membuka dan menutup tag dalam susunan yang betul. Perhatikan apa yang berlaku di sini, walaupun. Markup ini memberikan kita satu cara untuk menyampaikan maklumat tambahan tentang apa yang kita tulis. Bahagian Hello, Dunia adalah ditafsirkan sebagai tajuk. Dan dunia ini, hello bahagian adalah ditafsirkan sebagai kandungan atau apa yang sepatutnya menjadi boleh dilihat di laman web saya. 

Terdapat lebih daripada 100 ini yang berbeza tag dan banyak sumber yang besar dalam talian untuk mencari mereka. Kita akan bercakap tentang beberapa daripada mereka dalam video ini, beberapa barangan yang benar-benar asas. Tetapi kita tidak akan bercakap tentang itu semua kerana ia akan menjadi menyeluruh untuk berbuat demikian. 

Satu lagi perkara yang anda boleh lakukan, walaupun, adalah membuka alat pemaju. Dan jika anda ingat dari video kami pada HTTP, Saya menjelaskan bagaimana untuk membuka sehingga alat pemaju. Dalam Chrome ia biasanya utama F12 untuk membuka bar alat pemaju. Ketika itu dan bukannya memilih Rangkaian tab, anda boleh memilih tab Elemen ini. Dan jika anda memuatkan web yang halaman, anda akan benar-benar melihat HTML yang mencipta laman web itu. Dan supaya anda boleh belajar banyak perkara mengenai HTML dengan melihat laman web kegemaran anda dan melihat bagaimana mereka membina pelbagai potongan daripada mereka yang anda suka. Jadi mungkin ada sejuk corak atau sesuatu seperti itu. Bagaimana mereka membuat ia dengan HTML? Baik anda hanya boleh membuka pemaju anda alat dan berlegar lebih elemen yang dan melihat dengan jelas apa HTML menjadikannya. Jadi itulah yang benar-benar cara yang baik untuk belajar HTML, dan saya amat menggalakkan anda melakukannya kedua-dua untuk belajar HTML dan juga untuk belajar sedikit sedikit mengenai beberapa pilihan disediakan untuk anda dalam alat pemaju, yang pasti akan sangat berguna sebagai anda mula melakukan web yang lebih intensif pengaturcaraan. 

Jadi mari kita lihat pada beberapa tag HTML biasa. Dan kita akan melompat dan kita lihat pada apa tag ini juga akan menyebabkan kerana dengan melihat beberapa fail dalam IDE saya. Jadi di sini adalah tiga tag yang sangat asas untuk Tweaker penampilan visual teks. Ada tag B, saya tag, dan tag U. Dan masing-masing apa yang mereka lakukan adalah menyebabkan teks di antara mereka yang berani, italik dan garis bawah. Jadi mari kita lihat apa yang akan kelihatan seperti pada laman web sebenar dalam IDE saya. 

Jadi di sini dalam IDE saya, saya mempunyai fail dipanggil BIU dot HTML. BIU dot HTML hanya menjadi tebal, italik, menekankan. Saya akan membukanya. 

Dan kita akan melihat bahawa di sini Saya mempunyai teks ini adalah tag B berani. Teks ini adalah tag saya italik. Dan teks ini adalah tag U bergaris bawah. Apakah ini akan kelihatan seperti? Baik lagi, semua saya mempunyai lakukan adalah pergi ke sini untuk pelayar saya, pelayar fail saya, klik Preview, dan ini adalah apa yang datang. 

Teks dalam antara B tag memang sekarang berani. Teks dalam antara I tag memang sekarang italik. Dan teks di antara U tag memang sekarang bergaris bawah. Jadi, itu cukup baik. Kini kita tahu bagaimana untuk membuat teks kelihatan mewah yang lebih sedikit atau menarik perhatian kepada perkara-perkara tertentu. Satu lagi beberapa tag biasa di sini adalah tag perenggan, tag P, dan header, yang saya telah dicatatkan di sini sebagai HX. 

Tag P, tag perenggan, memecahkan teks anda ke dalam perenggan. Ia tidak cukup untuk hanya tekan Enter dan meninggalkan ruang, kerana komputer hanya akan untuk melakukan apa yang anda beritahu kepada melakukan dan ia mengabaikan putih ruang untuk sebahagian besar. Oleh itu, kita tidak boleh hanya melanda Masukkan dan mengharapkan komputer kita mentafsirkan bahawa kita mahu untuk memulakan perenggan baru. Kita perlu mengatakan sangat jelas ini adalah salah paragraph-- ini adalah another-- dengan melampirkan setiap satu dalam satu set P tag. 

Dan kami juga mempunyai pilihan ini untuk tag H, tag header. Kami mempunyai enam tahap yang berbeza pengepala, satu, dua, tiga, empat, lima dan enam, yang semakin besar dan lebih besar tajuk. Dan mereka mendapatkan lebih kecil dan yang lebih kecil dan lebih kecil dan lebih kecil. Jadi kita mempunyai tandukan peringkat tertinggi, yang kedua header peringkat, dan sebagainya, dan sebagainya. 

Mari kita lihat mungkin beberapa Tag P dan beberapa tag header dalam tindakan pada laman web. Jadi di sini dalam IDE saya Saya mempunyai fail yang dipanggil PH dot HTML, PH menjadi perenggan dan tag header. Buka bahawa sehingga. Ada banyak berlaku di sini kerana saya telah meletakkan beberapa lorem Mayon, beberapa teks hanya rawak di sini. Jadi saya akan zum keluar sedikit kerana terdapat begitu banyak berlaku. Tetapi notis bahawa saya mempunyai sekurang- atas di sini saya mempunyai H1, tahap satu, tag header. Kemudian saya mempunyai perenggan, yang hanya sekumpulan text-- lorem rawak ipsum-- hanya lalai pengisian standard dalam teks. Jadi saya mempunyai dua perenggan di dalam yang tahap satu header dan kemudian turun di bawah saya mempunyai tajuk tahap dua di sini pada baris 24, tandukan tahap kedua, dan dua lagi perenggan. Nah apakah ini kelihatan seperti jika saya melihatnya dalam pratonton saya? Mari kita lihat. 

Jadi notis bahawa header tahap pertama di sini sebenarnya agak sedikit lebih besar daripada tajuk tahap kedua. Oleh itu, kita digunakan tag H1. Dan perhatikan bahawa tag P membolehkan kita untuk memecahkan perkara-perkara ke dalam perenggan. Jika kita telah mendapat menghapuskan tag tersebut P dan benar-benar hanya meletakkan Masuk atau Pulangan di antara apa yang kita berharap akan menjadi perenggan yang berbeza, mereka akan semua hanya slam bersama-sama dan ia tidak akan mempunyai perenggan ini bagus pemisahan dengan ruang atas dan bawah. Dan sebagainya itulah yang perenggan tag dan tag header biasanya digunakan untuk melakukan untuk menarik perhatian ke bahagian atas laman web kami dengan cara itu. 

Sehingga datang adalah beberapa tag yang kita gunakan untuk membina senarai di laman web kami. Jadi kita mempunyai tidak tertib lists-- ULs-- yang hanya senarai berbulet, mengarahkan senarai yang numbered-- OLs-- dan di dalam mana-mana satu salah seorang daripada mereka, kita perlu mempunyai set bagaimana untuk menunjukkan item senarai, LI. Dan dengan itu kita telah buka UL tag dan kami meletakkan barang-barang di dalamnya. Dan kemudian apabila kita sudah selesai dengan itu, kita boleh menutup tag UL. 

Begitu juga kita boleh mempunyai senarai tertib tidak terbilang dan meletakkan barang-barang di dalam senarai itu. Jadi mari kita lihat di beberapa senarai dan apa yang mereka akan membuat sebagai pada CS50 IDE. Oleh itu, saya ada di dalam IDE saya yang fail dipanggil senarai dot HTML. Mari kita lihat. 

Dan notis di sini saya mempunyai tidak tertib senarai dengan lima perkara di dalamnya. Dan kemudian saya mempunyai senarai yang diperintahkan, dan Saya telah mengubah tag yang sedikit, bukan? Saya telah berkata permulaan sama dengan enam. Ternyata dengan senarai mengarahkan saya boleh menetapkan titik permulaan di mana sahaja Saya want-- secara lalai ia akan menjadi one-- dengan hanya menambah apa yang dipanggil sifat tag OL saya. Dan supaya senarai ini akan mula mengira pada enam. Oleh itu, unsur-unsur yang senarai bernombor harus enam, tujuh, lapan, sembilan, sepuluh, kerana terdapat lima elemen dalam senarai, yang bertentangan dengan satu, dua, tiga, empat, lima, yang akan berlaku jika saya katakan OL tanpa menyatakan sifat permulaan. 

Oleh itu, kita hanya akan pratonton ini supaya anda boleh mendapatkan rasa untuk apa yang berlaku di sini. Dan kita pergi. Ada senarai saya. Yang pertama lima elemen senarai tidak tertib atau berbulet. Dan lima elemen yang akan datang adalah senarai mengarahkan berasingan bermula dari enam. Jadi itulah bagaimana kita boleh membina senarai menggunakan HTML. Satu lagi perkara yang anda mungkin mahu lakukan dengan HTML adalah membina jadual maklumat baris dan lajur untuk membentangkan maklumat dalam terutamanya yang dianjurkan cara. Untuk melakukan ini dengan HTML kita boleh mempunyai definisi meja bermula kurungan terbuka meja. Dan kemudian di dalam jadual yang kita mungkin mempunyai satu set baris, tag TR untuk menunjukkan setiap baris. Dan kemudian tag TD masuk ke dalam tag TR untuk menentukan lajur dalam berturut-turut. 

Mengapa ia dipanggil TD dan tidak TC? Nah, TD bermaksud data jadual. Biasanya anda meletakkan maklumat anda di sana. Jadi itulah sebabnya ia TD dan tidak TC. Ia adalah sedikit mengelirukan. 

Jadi, anda perlu tag meja dan dalam tag meja anda anda mempunyai beberapa baris, TRs. Dan di dalam setiap baris anda mempunyai TDS untuk bilangan lajur yang anda mahu mempunyai berturut-turut tersebut. Mari kita lihat pada yang sangat jadual yang mudah alih pada CS50 IDE. 

Oleh itu, saya ada di fail dipanggil jadual dot HTML. Mari kita lihat pada apa yang kelihatan seperti. Ada banyak berlaku di sini tetapi jika anda mendapati saya mempunyai jadual terbuka. Saya mula definisi dengan meja. Kemudian berturut-turut pertama saya saya nampaknya mempunyai empat tiang, satu, dua, tiga, empat. Dan kemudian saya selesai dengan baris tersebut. 

Kemudian saya mula baris lain dan melakukan dua, empat, enam, lapan. Menyelesaikan baris tersebut. Adakah baris lain, tiga, enam, sembilan, 12. Kemudian berturut-turut lepas, empat, lapan, 12, dan walaupun ia sedikit memotong sini, 16. 

Saya selesai baris tersebut. Saya selesai meja. Dan kemudian saya selesai dengan HTML saya. Apakah ini kelihatan seperti? Nah, ia tidak benar-benar banyak untuk dilihat. Saya telah jelas dianjurkan maklumat saya dengan cara yang agak lebih teratur. Tetapi ia bukan super cantik di sini. Dan kita akan berurusan dengan bahawa apabila kita bercakap mengenai CSS. Kami akan mengkaji semula idea ini apa yang kita lakukan untuk membuat table-- yang mungkin memformat ia sedikit lebih baik? Tetapi saya masih mempunyai empat baris, setiap yang mempunyai empat tiang, dan benar-benar apa jumlah ini adalah sangat mudah empat oleh empat pendaraban meja. 

Hanya beberapa tag kita akan bercakap tentang. Mari kita bercakap tentang konsep bentuk HTML. Jadi, anda mungkin telah melihat ini dalam konteks log masuk ke dalam laman web. Biasanya anda menaip nama pengguna anda. Anda menaip kata laluan anda, dan anda baik untuk pergi. Yang akan menjadi permulaan borang. 

Lompat atas div saat. Kami juga mempunyai input yang jenis dimuatkan di dalam bentuk. Ini adalah unsur-unsur yang anda sebenarnya menaip ke dalam, atau butang radio anda berdetik, atau cek kotak yang anda berdetik di luar. Jadi ini masuk ke dalam bentuk. Mereka terdiri daripada dasarnya setiap baris dalam bentuk jika borang anda diformat juga. Kemudian ada konsep div, yang tidak benar-benar dimuatkan di dalam mana-mana kategori tertentu tag seperti yang saya telah telah lakukan sebelum ini. Ia hanya jenis demarcates yang bermula beberapa division-- sewenang-wenangnya div-- halaman. Tidak ada rehat dengar. Tidak ada garis. Ia tidak ditolak sebagai sebahagian berasingan secara automatik. Anda harus gaya ia cara itu untuk berbuat demikian. 

Ia hanya jenis kata saya mahu bahagian ruang di laman web saya, dan saya hanya akan memanggil ia bahagian ini laman saya. Kita boleh meletakkan barangan di dalam daripada divs, dan sebenarnya, apabila kita menuju ke IDE dalam kedua, kita akan melihat bahawa saya meletakkan saya terbentuk di dalam div a. 

Oleh itu, saya ada di dalam IDE saya yang fail dipanggil div bentuk dot HTML. Mari kita membukanya. Perhatikan bahawa seperti saya katakan, div adalah jenis sewenang-wenangnya. Betul? Ia tidak benar-benar bermakna apa-apa. Jadi saya mempunyai yang sewenang-wenangnya Bahagian pertama dari laman saya. Dan ketika itu dan bukannya div lain di kemudian hari, bermula pada baris lapan, Saya mempunyai borang ini. Dan di dalam borang yang saya mempunyai beberapa input, medan borang. Jadi saya mempunyai medan yang namanya A-- yang tidak benar-benar bermakna apa-apa sekarang-- hak yang nampaknya mengambil teks, dan perasaan yang terdapat mengambil kata laluan, satu lagi itu adalah satu Radio butang, satu lagi itu adalah satu kotak semak, dan satu lagi itu adalah satu butang Submit. Nah, apakah ini semua sebenarnya kelihatan seperti? Nah, mari kita lihat. Kami akan membukanya dalam tetingkap pratonton kami. Perhatikan bahawa ini sewenang-wenangnya pertama division-- ada ada pemisahan visual di sini. Ia tidak benar-benar berbuat apa-apa, kan? 

Dan kemudian saya mempunyai bentuk saya. Dan saya tidak melakukan apa-apa pemformatan khas. Jadi bentuk itu hanyalah satu berturut-turut besar maklumat. Jika saya telah diformat borang saya berbeza, Saya mungkin mempunyai ia baris demi baris demi baris. Tetapi saya tidak melakukan apa-apa gaya. Sekali lagi, kita tidak bercakap mengenai CSS di sini. Kami hanya bercakap mengenai HTML. 

Baik dalam bentuk teks, saya boleh type-- ingat bahawa bentuk jenis teks jadi saya boleh meletakkan nama saya. Dan dalam kata laluan kepada saya Saya boleh menaip kata laluan saya. Dan kerana bidang itu adalah kata laluan jenis, anda tidak tahu apa kata laluan saya. Itu semua titik. 

Saya juga boleh memilih untuk menandakan satu butang radio atau menandakan kotak semak. Atau saya boleh hantar borang saya. Dan saya tidak berbuat apa-apa, jadi apabila saya menghantar borang saya, halaman yang hanya menyegarkan. Tetapi saya mungkin boleh mengkonfigurasi saya Klik butang untuk melakukan sesuatu yang lain. Dan kita akan lihat apa yang boleh kita lakukan dengan bahawa dalam video masa depan dalam PHP. Tetapi ini membina yang sangat bentuk mudah yang kita boleh gunakan untuk mempunyai pengguna berinteraksi dan menyerahkan maklumat kepada laman web kami. 

Satu komen terakhir sebelum kita bergerak ke beberapa tag lain adalah untuk mengambil lihat ini tag input sekali lagi. Notis bahawa saya telah menekankan hujung tag merah. Setiap tag lain yang kita lihat setakat ini mempunyai mempunyai permulaan dan akhir, pembukaan tag dan tag penutup. 

Tetapi tag input tidak. Tiada teks yang masuk di antara tag input. Semua maklumat yang kami berhasrat untuk menyampaikan melekat sebagai sebahagian daripada sifat-sifat input itu. Perhatikan kita mempunyai nama input sama x. Jenis sama dengan y. Itu benar-benar semua Maklumat yang kami perlukan. 

Ini dipanggil tag penutup diri. Ia tidak memerlukan pembukaan dan rapat kerana semua maklumat yang terkandung di dalam tag dan sifat-sifatnya. Jadi kadang-kadang anda akan melihat ini juga. Jadi anda perlu ingat bahawa jika anda mempunyai tag yang sepenuhnya serba lengkap, ia membuka dan menutup dirinya dengan kurungan sudut terbuka di sebelah kiri dan sudut slash kurungan di sebelah kanan. Kami akan melihat satu lagi salah seorang daripada mereka sekarang atau klik gambar juga. 

Sebelum kita bercakap mengenai imej, kami perlu bercakap tentang hiperpautan. Jika kita mahu laman web kami untuk menjadi interaktif dan menggerakkan kita di sekeliling, ia akan lebih baik dapat klik pada salah satu daripada apa yang biasanya menjadi pautan biru. Ini sebenarnya adalah bagaimana kita membina hyperlink di laman web kami. Dan yang menariknya terdapat satu lagi tag HTML dipanggil pautan, yang tidak hyperlink. A di sini bermaksud utama, dan itulah bagaimana kita menunjukkan hyperlink. 

Href A sama x cara pergi ke web page X. Dan segala-galanya antara terbuka tag A Dan akhir tag A adalah apa yang akan menjadi yang digariskan teks biru yang kelihatan seperti pautan yang kita sudah biasa dengan. Di bawah bahawa kita mempunyai tag imej, yang adalah diri yang menutup tag untuk memaparkan imej yang terletak di X. Dan anda mungkin dapat mengubah imej yang dengan menentukan lebar dan tinggi dan sifat-sifat lain dalam yang dot dot dot sana. 

Di bahagian paling bawah di sini kita mempunyai sangat menarik mencari tag yang tidak mempunyai tag penutup. Ia seru titik DOCTYPE HTML. Jadi HTML telah wujud sejak awal 1990-an untuk membina laman web, dan ia pergi menjalani beberapa semakan sejak itu. Baru-baru ini pada tahun 2014 ia menjalani semakan dipanggil HTML5 yang kini semasa semacam de facto standard HTML. 

Untuk menunjukkan bahawa kita halaman yang bertulis menggunakan HTML5, ini adalah bagaimana kita mulakan. Ia boleh ditinggalkan tetapi apa yang pada dasarnya cara adalah anda tidak boleh menggunakan mana-mana tag yang tag HTML5, tag tersebut baru. Oleh itu, kita sentiasa bermula jika kita menggunakan HTML5. Dan semua tanda kita telah bercakap tentang sebelum ini tidak tag HTML5. Tetapi ini akan menunjukkan bahawa Tag HTML5 akan hadir. Dan dengan itu kita mempunyai tanda seru DOCTYPE HTML, yang pada awal-awal kami Fail HTML, dan kemudian selepas titik itu kita sebenarnya mempunyai HTML kami terbuka tag dan teruskan dari sana. 

Yang terakhir adalah tag komen, yang kelihatan sedikit berbeza, juga. Ia bermula dengan sudut kurungan seru dash dash tetapi tiada kurungan penutup. Di antara kedua-dua elemen terdapat adalah di mana anda menulis komen anda. Dan mari kita lihat pada imej dan komen dan pautan dalam CS50 IDE. 

Oleh itu, saya ada di pautan imej fail yang dipanggil dot HTML yang saya akan membuka. Dan notis saya telah mendapat beberapa Komen di sini dalam komen HTML saya. Jadi hanya seperti dalam C dan lain-lain bahasa pengaturcaraan, HTML hanya dengan menjadi bahasa penanda tidak mempunyai keupayaan untuk mempunyai komen. Dan supaya saya nampaknya akan meletakkan gambar Rick Astley suatu tempat antara div ini tag, bahagian sewenang-wenangnya ini. Rupa-rupanya fail yang terletak di Rick dot JPEG, yang jika kita pulang ke pokok fail saya yang kedua, Fail yang wujud di direktori semasa. Jadi, itu OK. Saya boleh rujukan. 

Saya juga boleh memiliki pautan dalaman. Jadi notis di talian 11 di sini href saya ialah hello dot HTML. Supaya, sama merujuk kepada hello dot HTML yang wujud dalam direktori semasa. Dan saya juga boleh mempunyai luaran pautan dengan hanya menyatakan HTTPS untuk menunjukkan bahawa saya tidak bercakap mengenai fail dalam direktori semasa saya. Saya bercakap tentang fail yang wujud di suatu tempat di internet, yang aku untuk meminta menggunakan protokol HTTP. 

Jadi mari kita lihat apa yang Laman ini mungkin kelihatan seperti dan bersedia untuk gambar Rick Astley untuk muncul di skrin anda. Jadi saya akan pratonton ini. Ada Rick Astley di paling atas dalam ini sewenang-wenangnya Bahagian saya meletakkannya di bahagian atas. Dan kemudian turun di bawah saya mempunyai hubungan saya, bukan? 

Saya mempunyai pautan ke hello dot HTML. Dan jika saya klik itu, saya mendapat berpindah ke laman ini bahawa kami sangat biasa dengan dari awal-awal program kami. Jika saya pop bahawa laman terbuka lagi, jika saya pautan imej pop membuka sekali lagi, Saya juga boleh pergi secara luaran ke laman web CS50. Dan kita see-- saya akan zum keluar sedikit sini-- kita akan melihat laman web jenis CS50 ini tertanam di tengah-tengah halaman kami. Jadi saya dapat membuat dalaman menghubungkan dan juga pautan luar. 

Peraturan lalu dengan HTML yang kita akan bercakap tentang di sini ialah HTML anda perlu juga terbentuk. Dalam C kita bercakap banyak tentang pelbagai sintaks perkara. Dalam HTML sintaks yang benar-benar berkisar tag. Setiap tag anda membuka perlu ditutup. Dan sebenarnya, setiap tag anda membuka perlu ditutup secara terbalik. 

Jadi, jika anda membuka tag tebal, italik yang tag, dan kemudian tag garis bawah untuk melakukan ketiga-tiga kepada set tertentu teks, anda perlu menutup mereka dalam susunan terbalik. Jadi, jika anda membuka berani, italik, garis bawah, anda mahu menutup garis bawah, italik, berani. Ini jenis pengkapsulan adalah apa yang menyimpan HTML baik dan teratur. 

Tidak seperti C, walaupun, ralat sintaks tidak akan sebenarnya melumpuhkan HTML anda mungkin. HTML anda mungkin sebagai tidak terbentuk tetapi masih akan bekerja. Dan supaya kesilapan-kesilapan ini boleh menyusun slaid oleh. Ia terpulang kepada anda untuk benar-benar berhati-hati. Kadang-kadang mereka akan gagal tetapi kadang-kadang anda boleh pergi dengan ia. 

Ia boleh menjadi satu benar-benar tugas yang sukar, walaupun, untuk mengesan apabila anda membuka tag, apabila anda ditutup, terutama kerana HTML anda fail menjadi lebih besar dan lebih besar. Anda akan mahu bantuan. Dan ada yang online alat validator anda boleh gunakan untuk kita lihat web anda halaman dan lihat jika ia cukup HTML terbentuk. Dan anda perlu pasti kita lihat pada mereka dan mula menggunakan mereka seperti yang anda mula melakukan kerja-kerja dengan HTML, menulis HTML, supaya anda mendapat beberapa tabiat yang baik tentang menganjurkan HTML anda dengan cara yang baik dan gaya yang baik dan memastikan bahawa anda tidak melakukan apa-apa yang boleh mewujudkan ralat sintaks yang akan menyebabkan anda sedikit masalah di jalan. 

Saya Doug Lloyd. Ini adalah CS50.