1
00:00:00,000 --> 00:00:06,100

2
00:00:06,100 --> 00:00:08,790
>> Даг Lloyd: Так мы правялі
about-- калі мая матэматыка з'яўляецца правільным,

3
00:00:08,790 --> 00:00:11,900
і я думаю, гледзячы back-- Я думаю,
мы выдаткавалі каля 35 відэа казаць

4
00:00:11,900 --> 00:00:15,139
аб розных аспектах З, можа быць
трохі больш, можа быць, крыху менш.

5
00:00:15,139 --> 00:00:16,930
І мы не пакрываюць
усё ў C, але мы

6
00:00:16,930 --> 00:00:21,170
ахоплівае вялікі кавалак з
мова, пераважная большасць з яго,

7
00:00:21,170 --> 00:00:22,882
вядома, для агульнага прымянення.

8
00:00:22,882 --> 00:00:25,090
Цяпер мы збіраемся казаць
пра іншую мову, HTML.

9
00:00:25,090 --> 00:00:28,180
І мы збіраемся, каб пакрыць
гэта толькі ў адным відэа.

10
00:00:28,180 --> 00:00:29,340
>> Але гэта будзе ў парадку.

11
00:00:29,340 --> 00:00:31,410
Гэта адбываецца на самай справе стаць
тое, што вы збіраецеся, каб прывыкнуць да.

12
00:00:31,410 --> 00:00:33,535
Цяпер, у вас ёсць
Асновы адной мове,

13
00:00:33,535 --> 00:00:35,776
гэта на самай справе даволі лёгка
каб пачаць навучанне іншых.

14
00:00:35,776 --> 00:00:37,650
Такім чынам, мы збіраемся, каб пачаць
да кроку трохі назад

15
00:00:37,650 --> 00:00:43,340
і замоўчваць асноўнай
Адрозненні паміж гэтымі мовамі

16
00:00:43,340 --> 00:00:45,750
і накшталт пакінуць вас з ім.

17
00:00:45,750 --> 00:00:48,530
Там вельмі шмат сапраўды выдатна
рэсурсы ў Інтэрнэце, які

18
00:00:48,530 --> 00:00:51,279
мы збіраемся пачаць накіроўваючы вас
да, таму што Інтэрнэт

19
00:00:51,279 --> 00:00:53,340
велізарнае сховішча інфармацыі.

20
00:00:53,340 --> 00:00:55,960
І такім чынам, гэта не падабаецца вам
быць прайграўшы абавязкова

21
00:00:55,960 --> 00:00:58,349
не маючы інфармацыю
пакрытыя відэа.

22
00:00:58,349 --> 00:01:00,640
Вы па-ранейшаму будзеце мець магчымасць атрымаць
усё, што трэба і выкарыстанне

23
00:01:00,640 --> 00:01:03,590
веданне вы ўжо
забудавана разумення C

24
00:01:03,590 --> 00:01:07,130
зрабіць працэс навучання для іх
іншыя мовы на самай справе шмат пахвальных.

25
00:01:07,130 --> 00:01:08,640
Я абяцаю.

26
00:01:08,640 --> 00:01:12,770
>> Але давайце пагаворым аб адной мове
гэта сапраўды фундаментальнае значэнне для кожнага вэб

27
00:01:12,770 --> 00:01:14,830
старонка, якая HTML.

28
00:01:14,830 --> 00:01:18,230
HTML з'яўляецца мова гіпертэкставай разметкі.

29
00:01:18,230 --> 00:01:22,700
HTML з'яўляецца мовай, але гэта
не з'яўляецца мовай праграмавання.

30
00:01:22,700 --> 00:01:23,900
>> HTML не мець зменныя.

31
00:01:23,900 --> 00:01:26,430
Ён не мае логікі або
функцыі або што-небудзь падобнае.

32
00:01:26,430 --> 00:01:30,301
Мы не можам зрабіць любы
праграмаванне па сабе ў HTML.

33
00:01:30,301 --> 00:01:32,300
Часам вы будзеце чуць
людзі апісваюць сябе

34
00:01:32,300 --> 00:01:35,710
а HTML праграмістаў, якія
гэта не зусім дакладна.

35
00:01:35,710 --> 00:01:37,980
Мы не можам напісаць HTML праграмы.

36
00:01:37,980 --> 00:01:40,770
>> HTML толькі для разметкі тэксту.

37
00:01:40,770 --> 00:01:42,690
Гэта называецца мовай разметкі.

38
00:01:42,690 --> 00:01:47,680
І тое, што гэта does-- гэты markup--
мы выкарыстоўваем тэгі HTML і гэтыя tags--

39
00:01:47,680 --> 00:01:51,600
гэта семантычна markup--
вызначае структуру старонкі

40
00:01:51,600 --> 00:01:55,280
і выклікае просты тэкст, што
існуе паміж пазнакі павінны інтэрпрэтавацца

41
00:01:55,280 --> 00:01:57,320
браўзэрамі па-рознаму.

42
00:01:57,320 --> 00:02:00,370
І, магчыма, гэта лепш растлумачыць
гэта, спосаб ілюстрацыі.

43
00:02:00,370 --> 00:02:06,450
>> Вось вельмі просты HTML-старонкі, ня
HTML-праграма, зноў жа, HTML-старонка.

44
00:02:06,450 --> 00:02:08,680
І мы ведаем, што гэта
HTML-старонка, таму што мы

45
00:02:08,680 --> 00:02:11,480
абмежаваная ўсё з HTML-тэгі.

46
00:02:11,480 --> 00:02:13,850
Так што гэта тое, што HTML-тэгі выглядае.

47
00:02:13,850 --> 00:02:15,870
Гэта паміж вуглавымі дужкамі.

48
00:02:15,870 --> 00:02:18,570
І звярніце ўвагу, у верхняй маем
HTML і ў самым нізе,

49
00:02:18,570 --> 00:02:21,400
пасля таго як мы зрабілі тое, што
па-відаць, шмат іншай HTML,

50
00:02:21,400 --> 00:02:24,310
у нас ёсць дужка слэш HTML.

51
00:02:24,310 --> 00:02:29,262
Так што нібыта ёсць мяжа
між тым, што HTML-а што не.

52
00:02:29,262 --> 00:02:32,220
І, вядома, умоўна, толькі
як вы напісалі ўсе вашы праграмы C

53
00:02:32,220 --> 00:02:35,300
з пашырэннямі кропка C,
усе вашы HTML файлы

54
00:02:35,300 --> 00:02:37,909
скончыцца кропак пашырэньні HTML.

55
00:02:37,909 --> 00:02:39,200
Але гэта яшчэ не адбываецца.

56
00:02:39,200 --> 00:02:40,658
Мы не проста мець гэтыя HTML-тэгі.

57
00:02:40,658 --> 00:02:44,010
Мы, мабыць, ёсць гэта
што называецца галаўнога тэг.

58
00:02:44,010 --> 00:02:46,010
Ну, добра, што гэта такое?

59
00:02:46,010 --> 00:02:48,550
>> Ну, можа быць, лепш
вылучыць шляхам цела,

60
00:02:48,550 --> 00:02:50,590
Цела з'яўляецца ўтрыманне вэб-старонкі.

61
00:02:50,590 --> 00:02:55,860
Так, можа быць, кіраўнік тэг вызначае матэрыял
які ня знаходзіцца ў акне браўзэра уласна,

