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

2
00:00:00,300 --> 00:00:04,840
>> 演講嘉賓：所以，它實際上不是最好的
設計交融的CSS和HTML。

3
00:00:04,840 --> 00:00:08,700
相反，它是最好分解出您的
CSS的，把它放在中部，

4
00:00:08,700 --> 00:00:11,430
不知它適用於
標籤在你的網頁。

5
00:00:11,430 --> 00:00:15,290
要做到這一點，我們就可以真正停止
使用樣式屬性，而不是

6
00:00:15,290 --> 00:00:19,290
使用Style標記，屬於在
頭一個網頁的旁邊，為

7
00:00:19,290 --> 00:00:20,700
例如，你的標題。

8
00:00:20,700 --> 00:00:24,400
>> 讓我們給這一個嘗試，重新實現
約翰·哈佛的主頁

9
00:00:24,400 --> 00:00:26,410
使用樣式標記。

10
00:00:26,410 --> 00:00:28,930
我已經得到我們開始
這裡有三個div的供

11
00:00:28,930 --> 00:00:30,260
約翰·哈佛的網頁。

12
00:00:30,260 --> 00:00:33,990
但是，讓我們現在先上去這首
格，並添加一個新的屬性，

13
00:00:33,990 --> 00:00:38,680
即ID，並指定一個唯一的
識別這個特定的div

14
00:00:38,680 --> 00:00:42,390
應，例如，報價引文
“頂部”，一個任意的名稱，但

15
00:00:42,390 --> 00:00:45,840
描述在這個分區是
確實在我的網頁的頂部。

16
00:00:45,840 --> 00:00:48,920
>> 在接下來的div，讓我們給它一個
報價引文結束的不同的ID

17
00:00:48,920 --> 00:00:54,080
“中間”，讓我們給第三格
的報價引文結束一個ID“墊底”。我們

18
00:00:54,080 --> 00:00:57,740
現在有三個唯一標識符
這是我們可以應用一些CSS

19
00:00:57,740 --> 00:01:01,210
性能，但首先，讓我們回歸
這個頁面的頭部。

20
00:01:01,210 --> 00:01:04,760
以上只是這裡的稱號，我會
繼續前進，定義樣式

21
00:01:04,760 --> 00:01:07,120
然後關閉風格。

22
00:01:07,120 --> 00:01:10,340
>> 在這裡面，現在，我要去定義
一些CSS屬性，即

23
00:01:10,340 --> 00:01:14,550
同那些我以前曾在風格
屬性，但在這裡，他們將

24
00:01:14,550 --> 00:01:16,320
集中定義。

25
00:01:16,320 --> 00:01:20,880
要做到這一點，我要去指定英鎊
符號其次是頂部，從而

26
00:01:20,880 --> 00:01:24,710
指定下面的CSS
性質應適用於任何

27
00:01:24,710 --> 00:01:28,800
HTML元素具有獨特的
標識符頂部。

28
00:01:28,800 --> 00:01:32,240
我那麼將會有一些開放，
封閉的大括號，和我要去

29
00:01:32,240 --> 00:01:39,170
指定，也就是說，字體大小應為36
像素，字體粗細應為粗體。

30
00:01:39,170 --> 00:01:41,810
>> 為了保持乾淨的東西，我把每個
現在自己的這些屬性

31
00:01:41,810 --> 00:01:44,610
線，但是這只是一個
文體慣例。

32
00:01:44,610 --> 00:01:47,830
低於這個，現在讓我們再定義
選擇器，可以這麼說。

33
00:01:47,830 --> 00:01:52,680
這其中對於具有HTML標記
中間的唯一標識符。

34
00:01:52,680 --> 00:01:57,540
而在這裡，讓我們來指定字體大小
中的24個像素，低於該另一

35
00:01:57,540 --> 00:02:01,520
選擇器底部和內
那，讓我們來指定

36
00:02:01,520 --> 00:02:03,850
的12像素的字體大小。

37
00:02:03,850 --> 00:02:09,350
>> 現在，讓我們保存，更改權限
上，並在瀏覽器中加載該頁面，

38
00:02:09,350 --> 00:02:14,230
存取權限chmod a加r CSS-1.HTML。

39
00:02:14,230 --> 00:02:22,260
讓我們打開瀏覽器並訪問
http://localhost/css-1.html。

40
00:02:22,260 --> 00:02:22,960
不壞。

41
00:02:22,960 --> 00:02:26,930
正是因為我打算，但我想
走一步算一步，現在和

42
00:02:26,930 --> 00:02:29,050
中心的約翰·哈佛的文字。

43
00:02:29,050 --> 00:02:32,080
我們可以這樣做，我可以換的
在一個div整個頁面，因為我

44
00:02:32,080 --> 00:02:33,800
做一個早期的例子。

45
00:02:33,800 --> 00:02:37,820
或者，我可以更聰明，並認識到
所有這些div都是內部

46
00:02:37,820 --> 00:02:42,420
我的網頁的身體，所以為什麼不適用
一個或多個CSS屬性到主體

47
00:02:42,420 --> 00:02:43,850
標籤本身？

48
00:02:43,850 --> 00:02:45,460
>> 要做到這一點，讓我們做到這一點。

49
00:02:45,460 --> 00:02:47,650
讓我們再回到這裡的gedit。

50
00:02:47,650 --> 00:02:52,460
讓我們回到前面的風格標籤，
並讓我們指定一個選擇器只是

51
00:02:52,460 --> 00:02:54,520
使用該標籤的名字，身體。

52
00:02:54,520 --> 00:03:00,580
下面說，讓我們把我們的大括號
其次是文本對齊中心。

53
00:03:00,580 --> 00:03:05,580
現在讓我們保存頁面並重新加載
它是瀏覽器的內部。

54
00:03:05,580 --> 00:03:08,090
刷新在Chrome中，瞧。

55
00:03:08,090 --> 00:03:11,000
我們現在有約翰·哈佛的頁面
中心作為我們預期。

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