1
00:00:00,000 --> 00:00:00,290

2
00:00:00,290 --> 00:00:03,310
>> СПІКЕР: Атрымліваецца, што HTML не
адзіны мову, які вы можаце выкарыстоўваць ўнутры

3
00:00:03,310 --> 00:00:03,895
вэб-старонкі.

4
00:00:03,895 --> 00:00:08,100
Вы можаце выкарыстоўваць тое, што называецца CSS, або
Каскадныя табліцы стыляў, а таксама.

5
00:00:08,100 --> 00:00:12,120
CSS дазваляе задаць значна больш
менавіта эстэтыка Сеткі

6
00:00:12,120 --> 00:00:16,930
старонкі, у тым ліку планіроўкі і памераў і
колеру і шрыфты і многае іншае.

7
00:00:16,930 --> 00:00:20,820
Напрыклад, давайце ствараць вэб-старонкі
тут называецца css0, што ўяўляе сабой

8
00:00:20,820 --> 00:00:22,740
Хатняя старонка для, скажам, Джона Гарварда.

9
00:00:22,740 --> 00:00:25,480
>> На гэтай старонцы мы будзем мець Джон Гарварда
імя, пад якім будзе

10
00:00:25,480 --> 00:00:28,500
добры паведамленне для сваіх наведвальнікаў, пад
які будзе падвал, з

11
00:00:28,500 --> 00:00:30,590
кажуць, некаторыя звесткі аб аўтарскіх правах.

12
00:00:30,590 --> 00:00:34,650
Каб зрабіць гэта, давайце вызначым тры падраздзяленні
для старонкі з дапамогай тэга

13
00:00:34,650 --> 00:00:35,670
называецца спраў.

14
00:00:35,670 --> 00:00:43,880
Адкрыць кранштэйны спраў, Джон Гарвард, недалёка
Кранштэйны спраў, яшчэ адзін адкрыты кранштэйны спраў,

15
00:00:43,880 --> 00:00:48,330
і зараз мы будзем паказаць нешта
як, дабро запрашаем на маю старонку!

16
00:00:48,330 --> 00:00:50,420
І давайце закрыем гэтую DIV, а таксама.

17
00:00:50,420 --> 00:00:53,700
>> І зараз трэці і апошні
спраў, аўтарскае права.

18
00:00:53,700 --> 00:00:58,250
Проста быць фантазіі, дазвольце мне выкарыстоўваць цяпер у HTML
твар, сімвал, які ўяўляе

19
00:00:58,250 --> 00:01:01,140
сімвал, які вы не маглі інакш
друкаваць на клавіятуры.

20
00:01:01,140 --> 00:01:07,490
У прыватнасці, я збіраюся зрабіць
Ампэрсанд, фунт, 169, кропка з коскі.

21
00:01:07,490 --> 00:01:10,620
Аказваецца, што гэта лічбавы код
для знака аўтарскага права.

22
00:01:10,620 --> 00:01:14,260
Тады давайце ўдакладнім Джон Гарвард
тут у ніжняй часткі.

23
00:01:14,260 --> 00:01:17,180
Закрыем DIV і захавайце файл.

24
00:01:17,180 --> 00:01:18,910
>> Цяпер, што ж гэта за спраў тэг?

25
00:01:18,910 --> 00:01:21,970
Спраў тэг проста вызначае дзяленне
старонкі, які з'яўляецца па сутнасці

26
00:01:21,970 --> 00:01:23,310
прастакутная вобласць.

27
00:01:23,310 --> 00:01:26,850
Так што ў гэты момант часу, у мяне ёсць тры
прастакутныя вобласці, адзін на вяршыні

28
00:01:26,850 --> 00:01:27,620
ад іншага.

29
00:01:27,620 --> 00:01:30,610
Так што на дадзены эфект амаль як
хоць я павінен быў тры абзаца.

30
00:01:30,610 --> 00:01:33,490
Але мы не ўбачым у той жа ступені
прабелы паміж імі.

31
00:01:33,490 --> 00:01:36,170
>> Давайце захаваць гэты файл, змяніць яго
дазволу, і зірнуць на

32
00:01:36,170 --> 00:01:37,990
момант у Chrome.

33
00:01:37,990 --> 00:01:43,040
Chmod + R CSS0.html.

34
00:01:43,040 --> 00:01:52,440
Давайце зараз адкрыць Chrome і візіт
http://localhost.CSS0.html.

35
00:01:52,440 --> 00:01:54,630
На самай справе, вось хатняя старонка
Джона Гарварда.

36
00:01:54,630 --> 00:01:59,370
Давайце зараз стылізаваць яго крыху больш
Менавіта з дапамогай некаторых CSS.

37
00:01:59,370 --> 00:02:03,510
>> Вярнуцца ў Gedit, давайце ўвойдзем у гэты
Першы спраў тэгі і дадаць стыль

38
00:02:03,510 --> 00:02:11,060
атрыбутаў удакладніўшы, што я хацеў бы
памер шрыфта, скажам, 36 пікселяў, або пікс.

39
00:02:11,060 --> 00:02:15,650
І я хацеў бы вага гэтага шрыфта
быць адважным, а не па змаўчанні,

40
00:02:15,650 --> 00:02:16,980
які з'яўляецца нармальным.

41
00:02:16,980 --> 00:02:21,170
Для другога DIV, давайце ўдакладнім
іншы атрыбут стылю, які мае

42
00:02:21,170 --> 00:02:25,550
Памер шрыфта 24 пікселяў, так што
трохі менш.

43
00:02:25,550 --> 00:02:28,410
Зачыніць каціроўкі пасля коскі.