62
00:02:55,860 --> 00:02:59,410
але як-то важна, каб нашы
вэб-старонкі, якія аказваюцца правільна.

63
00:02:59,410 --> 00:03:02,490
Напрыклад, усярэдзіне з
Кіраўнік тэг нас ёсць тэгі назвы.

64
00:03:02,490 --> 00:03:05,500
>> Так назву быўшы прывітанне свет,
што на самой справе адбываецца, тое, што

65
00:03:05,500 --> 00:03:08,797
Выставы ў закладцы у Chrome
або ў сафары або Firefox--

66
00:03:08,797 --> 00:03:11,880
усе браўзэр prefer-- гэта
што адбываецца, каб паказаць у назве.

67
00:03:11,880 --> 00:03:14,800
І перш, чым ўкладкі было б паказаць
ў ўсім акне браўзэра

68
00:03:14,800 --> 00:03:19,710
і вы можаце мець толькі адну старонку
адкрыць у акне браўзэра ў той час.

69
00:03:19,710 --> 00:03:22,160
Так, што адбываецца, каб быць
Назва маёй старонкі уверх на ўкладцы

70
00:03:22,160 --> 00:03:24,600
або бар акно браўзэра, прывітанне свет.

71
00:03:24,600 --> 00:03:28,611
І тады ўтрыманне маёй
вэб-старонка будзе свет, прывітанне.

72
00:03:28,611 --> 00:03:31,360
Такім чынам, давайце зірнем на тое, што некаторыя
рэч, як гэта можа выглядаць.

73
00:03:31,360 --> 00:03:33,210
Гэта даволі просты HTML-старонкі.

74
00:03:33,210 --> 00:03:35,970
Так што я тут, у маім CS50 IDE і
Я павялічана няшмат.

75
00:03:35,970 --> 00:03:38,290
І я проста хачу, каб
адкрыць прывітанне кропка HTML

76
00:03:38,290 --> 00:03:42,000
і паказаць вам, што гэта ў значнай ступені
змесціва старонкі, што мы бачылі раней.

77
00:03:42,000 --> 00:03:45,240
Мае тэгі HTML простыя, галаўныя
тэгі загалоўкаў, цела, і гэтак далей.

78
00:03:45,240 --> 00:03:47,320
Я з водступам, каб быць чыстым.

79
00:03:47,320 --> 00:03:51,530
>> І тады тое, што я магу зрабіць у маім
IDE проста прагледзець старонку.

80
00:03:51,530 --> 00:03:52,630
І мы ідзем.

81
00:03:52,630 --> 00:03:56,070
Змест маёй старонцы свету,
прывітанне, і я не бачу нічога

82
00:03:56,070 --> 00:03:58,500
у з тэгамі галаве.

83
00:03:58,500 --> 00:03:59,980
Гэта проста ўтрыманне цела.

84
00:03:59,980 --> 00:04:00,780
Свет, прывітанне.

85
00:04:00,780 --> 00:04:03,700
І зноў цела проста
сказаў, свет, прывітанне.

86
00:04:03,700 --> 00:04:06,160
Іншая частка адсутнічае.

87
00:04:06,160 --> 00:04:07,610
>> Так што на самай справе ўсё гэта.

88
00:04:07,610 --> 00:04:11,370
Гэта вельмі проста асноўнай старонцы HTML.

89
00:04:11,370 --> 00:04:14,280
Зараз я з водступам мой HTML на
сапраўды добры і арганізаваны,

90
00:04:14,280 --> 00:04:15,840
але я на самой справе не прыйдзецца.

91
00:04:15,840 --> 00:04:17,959
Я мог бы зрабіць гэта выглядаць даволі выродлівым.

92
00:04:17,959 --> 00:04:19,467
І гэта будзе па-ранейшаму працаваць.

93
00:04:19,467 --> 00:04:21,050
Гэта будзе сапраўды такі жа вэб-старонцы.

94
00:04:21,050 --> 00:04:23,100
Я толькі што пазбавіўся ад
ўсё пустое прастору.

95
00:04:23,100 --> 00:04:24,820
>> Як высвятляецца, белы прастору дадзеных.

96
00:04:24,820 --> 00:04:28,540
І таму, калі мы пасылаем дадзеныя з
адпраўніка да атрымальніка, ад сервера

97
00:04:28,540 --> 00:04:30,670
кліенту, дадзеныя каштуе грошай.

98
00:04:30,670 --> 00:04:34,460
І так, каб пазбавіцца ад прабелаў
на самай справе добрая ідэя

99
00:04:34,460 --> 00:04:37,320
калі вы хто-то, хто служыць
да шмат вэб-кантэнту.

100
00:04:37,320 --> 00:04:39,820
Гэта дрэнная ідэя, калі вы
той, хто вучыцца гэты матэрыял

101
00:04:39,820 --> 00:04:41,528
і вы хочаце, каб
гэта прыгожа арганізавана.

102
00:04:41,528 --> 00:04:43,810
Гэта нашмат прасцей, каб разабраць, чым гэта.

103
00:04:43,810 --> 00:04:45,540
Але гэта функцыянальна ідэнтычныя.

104
00:04:45,540 --> 00:04:48,720
>> Паглыбленне і таму падобнае
на самай справе не мае значэння, у HTML.

105
00:04:48,720 --> 00:04:53,634
Усё, што мае значэнне адкрыцця тэгі і
якія зачыняюць тэгі ў правільным парадку.

106
00:04:53,634 --> 00:04:55,050
Звярніце ўвагу, што тут адбылося, хоць.

107
00:04:55,050 --> 00:04:58,450
Разметка дае нам шлях да
мець зносіны дадатковую інфармацыю

108
00:04:58,450 --> 00:04:59,940
аб тым, што мы напісалі.

109
00:04:59,940 --> 00:05:03,130
Прывітання, Сусветны частка была
інтэрпрэтуецца як назва.

110
00:05:03,130 --> 00:05:06,410
І свет, прывітанне частка была
інтэрпрэтуецца як змест

111
00:05:06,410 --> 00:05:09,090
або тое, што павінна быць
бачныя на маёй вэб-старонцы.

112
00:05:09,090 --> 00:05:12,167
>> Ёсць больш чым 100 з іх адрозніваецца
тэгі і шмат вялікіх рэсурсаў

113
00:05:12,167 --> 00:05:13,000
онлайн, каб знайсці іх.

114
00:05:13,000 --> 00:05:14,900
Мы збіраемся казаць пра
Некаторыя з іх у гэтым відэа, некаторыя

115
00:05:14,900 --> 00:05:16,440
на самай справе фундаментальнай рэчы.

116
00:05:16,440 --> 00:05:18,440
Але мы не збіраемся казаць
пра ўсё гэта таму, што ён

117
00:05:18,440 --> 00:05:20,250
будзе вычарпальным зрабіць.

118
00:05:20,250 --> 00:05:22,880
>> Яшчэ адна рэч, вы можаце зрабіць, хоць,
гэта адкрыць інструменты распрацоўніка.

119
00:05:22,880 --> 00:05:26,069
І калі вы памятаеце з
наша відэа на HTTP,

120
00:05:26,069 --> 00:05:27,860
Я растлумачыў, як адкрыць
да прылад для распрацоўнікаў.

