1
00:00:00,000 --> 00:00:00,300

2
00:00:00,300 --> 00:00:04,840
>> SPEAKER: Jadi itu sebenarnya bukan yang terbaik
desain untuk berbaur CSS dengan HTML.

3
00:00:04,840 --> 00:00:08,700
Sebaliknya, yang terbaik untuk faktor luar Anda
CSS, menyimpannya di suatu tempat pusat, dan

4
00:00:08,700 --> 00:00:11,430
entah bagaimana menerapkannya pada
tag dalam halaman web Anda.

5
00:00:11,430 --> 00:00:15,290
Untuk mencapai hal ini, kita benar-benar dapat menghentikan
menggunakan Style atribut dan sebaliknya

6
00:00:15,290 --> 00:00:19,290
menggunakan tag Style, yang termasuk dalam
kepala halaman web bersama, untuk

7
00:00:19,290 --> 00:00:20,700
Misalnya, judul Anda.

8
00:00:20,700 --> 00:00:24,400
>> Mari kita memberikan ini mencoba dan menerapkan kembali
halaman rumah untuk John Harvard

9
00:00:24,400 --> 00:00:26,410
menggunakan tag Style.

10
00:00:26,410 --> 00:00:28,930
Aku sudah mendapat kita mulai
di sini dengan tiga divs untuk

11
00:00:28,930 --> 00:00:30,260
Homepage John Harvard.

12
00:00:30,260 --> 00:00:33,990
Tapi mari kita pertama sekarang naik ke pertama ini
div dan menambahkan atribut baru,

13
00:00:33,990 --> 00:00:38,680
yaitu ID, dan menentukan bahwa yang unik
pengidentifikasi untuk div tertentu

14
00:00:38,680 --> 00:00:42,390
harus, misalnya, kutipan tanda kutip
"Top", sebuah nama yang sewenang-wenang, tetapi

15
00:00:42,390 --> 00:00:45,840
deskriptif dalam div ini
memang di bagian atas halaman saya.

16
00:00:45,840 --> 00:00:48,920
>> Untuk div berikutnya, mari kita memberikan
ID yang berbeda dari kutipan tanda kutip

17
00:00:48,920 --> 00:00:54,080
"Menengah," dan mari kita memberikan div ketiga
ID kutipan tanda kutip "bawah." Kami

18
00:00:54,080 --> 00:00:57,740
sekarang memiliki tiga identifier unik
yang kita dapat menerapkan beberapa CSS

19
00:00:57,740 --> 00:01:01,210
properti, tapi pertama-tama, mari kita kembali
kepala halaman ini.

20
00:01:01,210 --> 00:01:04,760
Tepat di atas judul di sini, aku akan
pergi ke depan dan menentukan gaya

21
00:01:04,760 --> 00:01:07,120
dan kemudian gaya dekat.

22
00:01:07,120 --> 00:01:10,340
>> Di dalam hal ini sekarang, aku akan mendefinisikan
beberapa properti CSS, yaitu

23
00:01:10,340 --> 00:01:14,550
yang sama sebelumnya saya miliki di Gaya
atribut, tapi di sini mereka akan

24
00:01:14,550 --> 00:01:16,320
didefinisikan secara terpusat.

25
00:01:16,320 --> 00:01:20,880
Untuk melakukannya, saya akan menentukan pound
simbol diikuti oleh restoran, sehingga

26
00:01:20,880 --> 00:01:24,710
menentukan bahwa CSS berikut
properti harus berlaku untuk apa pun

27
00:01:24,710 --> 00:01:28,800
Elemen HTML memiliki unik
identifier dari atas.

28
00:01:28,800 --> 00:01:32,240
Saya kemudian akan memiliki beberapa terbuka dan
kurung kurawal tertutup, dan aku akan

29
00:01:32,240 --> 00:01:39,170
tentukan, misalnya, ukuran font harus 36
piksel, font weight harus berani.

30
00:01:39,170 --> 00:01:41,810
>> Untuk menjaga hal-hal yang bersih, aku menempatkan masing-masing
sifat ini sekarang sendiri

31
00:01:41,810 --> 00:01:44,610
line, tapi itu hanya
konvensi gaya.

32
00:01:44,610 --> 00:01:47,830
Di bawah ini, mari kita mendefinisikan lain
pemilih, sehingga untuk berbicara.

33
00:01:47,830 --> 00:01:52,680
Ini satu untuk tag HTML yang memiliki
identifier unik tengah.

34
00:01:52,680 --> 00:01:57,540
Dan di sini, mari kita menentukan ukuran font
dari 24 piksel, di bawah yang lain

35
00:01:57,540 --> 00:02:01,520
pemilih untuk bagian bawah, dan di dalam
dari itu, mari kita menentukan

36
00:02:01,520 --> 00:02:03,850
ukuran font 12 pixel.

37
00:02:03,850 --> 00:02:09,350
>> Mari kita sekarang menyimpan, mengubah izin
pada, dan memuat halaman ini di browser,

38
00:02:09,350 --> 00:02:14,230
chmod plus r css-1.html.

39
00:02:14,230 --> 00:02:22,260
Mari kita membuka Chrome dan mengunjungi
http://localhost/css-1.html.

40
00:02:22,260 --> 00:02:22,960
Tidak buruk.

41
00:02:22,960 --> 00:02:26,930
Persis seperti aku berniat, tapi saya ingin
mengambil hal-hal satu langkah lebih lanjut sekarang dan

42
00:02:26,930 --> 00:02:29,050
teks center John Harvard.

43
00:02:29,050 --> 00:02:32,080
Sekarang untuk melakukannya, saya bisa membungkus
seluruh halaman di div seperti yang saya

44
00:02:32,080 --> 00:02:33,800
melakukan contoh sebelumnya.

45
00:02:33,800 --> 00:02:37,820
Atau aku bisa lebih pintar dan menyadari bahwa
semua divs ini dalam

46
00:02:37,820 --> 00:02:42,420
tubuh halaman saya, jadi mengapa tidak hanya berlaku
satu atau lebih CSS properti untuk tubuh

47
00:02:42,420 --> 00:02:43,850
tag sendiri?

48
00:02:43,850 --> 00:02:45,460
>> Untuk melakukannya, mari kita lakukan ini.

49
00:02:45,460 --> 00:02:47,650
Mari kita kembali ke gedit sini.

50
00:02:47,650 --> 00:02:52,460
Mari kita gulir kembali ke tag Style,
dan mari kita menentukan pemilih hanya

51
00:02:52,460 --> 00:02:54,520
dipake tag nama, Body.

52
00:02:54,520 --> 00:03:00,580
Di bawah itu, mari kita kurung kurawal kami
diikuti oleh pusat text-align.

53
00:03:00,580 --> 00:03:05,580
Sekarang mari kita menyimpan halaman dan kembali
di dalam browser itu.

54
00:03:05,580 --> 00:03:08,090
Reload di Chrome, dan voila.

55
00:03:08,090 --> 00:03:11,000
Kami sekarang memiliki halaman John Harvard
berpusat seperti yang kita dimaksudkan.

56
00:03:11,000 --> 00:03:12,619