>> SPEAKER: Ternyata HTML tidak satu-satunya bahasa yang dapat Anda gunakan dalam
dari suatu halaman web.
Anda dapat menggunakan sesuatu yang disebut CSS, atau Cascading Style Sheets, juga.
CSS memungkinkan Anda untuk menentukan lebih tepatnya estetika web
halaman, termasuk tata letak dan ukuran dan warna dan font dan banyak lagi.
Sebagai contoh, mari kita membuat halaman web di sini disebut CSS0 yang mewakili
halaman rumah untuk, katakanlah, John Harvard.
>> Pada halaman ini, kita akan memiliki John Harvard nama, di bawah yang akan
pesan yang bagus bagi pengunjung nya, di bawah yang akan menjadi footer, dengan
mengatakan, beberapa informasi hak cipta.
Untuk melakukan hal ini, mari kita definisikan tiga divisi untuk halaman menggunakan tag
disebut div.
Buka braket div, John Harvard, dekat braket div, lain braket div terbuka,
dan sekarang kita akan menentukan sesuatu seperti, selamat datang di halaman rumah saya!
Dan mari kita menutup div ini, juga.
>> Dan sekarang ketiga dan terakhir div, hak cipta.
Hanya untuk menjadi mewah, biarkan aku gunakan sekarang HTML entitas, simbol yang mewakili
karakter yang tidak bisa dinyatakan mengetik pada keyboard Anda.
Secara khusus, aku akan melakukan ampersand, pound, 169, titik koma.
Ternyata itu adalah kode angka untuk simbol hak cipta.
Kemudian mari kita tentukan John Harvard di sini di bagian bawah.
Mari kita menutup div dan menyimpan file.
>> Sekarang, apa tag div ini?
Tag div hanya mendefinisikan divisi halaman, yang pada dasarnya adalah
wilayah persegi panjang.
Jadi pada saat ini dalam waktu, saya memiliki tiga daerah persegi panjang, satu di atas
yang lain.
Jadi untuk saat ini, efeknya hampir sama meskipun aku punya tiga paragraf.
Tapi kita tidak akan melihat cukup banyak spasi di antara mereka.
>> Mari kita menyimpan file ini, mengubah nya perizinan, dan melihat untuk
saat di Chrome.
Chmod a + r CSS0.html.
Sekarang mari kita membuka Chrome dan kunjungan http://localhost.CSS0.html.
Memang, inilah halaman rumah John Harvard.
Mari kita sekarang menyesuaikan dgn mode sedikit lebih justru menggunakan beberapa CSS.
>> Kembali di gedit, mari kita pergi ke ini tag div pertama dan menambahkan gaya
atribut menentukan bahwa aku ingin ukuran font, katakanlah, 36 piksel, atau px.
Dan saya ingin berat font ini menjadi berani daripada default,
yang normal.
Untuk div kedua, mari kita tentukan atribut gaya lain yang memiliki
ukuran 24 pixel, sehingga sedikit lebih kecil.
Tutup kutipan setelah titik koma.
>> Terakhir, dalam div ketiga ini, mari kita lakukan gaya sama dengan ukuran kutipan, font, dan
katakanlah 12 piksel saat ini.
Tutup quote setelah titik koma.
Perhatikan bahwa aku tampaknya memiliki ditentukan sedikit stilisasi untuk
masing-masing tiga divs menggunakan, ternyata, CSS.
Bahkan, sintaks yang Anda lihat dalam antara tanda kutip ganda adalah CSS,
khusus CSS properti dengan nilai-nilai.
Dan untuk itu tag pertama, di mana saya memiliki dua sifat tersebut, ukuran font dan
Berat font, saya hanya dipisahkan dengan titik koma.
>> Sekarang, hanya demi gaya, aku titik koma juga termasuk di
akhir setiap baris.
Tapi mereka tidak benar-benar diperlukan, terutama ketika Anda hanya memiliki satu
properti yang didefinisikan.
Sekarang mari kita menyimpan file dan kembali di Chrome, dan melihat apa
efek bersih adalah.
Kembali pada Chrome di sini, mari kita klik Reload.
>> Sekarang kita memiliki sedikit lebih menarik halaman rumah untuk John
Harvard, dimana baris pertama dengan namanya, yang ada di dalam itu
div pertama, adalah 36 piksel tinggi dan juga tebal, dimana baris kedua,
yang dalam div kedua, adalah 24 piksel tinggi, tapi tidak tebal.
Dan dimana baris ketiga dalam ketiga yang div adalah 12 piksel tinggi dan juga
tidak tebal.
Tapi misalkan sekarang saya ingin bergeser semua teks ini lebih
seperti bahwa itu berpusat.
>> Aku bisa menyelaraskan masing-masing individu divs sebagai yang berpusat.
Tapi yang lebih mudah, bisa saya membungkus mereka tiga divs dalam div keempat,
orangtua div, sehingga untuk berbicara, dan menentukan bahwa div dan semua nya
keturunan harus teks selaras center?
Mari kita lihat.
>> Di dalam gedit, mari kita kembali ke saya tubuh dan menambahkan div top up baru dengan
div, gaya sama dengan kutipan tanda kutip pusat teks menyelaraskan, dekat
penawaran setelah titik koma.
Dan sekarang, mari kita pergi ke depan dan indent semua dari garis yang kita ketik sebelumnya.
Dan di bawah div ketiga, mari kita menutup div baru ini.
>> Dengan kata lain, karena ketiga divs asli sekarang anak-anak, sehingga untuk
berbicara, dari orang tua div baru dan saya sudah ditentukan bahwa saya ingin menyelaraskan
teks yang div induk di tengah halaman, properti yang akan
diwarisi oleh semua anak-anak.
Memang, mari kita menyimpan file dan kita lihat di browser.
Mari kita ulang di Chrome.
Dan ada yang kita miliki, bahkan lebih bagus halaman rumah untuk John Harvard.