121
00:05:27,860 --> 00:05:32,020
У Chrome гэта звычайна клавішу F12
каб адкрыць панэль інструментаў распрацоўніка.

122
00:05:32,020 --> 00:05:35,909
Тады замест выбару сеткі
закладка, вы можаце выбраць ўкладку Elements.

123
00:05:35,909 --> 00:05:37,700
І калі вы загружаеце вэб
старонак, вы на самой справе

124
00:05:37,700 --> 00:05:40,280
паглядзець HTML, які стварае гэтую вэб-старонку.

125
00:05:40,280 --> 00:05:44,090
І так вы можаце даведацца шмат новага пра HTML
, Гледзячы на ​​вашыя любімыя вэб-сайты

126
00:05:44,090 --> 00:05:48,474
і бачачы, як яны будаваць
розныя часткі з іх, якія вам падабаюцца.

127
00:05:48,474 --> 00:05:50,890
Так, можа быць, ёсць у гэтым прахалодным
малюнак ці нешта падобнае.

128
00:05:50,890 --> 00:05:52,140
Як яны робяць гэта з HTML?

129
00:05:52,140 --> 00:05:55,630
Ну вы можаце проста адкрыць свой распрацоўніку
інструменты і навядзіце курсор на гэтым элеменце

130
00:05:55,630 --> 00:05:57,700
і ўбачыць тое, што робіць яго HTML.

131
00:05:57,700 --> 00:05:59,450
Так што гэта сапраўды
добры спосаб, каб даведацца HTML,

132
00:05:59,450 --> 00:06:02,330
і я настойліва рэкамендую, што
вы робіце гэта, каб даведацца, як HTML-

133
00:06:02,330 --> 00:06:04,930
а таксама даведацца трохі
трохі аб некаторых з варыянтаў

134
00:06:04,930 --> 00:06:07,050
даступныя для вас у
прылады для распрацоўнікаў, якія

135
00:06:07,050 --> 00:06:10,200
абавязкова спатрэбіцца ў
Вы пачынаеце рабіць больш інтэнсіўнае Інтэрнэт

136
00:06:10,200 --> 00:06:11,090
праграмаванне.

137
00:06:11,090 --> 00:06:14,080
>> Такім чынам, давайце зірнем на
пара агульных тэгаў HTML.

138
00:06:14,080 --> 00:06:17,210
І мы будзем скакаць і зірнуць на
тое, што гэтыя тэгі таксама будзе аказана

139
00:06:17,210 --> 00:06:20,490
а, гледзячы на ​​некаторых файлаў у маім IDE.

140
00:06:20,490 --> 00:06:26,330
Дык вось тры самыя асноўныя тэгі для
налады вонкавага выгляду тэксту.

141
00:06:26,330 --> 00:06:29,050
Там гэта B тэгі, тэгі, I і U тэгі.

142
00:06:29,050 --> 00:06:33,170
І, адпаведна, тое, што яны робяць, гэта
візуалізацыі тэксту паміж імі тлустым шрыфтам,

143
00:06:33,170 --> 00:06:35,430
курсіў, падкрэсленне і.

144
00:06:35,430 --> 00:06:40,430
Такім чынам, давайце паглядзім, што гэта будзе выглядаць
як на рэальнай вэб-старонкі ў маёй IDE.

145
00:06:40,430 --> 00:06:43,390
>> Дык вось у маім IDE ў мяне
Файл называецца МУВ кропка HTML.

146
00:06:43,390 --> 00:06:46,770
МУВ кропка HTML проста быць
паўтлусты, курсіў, падкрэсліванне.

147
00:06:46,770 --> 00:06:47,830
Я адкрыю яго.

148
00:06:47,830 --> 00:06:51,810
>> І мы ўбачым, што тут я
ёсць гэты тэкст з'яўляецца B тэгі вызначаны тлустым шрыфтам.

149
00:06:51,810 --> 00:06:54,010
Гэты тэкст пазнакі I курсіў.

150
00:06:54,010 --> 00:06:56,307
І гэты тэкст U тэгі падкрэсліў.

151
00:06:56,307 --> 00:06:57,640
Што гэта будзе выглядаць?

152
00:06:57,640 --> 00:06:59,473
Ну зноў жа, усё, што я
каб зрабіць, гэта зайсці сюды

153
00:06:59,473 --> 00:07:04,690
ў маім браўзэры, мой файл-браўзэр, націсніце
Папярэдні прагляд, і гэта тое, што ідзе ўверх.

154
00:07:04,690 --> 00:07:07,520
>> Тэкст паміж B
тэгі сапраўды ў цяперашні час вызначаны тлустым шрыфтам.

155
00:07:07,520 --> 00:07:10,720
Тэкст паміж I
тэгі сапраўды ў цяперашні час курсівам.

156
00:07:10,720 --> 00:07:14,634
І тэкст у паміж U
тэгі сапраўды ў цяперашні час падкрэсленыя.

157
00:07:14,634 --> 00:07:15,550
Так што гэта даволі добра.

158
00:07:15,550 --> 00:07:18,450
Цяпер мы ведаем, як зрабіць тэкст
выглядаць трохі больш фантазіі

159
00:07:18,450 --> 00:07:20,360
або намаляваць акцэнт на пэўных рэчах.

160
00:07:20,360 --> 00:07:25,530
Яшчэ пару агульных тэгаў тут
тэгі параграфаў, тэгі Р, і загаловак,

161
00:07:25,530 --> 00:07:27,980
якія я аказаў тут HX.

162
00:07:27,980 --> 00:07:32,520
>> Гэтыя P тэгі, гэтых тэгаў абзаца,
разбіць тэкст на абзацы да.

163
00:07:32,520 --> 00:07:34,646
Гэта не дастаткова проста
Калі ласка, увядзіце ўдарыў і пакінуць прабелы,

164
00:07:34,646 --> 00:07:37,186
таму што кампутар будзе толькі
рабіць тое, што вы скажаце ёй зрабіць

165
00:07:37,186 --> 00:07:39,450
і ігнаруе белы
Прастору па большай частцы.

166
00:07:39,450 --> 00:07:41,636
Таму мы не можам проста націсніце Enter
і чакаць наш кампутар

167
00:07:41,636 --> 00:07:43,760
інтэрпрэтаваць, што мы хочам
каб пачаць новы абзац.

168
00:07:43,760 --> 00:07:47,670
У нас ёсць вельмі відавочна кажуць, што гэта
з'яўляецца адным paragraph-- гэта another--

169
00:07:47,670 --> 00:07:50,740
складаючы адзін у наборы тэгаў P.

170
00:07:50,740 --> 00:07:54,560
>> І мы таксама маем гэтыя варыянты
для H, гэтыя тэгі загалоўкаў.

171
00:07:54,560 --> 00:07:57,000
У нас ёсць шэсць розных узроўняў
загалоўкаў, адзін, два, тры,

172
00:07:57,000 --> 00:08:01,110
чатыры, пяць, шэсць, якія з'яўляюцца
паступова ўсё больш і больш

173
00:08:01,110 --> 00:08:01,710
загалоўкаў.

174
00:08:01,710 --> 00:08:04,360
І яны становяцца ўсё менш і
менш і менш, і менш.

