>> Doug LLOYD: Jadi kami menghabiskan about-- jika matematika saya benar,
dan saya pikir mencari back-- saya pikir kami menghabiskan sekitar 35 video berbicara
tentang berbagai aspek C, mungkin sedikit lebih, mungkin sedikit kurang.
Dan kami tidak menutupi segala sesuatu di C, tapi kami
menutupi sebagian besar dari bahasa, sebagian besar itu,
tentu untuk keperluan umum.
Sekarang kita akan berbicara tentang bahasa lain, HTML.
Dan kita akan menutupi itu hanya dalam satu video.
>> Tapi itu akan menjadi OK.
Itu akan benar-benar menjadi sesuatu yang Anda akan terbiasa.
Sekarang bahwa Anda memiliki dasar-dasar satu bahasa,
itu sebenarnya cukup mudah untuk mulai belajar lain.
Jadi kita akan mulai untuk melangkah sedikit kembali
dan mengabaikan dasar perbedaan antara bahasa-bahasa ini
dan semacam meninggalkan Anda untuk itu.
Ada banyak benar-benar hebat sumber di internet, yang
kita akan mulai mengarahkan Anda terhadap karena internet adalah
repositori besar informasi.
Dan tidak seperti Anda akan menjadi kalah tentu
dengan tidak memiliki informasi tercakup dalam video.
Anda masih akan bisa mendapatkan semua yang anda butuhkan dan penggunaan
pengetahuan Anda sudah sudah dibangun dengan memahami C
membuat kurva belajar untuk ini bahasa lain sebenarnya datar banyak.
Saya berjanji.
>> Tapi mari kita bicara tentang salah satu bahasa itu benar-benar mendasar untuk setiap web
Halaman, yang merupakan HTML.
HTML adalah Hyper Text Markup Language.
HTML adalah bahasa tetapi bukan bahasa pemrograman.
>> HTML tidak memiliki variabel.
Itu tidak memiliki logika atau fungsi atau sesuatu seperti itu.
Kita tidak bisa melakukan apapun pemrograman per se dalam HTML.
Kadang-kadang Anda akan mendengar orang menggambarkan diri mereka
sebagai programmer HTML, yang tidak sepenuhnya akurat.
Kita tidak bisa menulis program HTML.
>> HTML hanya digunakan untuk menandai teks.
Ini disebut bahasa markup.
Dan apa ini does-- markup-- ini kita menggunakan tag dalam HTML dan tags-- ini
ini markup-- semantik mendefinisikan struktur halaman
dan menyebabkan teks biasa yang ada antara tag harus ditafsirkan
oleh browser dengan cara yang berbeda.
Dan mungkin itu yang terbaik untuk menjelaskan ini cara oleh sebuah ilustrasi.
>> Berikut adalah halaman HTML yang sangat sederhana, tidak program HTML, lagi, halaman HTML.
Dan kita tahu itu adalah Halaman HTML karena kita sudah
dibatasi segala sesuatu dengan tag HTML.
Jadi ini adalah apa tag HTML terlihat seperti.
Ini antara kurung sudut.
Dan melihat di atas kita memiliki HTML dan di bagian paling bawah,
setelah kami sudah melakukan apa yang ternyata banyak HTML lainnya,
kami memiliki sudut braket slash HTML.
Jadi semacam adalah batas antara apa yang HTML dan apa yang tidak.
Dan tentu saja, konvensional, hanya Anda menulis semua program C Anda
dengan ekstensi dot C, semua file HTML Anda
akan berakhir dengan ekstensi HTML dot.
Tapi ada yang lebih terjadi di sini.
Kami tidak hanya memiliki tag HTML.
Kami tampaknya memiliki ini hal yang disebut tag kepala.
Nah, OK, apa itu?
>> Yah mungkin yang terbaik untuk membedakan dengan cara tubuh,
tubuh menjadi isi dari halaman web.
Jadi mungkin tag kepala mendefinisikan hal-hal yang tidak di jendela browser yang tepat,
tapi entah bagaimana penting untuk kami Halaman web yang diberikan dengan benar.
Misalnya, bagian dalam tag kepala kita memiliki tag judul.
>> Jadi judul menjadi dunia halo, yang benar-benar akan menjadi apa
muncul di tab di Chrome atau dalam safari atau Firefox--
Browser apa pun yang Anda prefer-- itu apa yang akan muncul dalam judul.
Dan sebelum tab itu akan menunjukkan di seluruh jendela browser Anda
dan Anda hanya dapat memiliki satu halaman terbuka di jendela browser pada suatu waktu.
Sehingga akan menjadi judul halaman saya di tab
atau jendela browser bar, halo dunia.
Dan kemudian isi saya Halaman web akan dunia, halo.
Jadi mari kita lihat apa yang beberapa Hal seperti ini mungkin terlihat seperti.
Ini adalah halaman HTML cukup sederhana.
Jadi saya di sini di IDE CS50 saya dan Aku sudah diperbesar sedikit.
Dan aku hanya akan membuka halo dot HTML
dan menunjukkan kepada Anda bahwa ini cukup banyak konten halaman yang kita lihat sebelumnya.
Saya tag HTML, kepala sederhana, tag judul, tubuh, dan sebagainya.
Aku sudah menjorok menjadi bersih.
>> Dan kemudian apa yang bisa saya lakukan di saya IDE hanya melihat halaman.
Dan di sana kita pergi.
Isi dari halaman saya adalah dunia, halo, dan saya tidak melihat apa-apa
di dari tag kepala ada.
Hanya saja isi dari tubuh.
Dunia, halo.
Dan lagi tubuh hanya kata, dunia, halo.
Bagian lain yang hilang.
>> Jadi itu benar-benar semua itu.
Ini adalah halaman HTML dasar yang sangat sederhana.
Sekarang saya sudah menjorok HTML saya untuk benar-benar bagus dan terorganisir,
tapi saya tidak benar-benar harus.
Aku bisa membuatnya terlihat sangat jelek.
Dan ini masih akan bekerja.
Ini akan menjadi halaman web yang sama persis.
Saya baru saja sudah menyingkirkan semua ruang putih.
>> Ternyata, ruang putih adalah data.
Dan ketika kita mengirim data dari pengirim ke penerima, dari server
ke klien, data biaya uang.
Dan menyingkirkan spasi sebenarnya ide yang baik
jika Anda seseorang yang berfungsi up banyak konten web.
Ini adalah ide yang buruk jika Anda seseorang yang yang belajar hal ini
dan Anda ingin memiliki itu terorganisir dengan baik.
Ini jauh lebih mudah untuk mengurai dari ini.
Tapi itu fungsional identik.
>> Lekukan dan hal-hal seperti itu tidak benar-benar peduli di HTML.
Yang penting adalah membuka tag dan menutup tag dalam urutan yang benar.
Perhatikan apa yang terjadi di sini, meskipun.
Markup memberi kita cara untuk mengkomunikasikan informasi tambahan
tentang apa yang telah kita tulis.
Bagian Hello, World adalah ditafsirkan sebagai judul.
Dan dunia, halo bagian itu diartikan sebagai konten
atau apa yang harus terlihat pada halaman web saya.
>> Ada lebih dari 100 ini berbeda tag dan banyak sumber daya yang besar
online untuk menemukan mereka.
Kita akan berbicara tentang beberapa dari mereka dalam video ini, beberapa
dari hal-hal yang benar-benar mendasar.
Tapi kita tidak akan bicara tentang itu semua karena
akan lengkap untuk melakukannya.
>> Hal lain yang dapat Anda lakukan, meskipun, adalah membuka alat pengembang.
Dan jika Anda ingat dari video kami pada HTTP,
Saya menjelaskan bagaimana membuka up alat pengembang.
Di Chrome biasanya tombol F12 untuk membuka toolbar pengembang.
Kemudian bukannya memilih Jaringan tab, Anda dapat memilih tab Elemen.
Dan jika Anda memuat web Halaman, Anda akan benar-benar
melihat HTML yang menciptakan halaman web.
Dan sehingga Anda dapat belajar banyak tentang HTML dengan melihat situs Web favorit Anda
dan melihat bagaimana mereka membangun berbagai potongan dari mereka yang Anda sukai.
Jadi mungkin ada keren ini pola atau sesuatu seperti itu.
Bagaimana mereka membuatnya dengan HTML?
Nah Anda bisa membuka pengembang Anda alat dan hover atas elemen yang
dan melihat apa HTML membuatnya.
Jadi itu benar-benar cara yang baik untuk belajar HTML,
dan saya sangat menyarankan bahwa Anda melakukannya berdua untuk belajar HTML
dan juga untuk belajar sedikit sedikit tentang beberapa pilihan
tersedia untuk Anda di alat pengembang, yang
tentu akan berguna sebagai Anda mulai melakukan web lebih intensif
pemrograman.
>> Jadi mari kita lihat sebuah beberapa tag HTML umum.
Dan kami akan melompat dan lihatlah apa tag ini juga akan membuat
sebagai dengan melihat beberapa file dalam IDE saya.
Jadi di sini adalah tiga tag yang sangat dasar untuk tweaker tampilan visual teks.
Ada tag B, saya tag, dan tag U.
Dan masing-masing apa yang mereka lakukan adalah membuat teks di antara mereka dalam huruf tebal,
miring, dan garis bawah.
Jadi mari kita lihat apa yang akan terlihat seperti pada halaman web yang sebenarnya dalam IDE saya.
>> Jadi di sini di IDE saya memiliki file bernama Biu dot HTML.
Biu dot HTML hanya menjadi tebal, miring, garis bawah.
Aku akan membukanya.
>> Dan kita akan melihat bahwa di sini saya memiliki teks ini adalah tag B tebal.
Teks ini adalah tag saya miring.
Dan teks ini adalah tag U digarisbawahi.
Apa ini akan terlihat seperti?
Nah lagi, semua saya lakukan adalah pergi ke sini
untuk browser saya, file browser saya, klik Preview, dan ini adalah apa yang muncul.
>> Teks dalam antara B tag memang sekarang berani.
Teks dalam antara aku dengan tag memang sekarang miring.
Dan teks dalam antara U tag memang sekarang digarisbawahi.
Jadi itu cukup bagus.
Kita sekarang tahu bagaimana membuat teks terlihat lebih mewah sedikit
atau menggambar penekanan untuk hal-hal tertentu.
Pasangan lain dari tag umum di sini adalah tag paragraf, tag P, dan header,
yang saya sudah diberikan di sini sebagai HX.
>> P tag, tag paragraf ini, memecah teks Anda menjadi paragraf.
Ini tidak cukup hanya tekan Enter dan meninggalkan ruang,
karena komputer hanya akan melakukan apa yang Anda katakan untuk melakukan
dan mengabaikan putih ruang untuk sebagian besar.
Jadi kita tidak bisa hanya tekan Enter dan mengharapkan komputer kita
menafsirkan bahwa kita ingin untuk memulai sebuah paragraf baru.
Kita harus sangat eksplisit mengatakan ini adalah salah satu paragraph-- ini another--
dengan melampirkan masing-masing dalam satu set P tag.
>> Dan kami juga memiliki pilihan ini untuk tag H, tag header ini.
Kami memiliki enam tingkat yang berbeda header, satu, dua, tiga,
empat, lima, dan enam, yang semakin besar dan lebih besar
header.
Dan mereka mendapatkan lebih kecil dan lebih kecil dan lebih kecil dan lebih kecil.
Jadi kita memiliki header tingkat atas, kedua tingkat header, dan sebagainya, dan sebagainya.
>> Mari kita lihat mungkin beberapa P tag dan beberapa tag header
beraksi di halaman web.
Jadi di sini di IDE saya, saya memiliki sebuah file yang bernama PH dot HTML, PH menjadi paragraf
dan tag header.
Membuka bahwa sampai.
Ada banyak hal yang terjadi di sini karena saya sudah menaruh beberapa lorem
ipsum, beberapa teks hanya acak di sini.
Jadi saya akan zoom out sedikit karena ada begitu banyak terjadi.
Tapi perhatikan bahwa saya memiliki sangat Atas sini saya memiliki H1, tingkat satu,
header tag.
Kemudian saya memiliki paragraf, yang hanya sekelompok acak text-- lorem ipsum--
hanya default mengisi standar dalam teks.
Jadi saya memiliki dua paragraf dalam yang tingkat satu header dan kemudian turun di bawah ini saya
memiliki tingkat dua sundulan sini on line 24, header tingkat kedua, dan dua lain
paragraf.
Nah apa ini terlihat seperti jika saya melihatnya di pratinjau saya?
Mari kita lihat.
>> Jadi perhatikan bahwa pertama tingkat sundulan sini
sebenarnya cukup sedikit lebih besar dari header tingkat kedua.
Jadi kita menggunakan tag H1.
Dan melihat bahwa tag P memungkinkan kita untuk memecahkan hal-hal ke dalam paragraf.
Jika kita telah gotten menyingkirkan orang-orang P tag dan benar-benar hanya menempatkan Memasuki atau Pengembalian
di antara apa yang kita harapkan akan menjadi paragraf yang berbeda,
mereka akan semua hanya membanting bersama-sama dan itu tidak akan memiliki ayat ini bagus
pemisahan dengan ruang atas dan di bawah.
Dan itulah yang ayat tag dan tag header
biasanya digunakan untuk melakukan menggambar memperhatikan bagian-bagian dari halaman web kami
dengan cara itu.
>> Di samping beberapa tag yang kita gunakan untuk membangun daftar pada halaman web kami.
Jadi kita harus unordered lists-- ULs-- yang hanya
daftar bullet, memerintahkan daftar yang numbered--
OLs-- dan dalam baik salah satu dari mereka kita perlu memiliki
set bagaimana untuk menunjukkan daftar item, LI.
Dan jadi kita harus terbuka UL tag dan kami menaruh barang-barang di dalamnya.
Dan kemudian ketika kita sudah selesai dengan itu, kita dapat menutup tag UL.
>> Dan juga kita dapat memiliki daftar memerintahkan atau nomor
dan menempatkan daftar item di dalam itu.
Jadi mari kita lihat di beberapa daftar
dan apa yang mereka akan membuat seperti pada CS50 IDE.
Jadi saya miliki di sini di IDE saya sebuah file bernama daftar dot HTML.
Mari lihat.
>> Dan pemberitahuan di sini saya memiliki unordered daftar dengan lima hal di dalamnya.
Dan kemudian saya memiliki daftar memerintahkan, dan Aku sudah berubah tag sedikit,
benar?
Aku sudah mengatakan awal sama dengan enam.
Ternyata dengan daftar memerintahkan saya dapat mengatur titik awal di mana pun
Saya want-- secara default akan satu-- dengan hanya menambahkan apa yang disebut atribut ini
untuk tag OL saya.
Dan daftar ini akan mulai menghitung pada enam.
Jadi unsur-unsur yang daftar bernomor harus enam, tujuh, delapan, sembilan, sepuluh,
karena ada lima unsur dalam daftar, sebagai lawan satu,
dua, tiga, empat, lima, yang akan terjadi jika saya telah mengatakan OL
tanpa menentukan atribut start.
>> Jadi kita hanya akan melihat dulu ini sehingga Anda dapat mendapatkan rasa untuk apa yang terjadi di sini.
Dan di sana kita pergi.
Ada daftar saya.
Lima elemen pertama adalah unordered atau bullet.
Dan lima elemen berikutnya adalah daftar memerintahkan terpisah
mulai dari enam.
Jadi itulah bagaimana kita bisa membangun daftar menggunakan HTML.
Hal lain yang mungkin ingin lakukan dengan HTML
adalah membangun tabel informasi dari baris dan kolom
untuk menyajikan informasi dalam terutama terorganisir cara.
Untuk melakukan hal ini dengan HTML kita dapat memiliki tabel definisi awal braket terbuka
meja.
Dan kemudian di dalam tabel yang kita mungkin memiliki satu set baris, tag TR
untuk menunjukkan setiap baris.
Dan kemudian tag TD masuk ke dalam tag TR untuk menentukan kolom dalam baris.
>> Mengapa disebut TD dan tidak TC?
Nah, TD singkatan data tabel.
Biasanya Anda meletakkan informasi Anda di sana.
Jadi itu sebabnya itu TD dan tidak TC.
Ini sedikit membingungkan.
>> Jadi Anda memiliki tag meja dan dalam tag meja Anda
Anda memiliki jumlah baris, TRS.
Dan di dalam setiap baris Anda memiliki TDS untuk jumlah kolom
bahwa Anda ingin memiliki dalam baris tertentu.
Mari kita lihat sangat meja sederhana lebih dalam CS50 IDE.
>> Jadi saya miliki di sini file disebut meja dot HTML.
Mari kita lihat apa yang terlihat seperti.
Ada banyak hal yang terjadi di sini tapi jika Anda melihat saya memiliki meja terbuka.
Aku mulai definisi dengan meja.
Dan kemudian di baris pertama saya, saya rupanya memiliki empat kolom, satu, dua, tiga,
empat.
Dan kemudian aku sudah selesai dengan baris itu.
>> Lalu aku mulai baris lain dan melakukan dua, empat, enam, delapan.
Menyelesaikan baris itu.
Melakukan baris lain, tiga, enam, sembilan, 12.
Dan kemudian baris terakhir, empat, delapan, 12, dan meskipun itu
sedikit memotong di sini, 16.
>> Aku selesai baris itu.
Aku selesai meja.
Dan kemudian aku sudah selesai dengan HTML saya.
Apa yang terlihat seperti?
Yah, itu tidak benar-benar banyak untuk melihat.
Aku sudah jelas terorganisir informasi saya dengan cara yang agak lebih terorganisir.
Tapi itu bukan super cantik di sini.
Dan kita akan berurusan dengan bahwa ketika kita berbicara tentang CSS.
Kami akan kembali ide ini apa yang kita lakukan untuk membuat sebuah table--
mungkin format itu sedikit lebih baik?
Tapi aku masih punya empat baris, masing-masing memiliki empat kolom,
dan benar-benar apa yang jumlah ini adalah sangat sederhana empat oleh empat perkalian
meja.
>> Hanya beberapa tag yang lebih kita akan berbicara tentang.
Mari kita bicara tentang konsep bentuk HTML.
Jadi Anda mungkin telah melihat ini di konteks masuk ke halaman web.
Biasanya Anda ketik nama pengguna Anda.
Anda mengetikkan password Anda, dan Anda baik untuk pergi.
Itu akan menjadi awal dari formulir.
>> Melompati div kedua.
Kami juga memiliki input yang jenis muat dalam bentuk.
Ini adalah elemen yang Anda benar-benar mengetik ke dalam,
atau tombol radio Anda berdetak, atau cek
kotak bahwa Anda berdetak off.
Jadi ini masuk ke dalam bentuk.
Dan mereka terdiri dasarnya setiap baris dalam bentuk
jika formulir Anda diformat dengan baik.
Lalu ada konsep div, yang tidak benar-benar
muat dalam kategori tertentu tag seperti yang saya sudah
telah melakukan sebelumnya.
Ini hanya semacam demarcates mulai dari beberapa division-- sewenang-wenang
div-- halaman.
Tidak ada istirahat visual.
Tidak ada garis.
Itu tidak berangkat sebagai potongan terpisah secara otomatis.
Anda harus gaya itu cara untuk melakukan itu.
>> Ini hanya semacam bilang aku ingin sepotong ruang pada halaman web saya,
dan aku hanya akan menelepon itu divisi ini halaman saya.
Kita bisa meletakkan barang-barang di dalam divs, dan pada kenyataannya,
ketika kita kepala ke IDE dalam kedua, kita akan
melihat bahwa saya menempatkan saya terbentuk di dalam dari div.
>> Jadi saya miliki di sini di IDE saya sebuah file bernama div bentuk dot HTML.
Mari kita membukanya.
Perhatikan bahwa seperti saya katakan, div adalah jenis sewenang-wenang.
Benar?
Itu tidak benar-benar berarti apa-apa.
Jadi saya memiliki sewenang-wenang divisi pertama halaman saya.
Dan kemudian bukannya div lain nanti, mulai pada baris delapan,
Saya memiliki formulir ini.
Dan dalam bentuk saya memiliki jumlah input, bidang formulir.
Jadi saya memiliki lapangan yang namanya A-- yang tidak benar-benar berarti apa-apa
sekarang-- kanan yang tampaknya mengambil teks, satu lagi yang
mengambil password, yang lain itu adalah Radio tombol, yang lain itu adalah kotak centang,
dan lain itu adalah tombol Submit.
Nah, apa ini semua benar-benar terlihat seperti?
Nah, mari kita lihat.
Kami akan membukanya di jendela pratinjau kami.
Perhatikan bahwa ini sewenang-wenang pertama division-- ada
ada pemisahan visual yang di sini.
Itu tidak benar-benar melakukan apa-apa, kan?
>> Dan kemudian saya harus bentuk saya.
Dan saya tidak melakukan apapun format khusus.
Jadi bentuk adalah salah satu baris besar informasi.
Jika saya telah diformat formulir saya berbeda, Saya mungkin memilikinya baris demi baris demi baris.
Tapi aku tidak melakukan styling apapun.
Sekali lagi, kita tidak berbicara tentang CSS sini.
Kami hanya berbicara tentang HTML.
>> Nah dalam bentuk teks saya, saya bisa type-- ingat bahwa bentuk jenis teks
jadi saya bisa menaruh nama saya.
Dan password saya dapat mengetik password saya.
Dan karena bidang itu adalah tipe password,
Anda tidak tahu apa password saya.
Ini semua titik.
>> Saya juga bisa memilih untuk menandai sebuah tombol radio atau mencentang kotak centang.
Atau aku bisa mengirimkan formulir saya.
Dan aku tidak melakukan apa-apa, jadi ketika saya menyerahkan formulir saya,
Halaman hanya menyegarkan.
Tapi aku mungkin bisa mengkonfigurasi saya Tombol submit untuk melakukan sesuatu yang lain.
Dan kita akan melihat apa yang bisa kita lakukan dengan bahwa dalam video masa depan PHP.
Tapi ini membangun sangat bentuk sederhana yang kita
dapat digunakan untuk memiliki pengguna berinteraksi dan mengirimkan informasi ke website kami.
>> Satu komentar terakhir sebelum kita beralih ke beberapa tag lain
adalah untuk melihat ini tag masukan sekali lagi.
Perhatikan bahwa saya telah disorot ujung tag merah.
Setiap tag lain yang telah kita lihat sejauh ini memiliki awal dan akhir, pembukaan
tag dan tag penutup.
>> Tapi tag masukan tidak.
Tidak ada teks yang masuk di antara tag input.
Semua informasi kami berniat untuk menyampaikan
terikat sebagai bagian dari atribut input itu.
Perhatikan kita memiliki nama sama dengan masukan x.
Jenis sama y.
Itu benar-benar semua informasi yang kita butuhkan.
>> Ini disebut tag penutup diri.
Tidak memerlukan pembukaan dan dekat karena semua informasi
terkandung di dalam tag dan atributnya.
Jadi kadang-kadang Anda akan melihat ini, juga.
Jadi hanya akan menyadari bahwa jika Anda memiliki tag yang sepenuhnya mandiri,
membuka dan menutup sendiri dengan sudut braket terbuka di sebelah kiri
dan sudut miring braket di sebelah kanan.
Kita akan melihat salah satu dari mereka sekarang dengan tag gambar juga.
>> Sebelum kita berbicara tentang gambar, kami perlu bicara tentang hyperlink.
Jika kita ingin halaman web kami untuk menjadi interaktif dan menggerakkan kita sekitar,
akan menyenangkan dapat klik pada salah satu dari mereka
apa yang biasanya menjadi link biru.
Ini sebenarnya bagaimana kita membangun hyperlink di halaman web kami.
Dan cukup menarik ada tag HTML lain
disebut link, yang tidak hyperlink.
Sebuah sini adalah singkatan dari anchor, dan itulah bagaimana kita menunjukkan hyperlink.
>> Sebuah href sama x cara pergi ke Halaman web X. Dan semuanya
antara terbuka tag A dan dekat tag A
adalah apa yang akan menjadi yang digarisbawahi teks biru yang terlihat seperti link
bahwa kita akrab dengan.
Di bawah ini bahwa kita memiliki tag gambar, yang adalah diri menutup tag untuk menampilkan
gambar yang terletak di X. Dan Anda mungkin dapat mengubah
bahwa gambar dengan menentukan lebar dan tinggi
dan atribut lainnya di bahwa dot dot dot ada.
>> Di bagian paling bawah di sini kami memiliki sangat menarik
mencari tag yang tidak memiliki tag penutup.
Ini seru titik DOCTYPE HTML.
Jadi HTML telah ada sejak awal 1990-an untuk membangun halaman web,
dan itu hilang menjalani beberapa revisi sejak saat itu.
Baru-baru ini pada tahun 2014 itu mengalami revisi
disebut HTML5 yang sekarang saat ini semacam standar de facto HTML.
>> Untuk menunjukkan bahwa web kami halaman yang ditulis menggunakan HTML5,
ini adalah bagaimana kita memulai.
Hal ini dapat dihilangkan tetapi apa yang pada dasarnya
berarti adalah Anda tidak dapat menggunakan tag yang HTML5 tag, tag baru.
Jadi kita selalu memulai jika kita menggunakan HTML5.
Dan semua tag yang telah kita bicarakan sebelumnya tidak tag HTML5.
Tapi ini akan menunjukkan bahwa Tag HTML5 akan hadir.
Dan jadi kita harus seru DOCTYPE HTML, yang
adalah pada awal dari kami File HTML, dan kemudian setelah titik itu
kami benar-benar memiliki HTML kita terbuka tag dan melanjutkan dari sana.
>> Yang terakhir adalah tag komentar, yang terlihat sedikit berbeda, juga.
Ini dimulai dengan sudut braket seru dasbor
dasbor tetapi tidak ada braket penutupan.
Di antara dua elemen ada adalah di mana Anda menulis komentar.
Dan mari kita lihat gambar dan komentar dan link di CS50 IDE.
>> Jadi saya miliki di sini link file gambar disebut dot HTML yang aku akan membuka.
Dan pemberitahuan Aku punya beberapa komentar di sini dalam komentar HTML saya.
Jadi seperti di C dan lainnya bahasa pemrograman,
HTML hanya dengan menjadi bahasa markup tidak memiliki kemampuan untuk memiliki komentar.
Dan jadi saya tampaknya akan menempatkan gambar Rick Astley
suatu tempat antara div ini tag, divisi sewenang-wenang ini.
Ternyata file yang terletak di Rick dot JPEG, yang
jika kepala kita kembali ke pohon file saya untuk kedua,
adalah file yang ada di direktori saat ini.
Jadi itu OK.
Saya dapat referensi itu.
>> Lalu aku dapat memiliki link internal.
Jadi melihat pada baris 11 di sini href saya adalah halo dot HTML.
Sehingga hanya mengacu halo dot HTML yang ada di direktori saat ini.
Dan saya juga dapat memiliki eksternal link dengan hanya menetapkan HTTPS
untuk menunjukkan bahwa aku tidak berbicara tentang file dalam direktori saya saat ini.
Aku sedang berbicara tentang sebuah file yang ada di suatu tempat di internet, yang saya punya
untuk meminta menggunakan protokol HTTP.
>> Jadi mari kita lihat apa yang Halaman ini mungkin terlihat seperti
dan bersiap-siap untuk gambar Rick Astley muncul di layar Anda.
Jadi saya akan melihat dulu ini.
Ada Rick Astley di paling atas dalam hal ini sewenang-wenang
Divisi I meletakkannya di atas.
Dan kemudian turun di bawah ini saya memiliki link saya, kan?
>> Saya memiliki link ke halo dot HTML.
Dan jika saya klik itu, saya mendapatkan pindah ke halaman ini
bahwa kita sangat akrab dengan dari awal dari program kami.
Jika saya pop halaman yang terbuka lagi, jika saya image link pop membuka sekali lagi,
Saya juga bisa pergi eksternal ke website CS50 ini.
Dan di sana kita see-- aku akan tampilannya keluar sedikit di sini-
kita akan melihat CS50 situs semacam tertanam di tengah-tengah halaman.
Jadi aku bisa membuat internal menghubungkan serta link eksternal.
>> Aturan terakhir dengan HTML yang kita akan bicarakan di sini
adalah bahwa HTML Anda harus terbentuk dengan baik.
Dalam C kita berbicara banyak tentang berbagai sintaks hal.
Dalam HTML sintaks benar berkisar tag.
Setiap tag Anda membuka perlu ditutup.
Dan pada kenyataannya, setiap tag Anda membuka harus ditutup dalam urutan terbalik.
>> Jadi, jika Anda membuka tag bold, italic sebuah tag, dan kemudian tag garis bawah
untuk melakukan semua tiga untuk set tertentu dari teks,
Anda harus menutup mereka dalam urutan terbalik.
Jadi jika Anda membuka berani, italic, underline, Anda
ingin menutup garis bawah, miring, tebal.
Ini semacam enkapsulasi adalah apa membuat HTML bagus dan terorganisir.
>> Tidak seperti C, meskipun, kesalahan sintaks tidak akan sebenarnya melumpuhkan HTML Anda mungkin.
HTML Anda mungkin tidak baik terbentuk tetapi masih akan bekerja.
Dan kesalahan ini dapat mengurutkan slide oleh.
Terserah Anda untuk benar-benar waspada.
Kadang-kadang mereka akan gagal tetapi kadang-kadang Anda bisa lolos dengan itu.
>> Hal ini dapat benar-benar tugas yang sulit, meskipun,
untuk melacak ketika Anda membuka tag, ketika Anda menutupnya,
terutama karena HTML Anda file menjadi lebih besar dan lebih besar.
Anda akan ingin beberapa bantuan.
Dan ada secara online alat validator yang Anda
dapat digunakan untuk melihat di web Anda Halaman dan melihat apakah itu baik HTML terbentuk.
Dan Anda pasti harus lihatlah mereka
dan mulai menggunakannya sebagai Anda mulai melakukan beberapa pekerjaan dengan HTML,
menulis HTML, hanya sehingga Anda mendapatkan beberapa kebiasaan yang baik tentang pengorganisasian
HTML Anda dengan cara yang baik dan gaya yang baik dan memastikan
bahwa Anda tidak melakukan sesuatu yang bisa membuat kesalahan sintaks yang
akan menyebabkan Anda sedikit masalah di jalan.
>> Aku Doug Lloyd.
Ini adalah CS50.