44
00:02:28,410 --> 00:02:33,255
>> Нарэшце, у гэтым трэцім DIV, давайце зробім
стыль роўная памер цытаты, шрыфт, і

45
00:02:33,255 --> 00:02:35,340
скажам 12 пікселяў на гэты раз.

46
00:02:35,340 --> 00:02:37,280
Зачыніць цытата пасля коскі.

47
00:02:37,280 --> 00:02:40,200
Звярніце ўвагу, тое, што я, здаецца,
паказана трохі стылізацыі для

48
00:02:40,200 --> 00:02:43,770
кожны з гэтых трох DIVs з выкарыстаннем,
Аказваецца, CSS.

49
00:02:43,770 --> 00:02:47,820
На самай справе, сінтаксіс, што вы бачыце ў
паміж гэтымі падвойныя двукоссі з'яўляецца CSS,

50
00:02:47,820 --> 00:02:50,620
спецыяльна CSS ўласцівасці
са значэннямі.

51
00:02:50,620 --> 00:02:53,910
І па гэтай першага тэга, дзе я меў
дзве такія ўласцівасці, памер шрыфта і

52
00:02:53,910 --> 00:02:57,290
вага шрыфта, я проста аддзеленая
іх кропкай з коскі.

53
00:02:57,290 --> 00:02:59,940
>> Цяпер, проста дзеля стылю, я
таксама ўключаны Кропка з коскі ў

54
00:02:59,940 --> 00:03:00,880
канец кожнага радка.

55
00:03:00,880 --> 00:03:04,270
Але яны не абавязкова,
асабліва калі ў вас ёсць толькі адзін

56
00:03:04,270 --> 00:03:05,580
ўласцівасць, вызначанае.

57
00:03:05,580 --> 00:03:08,370
Давайце зараз захавайце файл і перазагрузіце
у Chrome, і паглядзець, што

58
00:03:08,370 --> 00:03:11,000
чысты эфект.

59
00:03:11,000 --> 00:03:13,470
Вярнуцца ў Chrome тут,
давайце націсніце Абнавіць.

60
00:03:13,470 --> 00:03:15,800
>> Цяпер у нас ёсць трохі больш цікавы
Хатняя старонка для Яна

61
00:03:15,800 --> 00:03:19,000
Гарвард, у выніку чаго першая лінія з
яго імя, якое знаходзіцца ўсярэдзіне, што

62
00:03:19,000 --> 00:03:23,470
Першы спраў, складае 36 пікселяў ў вышыню, а таксама
паўтлусты, прычым другая радок,

63
00:03:23,470 --> 00:03:27,340
які ў гэтым другім DIV, 24
пікселяў ў вышыню, але не тлустым шрыфтам.

64
00:03:27,340 --> 00:03:31,500
І пры гэтым трэцяя радок у гэтым траціну
спраў складае 12 пікселяў ў вышыню, а таксама

65
00:03:31,500 --> 00:03:32,610
не тлустым шрыфтам.

66
00:03:32,610 --> 00:03:35,380
Але выкажам здагадку, што цяпер я хацеў бы перайсці
ўвесь гэты тэкст над

67
00:03:35,380 --> 00:03:36,650
такім чынам, што яна па цэнтры.

68
00:03:36,650 --> 00:03:40,480
>> Я мог выраўнаваць кожны з асобы
дзівы як па цэнтры.

69
00:03:40,480 --> 00:03:45,330
Але лягчэй, я мог абгарнуць тых,
тры дзівы ўнутры чацвёртага DIV,

70
00:03:45,330 --> 00:03:49,360
бацька спраў, так бы мовіць, і пакажыце
што, што спраў і ўсе яго

71
00:03:49,360 --> 00:03:52,610
нашчадкі павінны быць
Тэкст выраўноўваецца цэнтр?

72
00:03:52,610 --> 00:03:54,120
Давайце зірнем.

73
00:03:54,120 --> 00:03:58,510
>> Унутры Gedit, давайце вернемся да майго
цела і дадаць новы DIV наверсе з

74
00:03:58,510 --> 00:04:04,460
спраў, стыль роўная цытатай канец цытаты
Тэкст па цэнтру, блізка

75
00:04:04,460 --> 00:04:06,250
цытую пасля коскі.

76
00:04:06,250 --> 00:04:10,280
А цяпер, давайце ісці наперад і водступ ўсё
з тых ліній, якія мы ўвялі раней.

77
00:04:10,280 --> 00:04:15,040
І ніжэй гэтай трэцяй DIV, давайце
закрыць гэтую новую DIV.

78
00:04:15,040 --> 00:04:18,829
>> Іншымі словамі, так як гэтыя тры
арыгінальныя дзівы цяпер дзеці, так

79
00:04:18,829 --> 00:04:22,110
казаць, новага бацькоўскага DIV і ў мяне ёсць
паказана, што я хацеў бы, каб выраўнаваць

80
00:04:22,110 --> 00:04:26,140
Тэкст гэтага бацькоўскага сну ў цэнтры
старонкі, што маёмасць будзе

81
00:04:26,140 --> 00:04:28,290
ўспадкоўваюцца ўсе з гэтых дзяцей.

82
00:04:28,290 --> 00:04:32,370
На самай справе, давайце захавайце файл і
зірнуць у браўзэры.

83
00:04:32,370 --> 00:04:34,650
Давайце перазагрузіць ў Chrome.

84
00:04:34,650 --> 00:04:37,540
І ў нас гэта ёсць, яшчэ прыемней
Хатняя старонка для Джона Гарварда.

85
00:04:37,540 --> 00:04:39,872