175
00:08:04,360 --> 00:08:07,690
Таму ў нас ёсць загаловак верхняга ўзроўню, другі
Загаловак ўзроўню, і гэтак далей, і гэтак далей.

176
00:08:07,690 --> 00:08:10,480
>> Давайце зірнем на некаторыя, можа быць,
P-тэгі і тэгі загалоўкаў некаторыя

177
00:08:10,480 --> 00:08:13,110
у дзеянні на вэб-старонцы.

178
00:08:13,110 --> 00:08:18,180
Дык вось у маім IDE ў мяне ёсць файл з імем
PH кропка HTML, PH быць пункты

179
00:08:18,180 --> 00:08:18,970
і тэгі загалоўкаў.

180
00:08:18,970 --> 00:08:20,709
Адкрыйце, што да.

181
00:08:20,709 --> 00:08:23,000
Там вельмі шмат адбываецца тут
таму што я паставіць некаторыя Lorem

182
00:08:23,000 --> 00:08:24,660
Ipsum, некаторыя проста выпадковы тэкст тут.

183
00:08:24,660 --> 00:08:27,284
Так што я буду выдаляць трохі
таму што ёсць так шмат усяго адбываецца.

184
00:08:27,284 --> 00:08:31,980
Але звярніце ўвагу, што ў мяне ёсць, па меншай
пачатку тут у мяне ёсць H1, узровень адзін,

185
00:08:31,980 --> 00:08:32,802
загаловак тэга.

186
00:08:32,802 --> 00:08:36,010
Тады ў мяне ёсць пункт, які знаходзіцца ўсяго
куча выпадковых text-- Lorem ipsum--

187
00:08:36,010 --> 00:08:38,720
проста па змаўчанні стандартны запаўненне тэксту.

188
00:08:38,720 --> 00:08:41,970
Так што ў мяне два абзаца ўнутры, што
Узровень адзін загаловак, а затым ўніз I

189
00:08:41,970 --> 00:08:46,850
ёсць ўзровень два загалоўка тут, на лініі 24,
загаловак другога ўзроўню, і яшчэ два

190
00:08:46,850 --> 00:08:47,840
пункты.

191
00:08:47,840 --> 00:08:51,910
Ну што гэта падобна
калі я яго прагляду ў маім прагляду?

192
00:08:51,910 --> 00:08:53,790
Пабачым.

193
00:08:53,790 --> 00:08:55,730
>> Так заўважыць, што
загаловак першага ўзроўню тут

194
00:08:55,730 --> 00:08:58,420
на самай справе зусім трохі больш
чым загаловак другога ўзроўня.

195
00:08:58,420 --> 00:08:59,940
Таму мы выкарыстоўвалі H1 тэгі.

196
00:08:59,940 --> 00:09:03,820
І звярніце ўвагу, што тэгі P дазваляюць нам
зламаць рэчы ў пунктах.

197
00:09:03,820 --> 00:09:07,500
Калі б мы пазбавіліся ад гэтых тэгаў P
а на самай справе проста пакласці Уваход або вяртанне

198
00:09:07,500 --> 00:09:10,110
у між тым, што мы спадзяваліся,
быць розныя пункты,

199
00:09:10,110 --> 00:09:13,193
яны ўсяго толькі пляснуць разам і
гэта не было б гэтага цудоўнага пункт

200
00:09:13,193 --> 00:09:15,840
падзел з прасторай вышэй і ніжэй.

201
00:09:15,840 --> 00:09:18,300
І вось што пункт
тэгі і тэгі загалоўкаў

202
00:09:18,300 --> 00:09:22,440
звычайна выкарыстоўваюцца, каб зрабіць, каб прыцягнуць
увагу да частак нашага вэб-старонцы

203
00:09:22,440 --> 00:09:23,550
такім чынам.

204
00:09:23,550 --> 00:09:27,560
>> Затым некаторыя прыкметы, якія мы выкарыстоўваем
пабудаваць спісы на нашай вэб-старонцы.

205
00:09:27,560 --> 00:09:30,820
Такім чынам, мы маем неўпарадкаваных
lists-- ULs-- якія проста

206
00:09:30,820 --> 00:09:34,090
маркіраваныя спісы, спарадкаваныя
Спіс якіх numbered--

207
00:09:34,090 --> 00:09:37,680
OLs-- і ўнутры небудзь
адзін з тых, каго мы павінны мець

208
00:09:37,680 --> 00:09:40,600
наборы, як паказваюць элементы спісу, LI.

209
00:09:40,600 --> 00:09:44,370
І таму мы павінны адкрытае UL тэг
і пакласці прадметы ўнутры яго.

210
00:09:44,370 --> 00:09:46,920
А потым, калі мы скончылі з
што мы можам зачыніць тэг UL.

211
00:09:46,920 --> 00:09:49,850
>> І сапраўды гэтак жа мы можам мець
спарадкаваны спіс або нумараваны

212
00:09:49,850 --> 00:09:51,560
і паставіць элементы спісу ўнутры, што.

213
00:09:51,560 --> 00:09:53,350
Такім чынам, давайце зірнем
на пару спісаў

214
00:09:53,350 --> 00:09:57,230
і тое, што яны будуць
аказваць таксама на CS50 IDE.

215
00:09:57,230 --> 00:10:00,640
Так што я тут, у маёй IDE а
файл з імем спісы кропка HTML.

216
00:10:00,640 --> 00:10:03,100
Давайце зірнем.

217
00:10:03,100 --> 00:10:08,482
>> І заўважце тут у мяне ёсць неўпарадкаваных
спіс з пяці рэчаў у ім.

218
00:10:08,482 --> 00:10:11,440
А то ў мяне спарадкаваны спіс, а
Я змяніў тэг трохі,

219
00:10:11,440 --> 00:10:11,939
дакладна?

220
00:10:11,939 --> 00:10:13,152
Я сказаў старт роўная шасці.

221
00:10:13,152 --> 00:10:16,110
Аказваецца з ўпарадкаванай спіс I
можа ўсталяваць пачатковую кропку там, дзе гэта

222
00:10:16,110 --> 00:10:20,130
Я want-- па змаўчанні ён будзе одно--
проста дадаўшы гэты так званы атрыбут

223
00:10:20,130 --> 00:10:21,190
на мой OL тэга.

224
00:10:21,190 --> 00:10:23,572
І так гэты спіс будзе
пачаць адлік у шэсць.

225
00:10:23,572 --> 00:10:26,780
Так што элементы гэтага нумараванага спісу
павінна быць шэсць, сем, восем, дзевяць, дзесяць,

226
00:10:26,780 --> 00:10:29,930
таму што ёсць пяць элементаў
у спісе, у адрозненне ад аднаго,

227
00:10:29,930 --> 00:10:33,770
два, тры, чатыры, пяць, які
было б у выпадку, калі я сказаў ПР

228
00:10:33,770 --> 00:10:36,730
без указання атрыбуту пачатку.

229
00:10:36,730 --> 00:10:41,594
>> Такім чынам, мы проста прагледзець гэта так, вы можаце
атрымаць пачуццё для таго, што тут адбываецца.

230
00:10:41,594 --> 00:10:42,260
І мы ідзем.

231
00:10:42,260 --> 00:10:44,610
Там мой спіс.

232
00:10:44,610 --> 00:10:47,810
Першыя пяць элементаў
неўпарадкаваныя або маркіраваныя спісы.

233
00:10:47,810 --> 00:10:51,010
І ў бліжэйшыя пяць элементаў
гэта асобная спарадкаваны спіс

234
00:10:51,010 --> 00:10:52,980
пачынаючы з шасці.

235
00:10:52,980 --> 00:10:56,247
Дык вось, як мы можам
ствараць спісы, выкарыстоўваючы HTML.

236
00:10:56,247 --> 00:10:58,080
Яшчэ адна рэч, вы маглі б
хочаце зрабіць з HTML

237
00:10:58,080 --> 00:11:01,520
гэта стварыць табліцу
Інфармацыя з радкоў і слупкоў

238
00:11:01,520 --> 00:11:04,560
прадставіць інфармацыю ў
Асабліва арганізавана.

239
00:11:04,560 --> 00:11:09,110
Каб зрабіць гэта з HTML мы можам мець
Вызначэнне табліцы пачынаюць адкрытую дужку

240
00:11:09,110 --> 00:11:10,160
Табліца.

241
00:11:10,160 --> 00:11:14,680
А потым ўнутры гэтай табліцы мы
можа мець мноства радкоў, TR тэгаў

242
00:11:14,680 --> 00:11:15,980
каб паказаць кожную радок.

243
00:11:15,980 --> 00:11:22,510
А потым TD тэгі зайсці ўнутр ПДР тэгаў
для вызначэння слупка ў радку.

244
00:11:22,510 --> 00:11:24,340
>> Чаму яна называецца ГД і ня TC?

245
00:11:24,340 --> 00:11:25,940
Ну, ГД выступае за таблічных дадзеных.

246
00:11:25,940 --> 00:11:27,900
Звычайна вы змяшчаеце
ёсць ваша інфармацыя.

247
00:11:27,900 --> 00:11:29,440
Дык вось, чаму гэта ГД, а не МС.

248
00:11:29,440 --> 00:11:31,140
Гэта крыху збівае з панталыку.

249
00:11:31,140 --> 00:11:33,720
>> Такім чынам, вы павінны табліц тэгаў і
ўнутры тэгаў табліцы

250
00:11:33,720 --> 00:11:35,600
ў вас ёсць некалькі радкоў, ТУ.

251
00:11:35,600 --> 00:11:40,030
А ўнутры кожнага радка ў вас ёсць
TDS для ліку слупкоў

252
00:11:40,030 --> 00:11:42,880
што вы хочаце, каб
У гэтым канкрэтным шэрагу.

253
00:11:42,880 --> 00:11:47,730
Давайце зірнем на вельмі
простая табліца на сябе ў CS50 IDE.

254
00:11:47,730 --> 00:11:49,730
>> Так што я тут файл
называецца табліца кропка HTML.

255
00:11:49,730 --> 00:11:53,390
Давайце паглядзім на
як гэта выглядае.

256
00:11:53,390 --> 00:11:56,225
Там вельмі шмат адбываецца тут, але
калі вы заўважылі, у мяне ёсць табліца адкрыта.

257
00:11:56,225 --> 00:11:57,850
Я пачынаю вызначэнне са сталом.

258
00:11:57,850 --> 00:12:02,100
І тады ў маім першым шэрагу, мабыць, я
ёсць чатыры калоны, адзін, два, тры,

259
00:12:02,100 --> 00:12:02,660
чатыры.

260
00:12:02,660 --> 00:12:04,290
І тады я зрабіў з гэтага радка.

261
00:12:04,290 --> 00:12:07,750
>> Тады я пачынаю іншую радок і
зрабіць два, чатыры, шэсць, восем.

262
00:12:07,750 --> 00:12:08,850
Скончыць гэтую радок.

263
00:12:08,850 --> 00:12:11,410
У іншы шэраг, тры, шэсць, дзевяць, 12.

264
00:12:11,410 --> 00:12:14,830
А потым апошняя радок, чатыры,
восем, 12, і, хоць гэта

265
00:12:14,830 --> 00:12:16,560
трохі адрэзаць тут, 16.

266
00:12:16,560 --> 00:12:17,710
>> Я скончыў гэты радок.

267
00:12:17,710 --> 00:12:18,970
Я скончыў табліцу.

268
00:12:18,970 --> 00:12:21,430
І тады я зрабіў з маёй HTML.

269
00:12:21,430 --> 00:12:22,590
Што гэта выглядае?

270
00:12:22,590 --> 00:12:26,014

271
00:12:26,014 --> 00:12:27,430
Ну, гэта на самай справе не шмат, каб бачыць.

272
00:12:27,430 --> 00:12:31,690
Я выразна арганізаваў маю інфармацыю
у некалькі больш арганізавана.

273
00:12:31,690 --> 00:12:33,755
Але гэта не супер даволі тут.

274
00:12:33,755 --> 00:12:36,130
І мы збіраемся мець справу з
што, калі мы гаворым пра CSS.

275
00:12:36,130 --> 00:12:38,930
Мы вернемся гэтую ідэю
што мы робім, каб зрабіць table--

276
00:12:38,930 --> 00:12:41,260
можа быць, адфарматаваць яго крыху лепш?

277
00:12:41,260 --> 00:12:45,070
Але я ўсё яшчэ ёсць чатыры радкі,
кожны з якіх складаецца з чатырох слупкоў,

278
00:12:45,070 --> 00:12:48,890
і сапраўды, што гэта складае гэта
вельмі просты чатыры на чатыры множання

279
00:12:48,890 --> 00:12:49,870
Табліца.

280
00:12:49,870 --> 00:12:51,690
>> Яшчэ некалькі тэгаў, мы будзем казаць пра.

281
00:12:51,690 --> 00:12:54,617
Давайце пагаворым аб
Канцэпцыя HTML форме.

282
00:12:54,617 --> 00:12:57,450
Такім чынам, вы, магчыма, бачылі гэта ў
Кантэкст ўваходу ў вэб-старонкі.

283
00:12:57,450 --> 00:12:59,100
Звычайна вы ўводзіце сваё імя карыстальніка.

284
00:12:59,100 --> 00:13:01,510
Вы ўводзіце свой пароль,
і вы добра ісці.

285
00:13:01,510 --> 00:13:04,170
Гэта было б пачаткам выглядзе.

286
00:13:04,170 --> 00:13:05,420
>> Пропуск больш DIV секунду.

287
00:13:05,420 --> 00:13:07,987
У нас таксама ёсць ўваходы, якія
выгляд змясціцца ўнутры формаў.

288
00:13:07,987 --> 00:13:10,320
Гэта элементы, якія
вы на самой справе увёўшы ў,

289
00:13:10,320 --> 00:13:12,580
ці радыё-кнопкі вы
цікаюць, або праверка

290
00:13:12,580 --> 00:13:14,310
скрыні, якія вы галачку.

291
00:13:14,310 --> 00:13:15,770
Такім чынам, гэтыя ідуць ўнутры формы.

292
00:13:15,770 --> 00:13:18,500
І яны ўключаюць у асноўным
кожны радок выглядзе

293
00:13:18,500 --> 00:13:19,887
калі ваша форма будзе адфарматаваны таксама.

294
00:13:19,887 --> 00:13:22,220
Тады ёсць гэтая канцэпцыя
DIV, які на самай справе не

295
00:13:22,220 --> 00:13:25,060
упісацца ў любы канкрэтнай катэгорыі
тэгаў, як тыя, якія я

296
00:13:25,060 --> 00:13:26,170
рабіў раней.

297
00:13:26,170 --> 00:13:29,790
Гэта проста свайго роду размяжоўвае
пачатак некаторай адвольнай division--

298
00:13:29,790 --> 00:13:31,670
div-- старонкі.

299
00:13:31,670 --> 00:13:33,210
Там няма ніякіх візуальных перапынак.

300
00:13:33,210 --> 00:13:34,800
Там няма лініі.

301
00:13:34,800 --> 00:13:37,180
Гэта не залічваюцца як
асобны кавалак аўтаматычна.

302
00:13:37,180 --> 00:13:39,430
Вы павінны былі б распрацаваць гэта
што спосаб зрабіць гэта.

303
00:13:39,430 --> 00:13:42,110
>> Гэта проста свайго роду кажа, што я хачу
кавалак прасторы на маёй вэб-старонцы,

304
00:13:42,110 --> 00:13:45,190
і я проста буду называць
гэта такі падзел маёй старонцы.

305
00:13:45,190 --> 00:13:47,619
Мы можам пакласці рэчы ўнутры
з дзівы, і на самай справе,

306
00:13:47,619 --> 00:13:49,410
калі мы над галавой
IDE у секунду, мы будзем

307
00:13:49,410 --> 00:13:53,760
бачыць, што я стаўлю мой
ўтвараюць ўнутры спраў.

308
00:13:53,760 --> 00:13:57,050
>> Так што я тут, у маёй IDE а
Файл называецца DIV форма кропка HTML.

309
00:13:57,050 --> 00:13:59,260
Давайце адкрыем яго.

310
00:13:59,260 --> 00:14:01,460
Звярніце ўвагу, што, як я сказаў,
DIV накшталт адвольным.

311
00:14:01,460 --> 00:14:01,640
Дакладна?

312
00:14:01,640 --> 00:14:02,973
Гэта на самай справе не значыць нічога.

313
00:14:02,973 --> 00:14:05,140
Так што я адвольнае
Першы раздзел маёй старонцы.

314
00:14:05,140 --> 00:14:07,848
І тады замест іншага DIV
пазней, пачынаючы з лініі васьмі,

315
00:14:07,848 --> 00:14:08,730
У мяне ёсць гэты выгляд.

316
00:14:08,730 --> 00:14:13,594
А ўнутры формы ў мяне ёсць
Колькасць уваходаў, палі формы.

317
00:14:13,594 --> 00:14:16,510
Так што ў мяне полі, чыё імя з'яўляецца A--
якія на самай справе не азначае нічога

318
00:14:16,510 --> 00:14:19,350
Права now--, што, мабыць
прымае тэкст, яшчэ адно, што

319
00:14:19,350 --> 00:14:22,630
прымае пароль, іншы, што гэта радыё
Кнопка, іншы, што гэта сцяжок,

320
00:14:22,630 --> 00:14:24,797
і яшчэ, што гэта кнопкі Адправіць.

321
00:14:24,797 --> 00:14:26,630
Ну, тое, што робіць гэта
усё на самой справе выглядае?

322
00:14:26,630 --> 00:14:27,629
Ну, давайце зірнем.

323
00:14:27,629 --> 00:14:31,010
Мы адкрыем яго ў нашым акне папярэдняга прагляду.

324
00:14:31,010 --> 00:14:33,557
Звярніце ўвагу, што гэта адвольнае
у першую чаргу гэта division-- ёсць

325
00:14:33,557 --> 00:14:34,640
няма візуальнага падзелу тут.

326
00:14:34,640 --> 00:14:37,150
Гэта на самай справе не рабіць нічога, праўда?

327
00:14:37,150 --> 00:14:38,220
>> А то ў мяне маю форму.

328
00:14:38,220 --> 00:14:39,890
І я не зрабіў ніякага спецыяльнага фарматавання.

329
00:14:39,890 --> 00:14:42,680
Такім чынам, форма з'яўляецца толькі адным
вялікі шэраг інфармацыі.

330
00:14:42,680 --> 00:14:46,424
Калі б я па-іншаму адфарматаваны сваю форму,
Я мог бы парадкова парадкова.

331
00:14:46,424 --> 00:14:47,590
Але я не рабіў ніякіх стыль.

332
00:14:47,590 --> 00:14:49,256
Зноў жа, мы не гаворым пра CSS тут.

333
00:14:49,256 --> 00:14:51,030
Мы толькі што казалі аб HTML.

334
00:14:51,030 --> 00:14:53,980
>> Ну ў маім тэкставым выглядзе я магу type--
памятаеце, што формы тыпу тэкст

335
00:14:53,980 --> 00:14:55,480
так што я магу паставіць свой подпіс.

336
00:14:55,480 --> 00:14:57,330
І ў маім пароль Я
можна ўвесці свой пароль.

337
00:14:57,330 --> 00:14:59,740
І таму, што гэтай галіне
гэта тыпу паролю

338
00:14:59,740 --> 00:15:01,470
Вы не ведаеце, што мой пароль.

339
00:15:01,470 --> 00:15:02,800
Гэта ўсё кропкі.

340
00:15:02,800 --> 00:15:09,140
>> Я таксама магу выбраць галачку
радыё-кнопкі або адзначце сцяжок.

341
00:15:09,140 --> 00:15:10,420
Ці я мог бы прадставіць сваю форму.

342
00:15:10,420 --> 00:15:11,810
І я нічога не раблю,
таму, калі я прадставіць маю форму,

343
00:15:11,810 --> 00:15:13,090
старонка проста абнаўляецца.

344
00:15:13,090 --> 00:15:16,970
Але я мог бы, магчыма, наладзіць мой
Размясціць кнопку, каб зрабіць нешта яшчэ.

345
00:15:16,970 --> 00:15:20,410
І мы ўбачым, што мы можам зрабіць з
што ў будучыні відэа на PHP.

346
00:15:20,410 --> 00:15:22,520
Але гэта стварае вельмі
простая форма, што мы

347
00:15:22,520 --> 00:15:27,360
можна выкарыстоўваць, каб ўзаемадзейнічаць карыстальнікі і
прадставіць інфармацыю на нашым сайце.

348
00:15:27,360 --> 00:15:29,620
>> Адзін апошні каментар, перш чым мы
перайсці да некаторых іншых тэгах

349
00:15:29,620 --> 00:15:32,040
з'яўляюцца зірнуць на гэта
тэг ўводу яшчэ раз.

350
00:15:32,040 --> 00:15:35,760
Звярніце ўвагу, што я вылучыў
канцы тэга ў чырвоным.

351
00:15:35,760 --> 00:15:39,390
Кожны іншы тэг мы бачылі да гэтага часу мае
быў пачатак і канец, адтуліну

352
00:15:39,390 --> 00:15:41,030
тэг і што зачыняе тэг.

353
00:15:41,030 --> 00:15:42,520
>> Але ўваход тэг ня робіць.

354
00:15:42,520 --> 00:15:46,860
Там няма тэксту, які ідзе
паміж уваходнымі тэгаў.

355
00:15:46,860 --> 00:15:49,160
Уся інфармацыя
мы маем намер перадаць

356
00:15:49,160 --> 00:15:52,640
звязаны як частка
атрыбуты гэтага ўваходу.

357
00:15:52,640 --> 00:15:54,690
Звярніце ўвагу, у нас ёсць імя ўваходу роўная х.

358
00:15:54,690 --> 00:15:55,580
Тып роўная у.

359
00:15:55,580 --> 00:15:57,660
Гэта сапраўды ўсё
Інфармацыя, якую мы павінны.

360
00:15:57,660 --> 00:15:59,470
>> Гэта называецца само які зачыняе тэг.

361
00:15:59,470 --> 00:16:02,470
Гэта не патрабуе адкрыцця і на
блізка, таму што ўсе інфармацыі

362
00:16:02,470 --> 00:16:04,974
змяшчаецца ўнутры
тэг і яго атрыбуты.

363
00:16:04,974 --> 00:16:06,390
Так што часам вы ўбачыце гэта, таксама.

364
00:16:06,390 --> 00:16:10,400
Так проста быць у курсе, што калі ў вас ёсць
тэг, які цалкам аўтаномным,

365
00:16:10,400 --> 00:16:14,170
адчыняецца і зачыняецца сябе
адкрытая дужка злева

366
00:16:14,170 --> 00:16:17,000
і кут слэш
Кранштэйны справа.

367
00:16:17,000 --> 00:16:20,580
Мы ўбачым яшчэ адзін з тых,
цяпер з тэгамі малюнка, а таксама.

368
00:16:20,580 --> 00:16:23,300
>> Перш чым мы пагаворым аб малюнках, мы
трэба казаць пра гіперспасылак.

369
00:16:23,300 --> 00:16:26,080
Калі мы хочам, каб наш вэб-старонкі, каб быць
інтэрактыўным і перамясціць нас вакол,

370
00:16:26,080 --> 00:16:28,121
было б нядрэнна мець магчымасць
націснуць на аднаго з тых,

371
00:16:28,121 --> 00:16:30,190
тое, што як правіла, былі сіні спасылка.

372
00:16:30,190 --> 00:16:34,440
Гэта на самай справе, як мы будуем
гіперспасылка на нашай вэб-старонцы.

373
00:16:34,440 --> 00:16:36,540
І што цікава
ёсць яшчэ адзін тэг HTML

374
00:16:36,540 --> 00:16:39,000
называецца звяно, якое не з'яўляецца гіперспасылка.

375
00:16:39,000 --> 00:16:44,130
А вось каштуе для якара, і
вось як мы паказваем гіперспасылкі.

376
00:16:44,130 --> 00:16:49,150
>> HREF роўная х сродкі ідуць
вэб-старонкі Х. І ўсё

377
00:16:49,150 --> 00:16:51,580
паміж адкрытым Тэг
і блізка Тэг

378
00:16:51,580 --> 00:16:56,010
гэта тое, што будзе, што падкрэсліў
сіні тэкст, які выглядае як спасылку

379
00:16:56,010 --> 00:16:57,590
што мы знаёмыя.

380
00:16:57,590 --> 00:17:01,660
Ніжэй у нас ёсць выява, якое тэг
з'яўляецца самастойнай які зачыняе тэг для адлюстравання

381
00:17:01,660 --> 00:17:05,599
выява знаходзіцца ў X. А
Вы маглі б быць у стане змяніць

382
00:17:05,599 --> 00:17:08,280
што малююнкі, паказаўшы
Шырыня і вышыня

383
00:17:08,280 --> 00:17:11,640
і іншыя атрыбуты ў
што кропка кропка кропка ёсць.

384
00:17:11,640 --> 00:17:14,260
>> У самым нізе тут
у нас ёсць вельмі цікавы

385
00:17:14,260 --> 00:17:16,170
шукаю тэг, які не
ёсць які зачыняе тэг.

386
00:17:16,170 --> 00:17:19,410
Гэта клічнік DOCTYPE HTML.

387
00:17:19,410 --> 00:17:23,300
Так HTML быў прыкладна з
пачатку 1990-х для будаўніцтва вэб-старонак,

388
00:17:23,300 --> 00:17:25,859
і ён пайшоў зведалі
шэраг змяненняў з тых часоў.

389
00:17:25,859 --> 00:17:28,550
Зусім нядаўна ў 2014 годзе
ён прайшоў рэвізію

390
00:17:28,550 --> 00:17:33,440
называецца HTML5, які ў цяперашні час з'яўляецца ток
роду дэ-факта стандартам HTML.

391
00:17:33,440 --> 00:17:36,730
>> Каб паказаць, што наш вэб-
старонкі, напісаныя з выкарыстаннем HTML5,

392
00:17:36,730 --> 00:17:38,160
гэта, як мы пачынаем.

393
00:17:38,160 --> 00:17:40,380
Гэта можа быць апушчана, але
тое, што, што ў асноўным

394
00:17:40,380 --> 00:17:45,930
азначае, што вы не можаце выкарыстоўваць любы з тэгаў
якія HTML5 тэгі, гэтыя новыя тэгі.

395
00:17:45,930 --> 00:17:48,591
Такім чынам, мы заўсёды пачаць
калі мы з дапамогай HTML5.

396
00:17:48,591 --> 00:17:51,340
І ўсё тэгі мы гаварылі пра
якія раней не HTML5 тэгі.

397
00:17:51,340 --> 00:17:55,470
Але гэта азначала б, што
HTML5-тэгі будуць прысутнічаць.

398
00:17:55,470 --> 00:17:58,400
І таму мы павінны ўсклік
DOCTYPE HTML, які

399
00:17:58,400 --> 00:18:01,280
знаходзіцца ў самым пачатку нашага
HTML-файл, а затым, пасля кропкі, што

400
00:18:01,280 --> 00:18:04,930
мы на самай справе ёсць адкрыты наш HTML-
пазначыць і перайсці адтуль.

401
00:18:04,930 --> 00:18:10,050
>> Апошняя з'яўляецца тэг каментара,
які выглядае трохі адрозніваецца, таксама.

402
00:18:10,050 --> 00:18:12,810
Яна пачынаецца з кута
Кранштэйны клічнік працяжнік

403
00:18:12,810 --> 00:18:15,220
працяжнік, але не зачыняе дужка.

404
00:18:15,220 --> 00:18:20,150
У паміж гэтымі двума элементамі там
дзе вы пішаце свае каментары.

405
00:18:20,150 --> 00:18:28,420
І давайце зірнем на малюнак,
Каментары і спасылкі ў і CS50 IDE.

406
00:18:28,420 --> 00:18:32,850
>> Так што я тут файл называецца спасылка з выяваў
кропка HTML, які я збіраюся адкрыць.

407
00:18:32,850 --> 00:18:36,420
І заўважце, я атрымаў пару
каментары тут, у маіх HTML каментары.

408
00:18:36,420 --> 00:18:38,990
Гэтак жа, як у C і іншых
мовы праграмавання,

409
00:18:38,990 --> 00:18:43,169
HTML толькі будучы мова разметкі
сапраўды ёсць здольнасць мець каментары.

410
00:18:43,169 --> 00:18:45,710
І таму я, па-відаць збіраецца
размясціць карціну Рык Эстлі

411
00:18:45,710 --> 00:18:49,060
дзесьці паміж гэтай DIV
тэг, гэта адвольнае падзел.

412
00:18:49,060 --> 00:18:51,497
Мабыць, што файл
размешчаны ў Рык кропка JPEG, які

413
00:18:51,497 --> 00:18:53,580
калі мы вяртаемся да
мой дрэва файлаў на секунду,

414
00:18:53,580 --> 00:18:55,490
гэта файл, які існуе ў
бягучы каталог.

415
00:18:55,490 --> 00:18:56,031
Так што ўсё нармальна.

416
00:18:56,031 --> 00:18:57,710
Я магу спаслацца на яго.

417
00:18:57,710 --> 00:18:59,680
>> Тады я магу мець ўнутраныя спасылкі.

418
00:18:59,680 --> 00:19:05,080
Так заўважыць у радку 11 тут
мой HREF з'яўляецца прывітанне кропка HTML.

419
00:19:05,080 --> 00:19:09,050
Так што проста ставіцца да прывітанне кропка HTML
якая існуе ў бягучым каталогу.

420
00:19:09,050 --> 00:19:12,980
І я магу таксама знешні
спасылкі па пратаколе HTTPS толькі з указаннем

421
00:19:12,980 --> 00:19:16,180
каб паказаць, што я не кажу
аб файле ў маім бягучым каталогу.

422
00:19:16,180 --> 00:19:19,730
Я кажу пра тое, што файл існуе
дзесьці на інтэрнэце, якія я

423
00:19:19,730 --> 00:19:23,370
прасіць па пратаколе HTTP.

424
00:19:23,370 --> 00:19:25,990
>> Такім чынам, давайце зірнем на тое, што
Гэтая старонка можа выглядаць

425
00:19:25,990 --> 00:19:29,500
і атрымаць гатовы для карціны Рык
Эстлі, каб паказаць на экране.

426
00:19:29,500 --> 00:19:31,490
Так што я буду праглядаць гэта.

427
00:19:31,490 --> 00:19:33,800
Там Рык Эстлі гэта на
вельмі зверху ў гэтым адвольнае

428
00:19:33,800 --> 00:19:35,008
падзел я паклаў яго на вяршыні.

429
00:19:35,008 --> 00:19:36,960
А потым унізе I
мае спасылкі, праўда?

430
00:19:36,960 --> 00:19:39,330
>> У мяне ёсць спасылка на прывітанне кропка HTML.

431
00:19:39,330 --> 00:19:42,860
І калі я націскаю, што я атрымліваю
перайшоў на гэтай старонцы

432
00:19:42,860 --> 00:19:47,050
што мы вельмі добра знаёмыя з з
у самым пачатку нашай праграмы.

433
00:19:47,050 --> 00:19:50,880
Калі я поп гэтую старонку адкрытай зноў, калі я
поп спасылка з выяваў адкрыць яшчэ адзін раз,

434
00:19:50,880 --> 00:19:54,420
Я таксама магу перайсці вонкава
на сайт CS50 ст.

435
00:19:54,420 --> 00:19:56,740
І там мы будзем see-- я
паменшыць трохі here--

436
00:19:56,740 --> 00:20:00,260
мы ўбачым Вэбсайт Сартаваць CS50-х
ўбудаваны ў сярэдзіне старонцы.

437
00:20:00,260 --> 00:20:04,670
Так што я быў у стане зрабіць ўнутраны
звязаць, а таксама па знешняй спасылцы.

438
00:20:04,670 --> 00:20:07,200
>> Апошняе правіла з HTML, што
мы будзем казаць аб тут

439
00:20:07,200 --> 00:20:09,510
з'яўляецца тое, што ваш HTML-павінны быць добра сфармаваныя.

440
00:20:09,510 --> 00:20:13,020
У C мы шмат гаварылі пра
розныя сінтаксіс рэчаў.

441
00:20:13,020 --> 00:20:17,650
У HTML сінтаксіс сапраўды
круціцца вакол тэгаў.

442
00:20:17,650 --> 00:20:19,660
Кожны тэг адкрыцці павінен быць зачынены.

443
00:20:19,660 --> 00:20:22,630
І на самай справе, кожны тэг адкрыцці
павінны быць зачыненыя ў зваротным парадку.

444
00:20:22,630 --> 00:20:25,790
>> Так што, калі вы адкрываеце тэг, Курсіўны
тэг, а затым падкрэсліванне тэг

445
00:20:25,790 --> 00:20:28,120
каб зрабіць усё тры да А
Канкрэтны набор тэксту,

446
00:20:28,120 --> 00:20:30,070
вы павінны зачыніць іх у адваротным парадку.

447
00:20:30,070 --> 00:20:32,270
Так што, калі вы адкрылі смелы,
курсіў, падкрэсленне, вы

448
00:20:32,270 --> 00:20:35,240
Каб закрыць падкрэслення, курсіў, паўтлусты.

449
00:20:35,240 --> 00:20:39,990
Гэта свайго роду інкапсуляцыі, што
трымае HTML прыгожа і арганізавана.

450
00:20:39,990 --> 00:20:44,370
>> У адрозненне ад C, хоць, сінтаксічныя памылкі не будзе
на самай справе калечыць ваш HTML, магчыма ,.

451
00:20:44,370 --> 00:20:48,730
Ваш HTML-можа быць не добра
фармуецца, але будзе працаваць.

452
00:20:48,730 --> 00:20:50,589
І так гэтыя памылкі
сартаваць слайд па.

453
00:20:50,589 --> 00:20:52,130
Гэта да вас, каб сапраўды быць пільнымі.

454
00:20:52,130 --> 00:20:54,760
Часам яны не змогуць, але
часам вы можаце атрымаць разам з ім.

455
00:20:54,760 --> 00:20:56,509
>> Гэта можа быць сапраўды
складаная задача, хоць,

456
00:20:56,509 --> 00:21:00,660
каб адсочваць, калі вы адкрылі
тэг, калі вы закрылі яго,

457
00:21:00,660 --> 00:21:04,110
асабліва ў якасці HTML
файлы становяцца больш і больш.

458
00:21:04,110 --> 00:21:05,490
Вы хочаце некаторую дапамогу.

459
00:21:05,490 --> 00:21:07,560
І ёсць онлайн
валідатар інструменты, якія вы

460
00:21:07,560 --> 00:21:11,474
можна выкарыстоўваць, каб зірнуць на свой вэб
старонка і паглядзець, калі гэта добра сфармаваныя HTML.

461
00:21:11,474 --> 00:21:13,390
І вы павінны, безумоўна,
зірнуць на тых,

462
00:21:13,390 --> 00:21:16,620
і пачаць выкарыстоўваць іх, як вы
пачаць рабіць некаторую працу з HTML,

463
00:21:16,620 --> 00:21:20,800
пісаць HTML, толькі так вы атрымаеце
некаторыя добрыя звычкі аб арганізацыі

464
00:21:20,800 --> 00:21:24,377
Ваш HTML у добрым сэнсе і
добры стыль і пераканаўшыся,

465
00:21:24,377 --> 00:21:27,210
што вы не робіце нічога, што
можа стварыць сінтаксічную памылку, што

466
00:21:27,210 --> 00:21:30,270
выкліча вам крыху
праблема па дарозе.

467
00:21:30,270 --> 00:21:31,190
>> Я Дуг Лойд.

468
00:21:31,190 --> 00:21:33,450
Гэта CS50.

469
00:21:33,450 --> 00:21:34,859