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

2
00:00:06,100 --> 00:00:08,790
>> DOUG LLOYD: Então nós gastamos
about-- se minha matemática é certo,

3
00:00:08,790 --> 00:00:11,900
e eu acho que eu acho que olhando traseira--
passamos cerca de 35 vídeos falando

4
00:00:11,900 --> 00:00:15,139
sobre vários aspectos do C, talvez
um pouco mais, talvez um pouco menos.

5
00:00:15,139 --> 00:00:16,930
E nós não cobrimos
tudo em C, mas nós

6
00:00:16,930 --> 00:00:21,170
cobriram uma grande parte do
língua, a grande maioria da mesma,

7
00:00:21,170 --> 00:00:22,882
certamente para usos comuns.

8
00:00:22,882 --> 00:00:25,090
Agora nós estamos indo falar
sobre outra língua, HTML.

9
00:00:25,090 --> 00:00:28,180
E nós estamos indo para cobrir
em que apenas um de vídeo.

10
00:00:28,180 --> 00:00:29,340
>> Mas isso vai ser OK.

11
00:00:29,340 --> 00:00:31,410
Isso vai realmente tornar-se
algo que você vai se acostumar.

12
00:00:31,410 --> 00:00:33,535
Agora que você tem a
fundamentos de uma língua,

13
00:00:33,535 --> 00:00:35,776
é realmente muito fácil
para começar a aprender outros.

14
00:00:35,776 --> 00:00:37,650
Então, nós estamos indo para começar
para a etapa um pouco para trás

15
00:00:37,650 --> 00:00:43,340
e encobrir o básico
diferenças entre línguas

16
00:00:43,340 --> 00:00:45,750
e tipo de deixá-lo a ele.

17
00:00:45,750 --> 00:00:48,530
Há um monte de realmente grande
recursos na internet, o que

18
00:00:48,530 --> 00:00:51,279
vamos começar a dirigir você
no sentido porque a internet é

19
00:00:51,279 --> 00:00:53,340
um vasto repositório de informações.

20
00:00:53,340 --> 00:00:55,960
E assim não é como você vai
estar perdendo necessariamente

21
00:00:55,960 --> 00:00:58,349
por não ter a informação
coberto em um vídeo.

22
00:00:58,349 --> 00:01:00,640
Você ainda será capaz de obter
tudo que você precisa e uso

23
00:01:00,640 --> 00:01:03,590
o conhecimento que você já
construiu-se por entender C

24
00:01:03,590 --> 00:01:07,130
para fazer a curva de aprendizado para estes
outras línguas, na verdade, um monte mais planas.

25
00:01:07,130 --> 00:01:08,640
Eu prometo.

26
00:01:08,640 --> 00:01:12,770
>> Mas vamos falar sobre uma linguagem
que é realmente fundamental para todos os web

27
00:01:12,770 --> 00:01:14,830
A página, que é HTML.

28
00:01:14,830 --> 00:01:18,230
HTML é o Hyper Text Markup Language.

29
00:01:18,230 --> 00:01:22,700
HTML é uma linguagem, mas é
não uma linguagem de programação.

30
00:01:22,700 --> 00:01:23,900
>> HTML não tem variáveis.

31
00:01:23,900 --> 00:01:26,430
Não tem lógica ou
funções ou qualquer coisa assim.

32
00:01:26,430 --> 00:01:30,301
Nós não podemos fazer qualquer
programação, por si só em HTML.

33
00:01:30,301 --> 00:01:32,300
Às vezes você vai ouvir
as pessoas descrevem-se

34
00:01:32,300 --> 00:01:35,710
como programadores HTML, que
não é totalmente preciso.

35
00:01:35,710 --> 00:01:37,980
Não podemos escrever programas HTML.

36
00:01:37,980 --> 00:01:40,770
>> HTML é usado apenas para marcar texto.

37
00:01:40,770 --> 00:01:42,690
É chamado de linguagem de marcação.

38
00:01:42,690 --> 00:01:47,680
E o que este does-- este markup--
nós usar tags em HTML e estes tags--

39
00:01:47,680 --> 00:01:51,600
este markup-- semanticamente
define a estrutura de uma página

40
00:01:51,600 --> 00:01:55,280
e faz com que o texto simples que
existe entre as etiquetas para serem interpretados

41
00:01:55,280 --> 00:01:57,320
por navegadores de maneiras diferentes.

42
00:01:57,320 --> 00:02:00,370
E talvez seja melhor para explicar
Desta forma, por de uma ilustração.

43
00:02:00,370 --> 00:02:06,450
>> Aqui está uma página HTML muito simples, não
um programa de HTML, novamente, uma página HTML.

44
00:02:06,450 --> 00:02:08,680
E nós sabemos que é uma
A página HTML, porque nós temos

45
00:02:08,680 --> 00:02:11,480
delimitada tudo com tags HTML.

46
00:02:11,480 --> 00:02:13,850
Então é isso que uma tag HTML parece.

47
00:02:13,850 --> 00:02:15,870
É entre colchetes.

48
00:02:15,870 --> 00:02:18,570
E repare no topo temos
HTML e na parte inferior,

49
00:02:18,570 --> 00:02:21,400
depois que fizemos o que é
aparentemente um monte de outras HTML,

50
00:02:21,400 --> 00:02:24,310
temos ângulo do suporte de barra HTML.

51
00:02:24,310 --> 00:02:29,262
Então que tipo de é o limite
entre o que é HTML eo que não é.

52
00:02:29,262 --> 00:02:32,220
E, claro, convencionalmente, apenas
como você escreveu todos os seus programas C

53
00:02:32,220 --> 00:02:35,300
com extensões ponto C,
todos os seus arquivos HTML

54
00:02:35,300 --> 00:02:37,909
vai acabar com extensões HTML ponto.

55
00:02:37,909 --> 00:02:39,200
Mas há mais acontecendo aqui.

56
00:02:39,200 --> 00:02:40,658
Nós não apenas temos estas tags HTML.

57
00:02:40,658 --> 00:02:44,010
Nós aparentemente têm este
coisa chamada uma marca de cabeça.

58
00:02:44,010 --> 00:02:46,010
Bem, OK, o que é isso?

59
00:02:46,010 --> 00:02:48,550
>> Bem, talvez é melhor
distinguir por meio de um corpo,

60
00:02:48,550 --> 00:02:50,590
corpo sendo o conteúdo da página web.

61
00:02:50,590 --> 00:02:55,860
Então, talvez a marca de cabeça define stuff
que não está na janela do navegador próprio,

62
00:02:55,860 --> 00:02:59,410
mas é de alguma forma importante para o nosso
A página web que está sendo processado corretamente.

63
00:02:59,410 --> 00:03:02,490
Por exemplo, no interior da
tag cabeça temos tags de título.

64
00:03:02,490 --> 00:03:05,500
>> Então título sendo Olá mundo,
que realmente vai ser o que

65
00:03:05,500 --> 00:03:08,797
mostra-se na aba no Chrome
ou no safari ou Firefox--

66
00:03:08,797 --> 00:03:11,880
o que quer que você prefer-- navegador que é
o que vai aparecer no título.

67
00:03:11,880 --> 00:03:14,800
E antes que ele iria mostrar tabs
em sua janela do browser

68
00:03:14,800 --> 00:03:19,710
e você só pode ter uma página
abrir em uma janela do navegador em um momento.

69
00:03:19,710 --> 00:03:22,160
Então isso vai ser o
título da minha página na aba

70
00:03:22,160 --> 00:03:24,600
ou a barra de janela do navegador, Olá mundo.

71
00:03:24,600 --> 00:03:28,611
E, em seguida, o conteúdo do meu
A página web será mundial, Olá.

72
00:03:28,611 --> 00:03:31,360
Então, vamos dar uma olhada no que alguns
coisa como isto pode parecer.

73
00:03:31,360 --> 00:03:33,210
Esta é uma página HTML muito simples.

74
00:03:33,210 --> 00:03:35,970
Então, eu estou aqui no meu IDE e CS50
Eu ampliada um pouco.

75
00:03:35,970 --> 00:03:38,290
E eu estou indo só para
abrir Olá dot HTML

76
00:03:38,290 --> 00:03:42,000
e mostrar-lhe que isso é muito bonito
o conteúdo da página que vimos antes.

77
00:03:42,000 --> 00:03:45,240
Minhas tags HTML, cabeça simples,
tags de título, corpo e assim por diante.

78
00:03:45,240 --> 00:03:47,320
Eu tenho recuado para ser limpo.

79
00:03:47,320 --> 00:03:51,530
>> E então o que posso fazer na minha
IDE é apenas visualizar a página.

80
00:03:51,530 --> 00:03:52,630
E lá vamos nós.

81
00:03:52,630 --> 00:03:56,070
O conteúdo da página é meu mundo,
Olá, e eu não vejo nada

82
00:03:56,070 --> 00:03:58,500
in a partir das tags cabeça lá.

83
00:03:58,500 --> 00:03:59,980
É apenas o conteúdo do corpo.

84
00:03:59,980 --> 00:04:00,780
Mundo, Olá.

85
00:04:00,780 --> 00:04:03,700
E mais uma vez o corpo apenas
disse, mundo, Olá.

86
00:04:03,700 --> 00:04:06,160
A outra parte está em falta.

87
00:04:06,160 --> 00:04:07,610
>> Então, isso é realmente tudo o que é.

88
00:04:07,610 --> 00:04:11,370
Esta é uma página HTML básico muito simples.

89
00:04:11,370 --> 00:04:14,280
Agora eu tenho minha recuado para HTML
ser muito bom e organizado,

90
00:04:14,280 --> 00:04:15,840
mas eu realmente não precisa.

91
00:04:15,840 --> 00:04:17,959
Eu poderia fazê-lo parecer muito feio.

92
00:04:17,959 --> 00:04:19,467
E isso ainda iria funcionar.

93
00:04:19,467 --> 00:04:21,050
Esta seria a mesma página da web exato.

94
00:04:21,050 --> 00:04:23,100
Acabei de se livrado
todo o espaço em branco.

95
00:04:23,100 --> 00:04:24,820
>> Como se constata, o espaço em branco é de dados.

96
00:04:24,820 --> 00:04:28,540
E assim, quando estamos enviando dados de
emissor para o receptor, a partir do servidor

97
00:04:28,540 --> 00:04:30,670
para o cliente, os dados custa dinheiro.

98
00:04:30,670 --> 00:04:34,460
E assim se livrar de espaços em branco
é realmente uma boa idéia

99
00:04:34,460 --> 00:04:37,320
se você é alguém que serve
uma grande quantidade de conteúdo da web.

100
00:04:37,320 --> 00:04:39,820
É uma má idéia se você estiver
alguém que está aprendendo este material

101
00:04:39,820 --> 00:04:41,528
e você quer ter
-lo muito bem organizado.

102
00:04:41,528 --> 00:04:43,810
Isto é muito mais fácil de analisar do que isso.

103
00:04:43,810 --> 00:04:45,540
Mas é funcionalmente idêntico.

104
00:04:45,540 --> 00:04:48,720
>> O recuo e coisas assim
na verdade, não importa em HTML.

105
00:04:48,720 --> 00:04:53,634
Tudo o que importa é marcas de abertura e
fechando as tags na ordem correta.

106
00:04:53,634 --> 00:04:55,050
Observe o que aconteceu aqui, no entanto.

107
00:04:55,050 --> 00:04:58,450
A marcação nos dá uma maneira de
comunicar informação extra

108
00:04:58,450 --> 00:04:59,940
sobre o que você escreveu.

109
00:04:59,940 --> 00:05:03,130
A parte Olá, mundo foi
interpretado como o título.

110
00:05:03,130 --> 00:05:06,410
E o mundo, Olá parte foi
interpretado como o conteúdo

111
00:05:06,410 --> 00:05:09,090
ou o que deveria ser
visível na minha página web.

112
00:05:09,090 --> 00:05:12,167
>> Existem mais de 100 destes diferentes
tags e lotes de grandes recursos

113
00:05:12,167 --> 00:05:13,000
online para encontrá-los.

114
00:05:13,000 --> 00:05:14,900
Nós vamos falar sobre um
alguns deles neste vídeo, alguns

115
00:05:14,900 --> 00:05:16,440
do material realmente fundamental.

116
00:05:16,440 --> 00:05:18,440
Mas não vamos falar
sobre tudo porque

117
00:05:18,440 --> 00:05:20,250
seria exaustiva a fazê-lo.

118
00:05:20,250 --> 00:05:22,880
>> Outra coisa que você pode fazer, porém,
é abrir ferramentas para desenvolvedores.

119
00:05:22,880 --> 00:05:26,069
E se você se lembra de
nosso vídeo em HTTP,

120
00:05:26,069 --> 00:05:27,860
Expliquei como abrir
se ferramentas para desenvolvedores.

121
00:05:27,860 --> 00:05:32,020
No Chrome é geralmente a tecla F12
para abrir a barra de ferramentas do desenvolvedor.

122
00:05:32,020 --> 00:05:35,909
Em seguida, em vez de escolher a rede
guia, você pode escolher o separador Elementos.

123
00:05:35,909 --> 00:05:37,700
E se você carregar uma web
página, você vai realmente

124
00:05:37,700 --> 00:05:40,280
ver o HTML que cria a página web.

125
00:05:40,280 --> 00:05:44,090
E assim você pode aprender muito sobre HTML
vendo os seus sites favoritos

126
00:05:44,090 --> 00:05:48,474
e vendo como eles constroem a
várias peças dos que você gosta.

127
00:05:48,474 --> 00:05:50,890
Então talvez haja este legal
padrão ou algo parecido.

128
00:05:50,890 --> 00:05:52,140
Como eles fazem isso com HTML?

129
00:05:52,140 --> 00:05:55,630
Bem, você pode simplesmente abrir o seu desenvolvedor
ferramentas e pairar sobre esse elemento

130
00:05:55,630 --> 00:05:57,700
e ver exatamente o que faz com que seja HTML.

131
00:05:57,700 --> 00:05:59,450
Então, isso é realmente um
boa maneira de aprender HTML,

132
00:05:59,450 --> 00:06:02,330
e eu recomendo fortemente que
você fazê-lo tanto para aprender HTML

133
00:06:02,330 --> 00:06:04,930
e também para aprender um pouco
pouco sobre algumas das opções

134
00:06:04,930 --> 00:06:07,050
disponíveis para você em
ferramentas de desenvolvimento, que

135
00:06:07,050 --> 00:06:10,200
certamente virá a calhar como
você começar a fazer web mais intensiva

136
00:06:10,200 --> 00:06:11,090
programação.

137
00:06:11,090 --> 00:06:14,080
>> Então, vamos dar uma olhada em um
par de tags HTML comuns.

138
00:06:14,080 --> 00:06:17,210
E nós vamos saltar e dar uma olhada em
o que essas marcas também irá processar

139
00:06:17,210 --> 00:06:20,490
como por olhar para alguns arquivos na minha IDE.

140
00:06:20,490 --> 00:06:26,330
Então, aqui estão três marcas muito básicos para
aprimorando o aspecto visual do texto.

141
00:06:26,330 --> 00:06:29,050
Há marcas B, I e U tags, tags.

142
00:06:29,050 --> 00:06:33,170
E, respectivamente, o que eles fazem é
tornar o texto entre eles em negrito,

143
00:06:33,170 --> 00:06:35,430
itálico, sublinhado e.

144
00:06:35,430 --> 00:06:40,430
Então vamos ver o que isso ficaria
como em uma página web real no meu IDE.

145
00:06:40,430 --> 00:06:43,390
>> Então, aqui no meu IDE Eu tenho um
arquivo chamado BIU dot HTML.

146
00:06:43,390 --> 00:06:46,770
BIU dot HTML apenas a ser
negrito, itálico, sublinhado.

147
00:06:46,770 --> 00:06:47,830
Eu vou abri-lo.

148
00:06:47,830 --> 00:06:51,810
>> E nós vamos ver que aqui eu
temos este texto é Tag B negrito.

149
00:06:51,810 --> 00:06:54,010
Este texto é tags de E itálico.

150
00:06:54,010 --> 00:06:56,307
E este texto é U marcas sublinhado.

151
00:06:56,307 --> 00:06:57,640
O que é que isto vai parecer?

152
00:06:57,640 --> 00:06:59,473
Bem mais uma vez, tudo o que tenho
fazer é passar por cima aqui

153
00:06:59,473 --> 00:07:04,690
para o meu navegador, o meu navegador de arquivos, clique em
Preview, e isso é o que vem à tona.

154
00:07:04,690 --> 00:07:07,520
>> O texto entre a B
Tag é de fato agora negrito.

155
00:07:07,520 --> 00:07:10,720
O texto entre o I
Tag é de fato agora itálico.

156
00:07:10,720 --> 00:07:14,634
E o texto entre o U
tags é realmente agora sublinhado.

157
00:07:14,634 --> 00:07:15,550
Então, isso é muito bom.

158
00:07:15,550 --> 00:07:18,450
Agora sabemos como fazer texto
olhar um pouco mais extravagante

159
00:07:18,450 --> 00:07:20,360
ou desenhar ênfase a certas coisas.

160
00:07:20,360 --> 00:07:25,530
Outro par de tags comuns aqui são
marcas de parágrafo, marcas P, e cabeçalho,

161
00:07:25,530 --> 00:07:27,980
que eu tenho rendido aqui como HX.

162
00:07:27,980 --> 00:07:32,520
>> Essas marcas P, estas tags de parágrafo,
quebrar o seu texto em parágrafos.

163
00:07:32,520 --> 00:07:34,646
Não é suficiente apenas
pressione Enter e deixar espaços,

164
00:07:34,646 --> 00:07:37,186
porque um computador está indo somente
para fazer o que você diga a ele para fazer

165
00:07:37,186 --> 00:07:39,450
e ignora branco
espaço para a maior parte.

166
00:07:39,450 --> 00:07:41,636
Portanto, não podemos simplesmente pressionar enter
e esperamos que o nosso computador

167
00:07:41,636 --> 00:07:43,760
interpretar que queremos
para iniciar um novo parágrafo.

168
00:07:43,760 --> 00:07:47,670
Nós temos que dizer muito explicitamente esta
é um paragraph-- este é another--

169
00:07:47,670 --> 00:07:50,740
colocando cada um em um conjunto de tags P.

170
00:07:50,740 --> 00:07:54,560
>> E também temos essas opções
para H tags, essas tags de cabeçalho.

171
00:07:54,560 --> 00:07:57,000
Temos seis níveis diferentes
de cabeçalhos, um, dois, três,

172
00:07:57,000 --> 00:08:01,110
quatro, cinco e seis, que são
progressivamente maior e maior

173
00:08:01,110 --> 00:08:01,710
cabeçalhos.

174
00:08:01,710 --> 00:08:04,360
E eles ficam menores e
cada vez menores e menores.

175
00:08:04,360 --> 00:08:07,690
Portanto, temos um cabeçalho de nível superior, uma segunda
cabeçalho de nível, e assim por diante, e assim por diante.

176
00:08:07,690 --> 00:08:10,480
>> Vamos dar uma olhada em alguns talvez
Marcas P e algumas tags de cabeçalho

177
00:08:10,480 --> 00:08:13,110
na ação em uma página web.

178
00:08:13,110 --> 00:08:18,180
Então, aqui no meu IDE Eu tenho um arquivo chamado
HTML ponto PH, PH sendo parágrafos

179
00:08:18,180 --> 00:08:18,970
e tags de cabeçalho.

180
00:08:18,970 --> 00:08:20,709
Abra isso.

181
00:08:20,709 --> 00:08:23,000
Há muita coisa acontecendo aqui
porque eu coloquei alguns lorem

182
00:08:23,000 --> 00:08:24,660
ipsum, apenas algum texto aleatório aqui.

183
00:08:24,660 --> 00:08:27,284
Então, eu vou reduzir um pouco
porque há tanta coisa acontecendo.

184
00:08:27,284 --> 00:08:31,980
Mas observe que eu tenho no próprio
top aqui eu tenho um H1, um nível um,

185
00:08:31,980 --> 00:08:32,802
tag de cabeçalho.

186
00:08:32,802 --> 00:08:36,010
Então eu tenho um parágrafo, que é apenas
um bando de aleatório lorem texto-- ipsum--

187
00:08:36,010 --> 00:08:38,720
apenas o padrão de enchimento padrão em texto.

188
00:08:38,720 --> 00:08:41,970
Então, eu tenho dois parágrafos dentro desse
um cabeçalho de nível e, em seguida, para baixo abaixo I

189
00:08:41,970 --> 00:08:46,850
tem um cabeçalho de nível dois aqui na linha 24,
um segundo nível de cabeçalho, e outros dois

190
00:08:46,850 --> 00:08:47,840
parágrafos.

191
00:08:47,840 --> 00:08:51,910
Bem, o que faz este olhar como
se eu vê-lo na minha pré-visualização?

192
00:08:51,910 --> 00:08:53,790
Vamos ver.

193
00:08:53,790 --> 00:08:55,730
>> Então, observe que o
primeiro cabeçalho nível aqui

194
00:08:55,730 --> 00:08:58,420
é na verdade um pouco maior
do que o segundo nível de cabeçalho.

195
00:08:58,420 --> 00:08:59,940
Então nós usamos tags H1.

196
00:08:59,940 --> 00:09:03,820
E note que as tags P permitem-nos
para quebrar as coisas em parágrafos.

197
00:09:03,820 --> 00:09:07,500
Se tivéssemos se livrado dessas marcas P
e, na verdade, basta colocar Entra e Devoluções

198
00:09:07,500 --> 00:09:10,110
entre o que esperávamos que
ser diferentes números,

199
00:09:10,110 --> 00:09:13,193
todos iriam apenas bater juntos e
ele não teria esse parágrafo agradável

200
00:09:13,193 --> 00:09:15,840
separação com o espaço acima e abaixo.

201
00:09:15,840 --> 00:09:18,300
E é isso que n
etiquetas e tags de cabeçalho

202
00:09:18,300 --> 00:09:22,440
são comumente usados ​​para fazer desenhar
atenção para partes de nossa página web

203
00:09:22,440 --> 00:09:23,550
dessa forma.

204
00:09:23,550 --> 00:09:27,560
>> Em seguida estão algumas tags que usamos
para construir listas em nossa página web.

205
00:09:27,560 --> 00:09:30,820
Portanto, temos não ordenada
lists-- ULs-- que são apenas

206
00:09:30,820 --> 00:09:34,090
listas com marcadores, ordenados
lista que estão numbered--

207
00:09:34,090 --> 00:09:37,680
OLs-- e dentro de uma das
um daqueles que precisamos ter

208
00:09:37,680 --> 00:09:40,600
conjuntos de como indicar itens de lista, LI.

209
00:09:40,600 --> 00:09:44,370
E assim temos aberto tag UL
e nós colocamos itens dentro dela.

210
00:09:44,370 --> 00:09:46,920
E então, quando estamos a fazer com
que, podemos fechar a marca UL.

211
00:09:46,920 --> 00:09:49,850
>> E da mesma forma que podemos ter
uma lista ordenada ou numerada

212
00:09:49,850 --> 00:09:51,560
e colocar os itens da lista dentro disso.

213
00:09:51,560 --> 00:09:53,350
Então, vamos dar uma olhada
em um par de listas

214
00:09:53,350 --> 00:09:57,230
eo que eles iriam
renda como em CS50 IDE.

215
00:09:57,230 --> 00:10:00,640
Então, eu tenho aqui na minha IDE um
arquivo chamado listas dot HTML.

216
00:10:00,640 --> 00:10:03,100
Vamos dar uma olhada.

217
00:10:03,100 --> 00:10:08,482
>> E notem aqui eu tenho uma desordenada
lista com cinco coisas nele.

218
00:10:08,482 --> 00:10:11,440
E então eu tenho uma lista ordenada, e
Eu mudei a marca um pouco,

219
00:10:11,440 --> 00:10:11,939
certo?

220
00:10:11,939 --> 00:10:13,152
Eu já disse início é igual a seis.

221
00:10:13,152 --> 00:10:16,110
Acontece com uma lista Eu pedi
pode definir o ponto de partida onde quer

222
00:10:16,110 --> 00:10:20,130
Eu want-- por padrão, ele será um--
apenas adicionando esta chamada atributo

223
00:10:20,130 --> 00:10:21,190
na minha tag OL.

224
00:10:21,190 --> 00:10:23,572
E assim esta lista será
começar a contar às seis.

225
00:10:23,572 --> 00:10:26,780
Assim, os elementos dessa lista numerada
deve ser de seis, sete, oito, nove, dez,

226
00:10:26,780 --> 00:10:29,930
porque existem cinco elementos
na lista, em oposição a um,

227
00:10:29,930 --> 00:10:33,770
dois, três, quatro, cinco, que
seria o caso se eu tivesse dito OL

228
00:10:33,770 --> 00:10:36,730
sem especificar o atributo de início.

229
00:10:36,730 --> 00:10:41,594
>> Então vamos visualizar isso para que você pode
obter um sentido para o que está acontecendo aqui.

230
00:10:41,594 --> 00:10:42,260
E lá vamos nós.

231
00:10:42,260 --> 00:10:44,610
Não é a minha lista.

232
00:10:44,610 --> 00:10:47,810
Os primeiros elementos são cinco
listas desordenadas ou com marcadores.

233
00:10:47,810 --> 00:10:51,010
E os próximos cinco elementos
são uma lista ordenada separado

234
00:10:51,010 --> 00:10:52,980
a partir de seis.

235
00:10:52,980 --> 00:10:56,247
Então é assim que pudermos
construir listas usando HTML.

236
00:10:56,247 --> 00:10:58,080
Outra coisa que você pode
querem fazer com HTML

237
00:10:58,080 --> 00:11:01,520
é construir uma tabela de
informações de linhas e colunas

238
00:11:01,520 --> 00:11:04,560
para apresentar a informação em uma
particularmente organizada caminho.

239
00:11:04,560 --> 00:11:09,110
Para fazer isso com HTML, podemos ter uma
definição de tabela começando suporte aberto

240
00:11:09,110 --> 00:11:10,160
mesa.

241
00:11:10,160 --> 00:11:14,680
E, em seguida, dentro desse quadro que
pode ter um conjunto de linhas, tags TR

242
00:11:14,680 --> 00:11:15,980
para indicar cada linha.

243
00:11:15,980 --> 00:11:22,510
E então as tags TD ir para dentro de tags de TR
para especificar uma coluna dentro de uma linha.

244
00:11:22,510 --> 00:11:24,340
>> Por que é chamado TD e não TC?

245
00:11:24,340 --> 00:11:25,940
Bem, TD representa dados da tabela.

246
00:11:25,940 --> 00:11:27,900
Normalmente, você está colocando
sua informação lá.

247
00:11:27,900 --> 00:11:29,440
Então é por isso que é TD e não TC.

248
00:11:29,440 --> 00:11:31,140
É um pouco confuso.

249
00:11:31,140 --> 00:11:33,720
>> Então você tem marcas de tabela e
dentro de suas tags de mesa

250
00:11:33,720 --> 00:11:35,600
você tem um número de linhas, TRs.

251
00:11:35,600 --> 00:11:40,030
E dentro de cada linha que você tem
TDS para o número de colunas

252
00:11:40,030 --> 00:11:42,880
que você quer ter
nessa linha particular.

253
00:11:42,880 --> 00:11:47,730
Vamos dar uma olhada em um muito
tabela simples sobre em CS50 IDE.

254
00:11:47,730 --> 00:11:49,730
>> Então, eu tenho aqui um arquivo
chamada tabela de pontos HTML.

255
00:11:49,730 --> 00:11:53,390
Vamos dar uma olhada
o que parece.

256
00:11:53,390 --> 00:11:56,225
Há muita coisa acontecendo aqui, mas
se você notar que eu tenho uma tabela aberta.

257
00:11:56,225 --> 00:11:57,850
Estou começando com a definição de tabela.

258
00:11:57,850 --> 00:12:02,100
E então, em minha primeira linha I aparentemente
tem quatro colunas, um, dois, três,

259
00:12:02,100 --> 00:12:02,660
quatro.

260
00:12:02,660 --> 00:12:04,290
E então eu estou feito com essa linha.

261
00:12:04,290 --> 00:12:07,750
>> Então eu começo outra linha e
fazer dois, quatro, seis, oito.

262
00:12:07,750 --> 00:12:08,850
Termine essa linha.

263
00:12:08,850 --> 00:12:11,410
Faça outra linha, três, seis, nove, 12.

264
00:12:11,410 --> 00:12:14,830
E então uma última linha, quatro,
oito, 12, e que seja

265
00:12:14,830 --> 00:12:16,560
um pouco de cortar aqui, 16.

266
00:12:16,560 --> 00:12:17,710
>> Eu terminei essa linha.

267
00:12:17,710 --> 00:12:18,970
Eu terminei a mesa.

268
00:12:18,970 --> 00:12:21,430
E então eu estou feito com meu HTML.

269
00:12:21,430 --> 00:12:22,590
O que isso se parece?

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

271
00:12:26,014 --> 00:12:27,430
Bem, não é realmente muito para ver.

272
00:12:27,430 --> 00:12:31,690
Eu claramente organizado minhas informações
de uma forma um pouco mais organizado.

273
00:12:31,690 --> 00:12:33,755
Mas não é super bonita aqui.

274
00:12:33,755 --> 00:12:36,130
E nós estamos indo para lidar com
que, quando falamos de CSS.

275
00:12:36,130 --> 00:12:38,930
Vamos rever essa idéia de
o que podemos fazer para tornar um mesa--

276
00:12:38,930 --> 00:12:41,260
talvez formatá-lo um pouco melhor?

277
00:12:41,260 --> 00:12:45,070
Mas eu ainda tenho quatro linhas,
cada um dos quais tem quatro colunas,

278
00:12:45,070 --> 00:12:48,890
e realmente o que isso equivale a uma
muito simples quatro por quatro multiplicação

279
00:12:48,890 --> 00:12:49,870
mesa.

280
00:12:49,870 --> 00:12:51,690
>> Só mais algumas marcas que vamos falar.

281
00:12:51,690 --> 00:12:54,617
Vamos falar sobre o
conceito de um formulário HTML.

282
00:12:54,617 --> 00:12:57,450
Então você pode ter visto isso no
contexto de login em uma página da web.

283
00:12:57,450 --> 00:12:59,100
Normalmente você digitar seu nome de usuário.

284
00:12:59,100 --> 00:13:01,510
Você digita sua senha,
e você está pronto para ir.

285
00:13:01,510 --> 00:13:04,170
Isso seria o início de um formulário.

286
00:13:04,170 --> 00:13:05,420
>> Pulando Div um segundo.

287
00:13:05,420 --> 00:13:07,987
Nós também temos as entradas que
tipo de caber dentro de formas.

288
00:13:07,987 --> 00:13:10,320
Estes são os elementos que
na verdade você está digitando em,

289
00:13:10,320 --> 00:13:12,580
ou os botões de rádio que você está
assinalando, ou o cheque

290
00:13:12,580 --> 00:13:14,310
caixas que você está passando ao largo.

291
00:13:14,310 --> 00:13:15,770
Então, essas ir para dentro de formas.

292
00:13:15,770 --> 00:13:18,500
E eles compreendem, basicamente,
cada linha do formulário

293
00:13:18,500 --> 00:13:19,887
se o formulário está formatado bem.

294
00:13:19,887 --> 00:13:22,220
Então há esse conceito de
um div, que realmente não

295
00:13:22,220 --> 00:13:25,060
caber numa determinada categoria
de tags como os que eu

296
00:13:25,060 --> 00:13:26,170
feito anteriormente.

297
00:13:26,170 --> 00:13:29,790
É apenas uma espécie de demarca o
começando de alguns division-- arbitrária

298
00:13:29,790 --> 00:13:31,670
div-- da página.

299
00:13:31,670 --> 00:13:33,210
Não há nenhuma ruptura visual.

300
00:13:33,210 --> 00:13:34,800
Não há nenhuma linha.

301
00:13:34,800 --> 00:13:37,180
Não é definido como um off
pedaço separado automaticamente.

302
00:13:37,180 --> 00:13:39,430
Você teria que denominá-lo
que maneira de fazer isso.

303
00:13:39,430 --> 00:13:42,110
>> É apenas uma espécie de diz que eu quero um
pedaço de espaço na minha página web,

304
00:13:42,110 --> 00:13:45,190
e eu estou indo só para chamar
que esta divisão de minha página.

305
00:13:45,190 --> 00:13:47,619
Nós podemos colocar coisas dentro
de divs, e de fato,

306
00:13:47,619 --> 00:13:49,410
quando nós cabeça para
IDE em um segundo, vamos

307
00:13:49,410 --> 00:13:53,760
ver que eu estou colocando minha
formar dentro de uma div.

308
00:13:53,760 --> 00:13:57,050
>> Então, eu tenho aqui na minha IDE um
arquivo chamado div forma dot HTML.

309
00:13:57,050 --> 00:13:59,260
Vamos abri-lo.

310
00:13:59,260 --> 00:14:01,460
Observe que, como eu disse,
div é uma espécie de arbitrário.

311
00:14:01,460 --> 00:14:01,640
Certo?

312
00:14:01,640 --> 00:14:02,973
Realmente não significa nada.

313
00:14:02,973 --> 00:14:05,140
Então, eu tenho uma arbitrária
primeira divisão da minha página.

314
00:14:05,140 --> 00:14:07,848
E, em seguida, em vez de outra div
mais tarde, começando na linha oito,

315
00:14:07,848 --> 00:14:08,730
Eu tenho este formulário.

316
00:14:08,730 --> 00:14:13,594
E dentro do formulário Eu tenho um
número de entradas, os campos do formulário.

317
00:14:13,594 --> 00:14:16,510
Então, eu tenho um campo cujo nome é A--
que realmente não significa nada

318
00:14:16,510 --> 00:14:19,350
agora-- certo que, aparentemente,
leva o texto, um outro que

319
00:14:19,350 --> 00:14:22,630
toma uma senha, outro que é uma Radio
botão, outra que é uma caixa de seleção,

320
00:14:22,630 --> 00:14:24,797
e outro que é um botão Enviar.

321
00:14:24,797 --> 00:14:26,630
Bem, o que faz isso
tudo realmente se parece?

322
00:14:26,630 --> 00:14:27,629
Bem, vamos dar uma olhada.

323
00:14:27,629 --> 00:14:31,010
Vamos abri-lo na nossa janela de visualização.

324
00:14:31,010 --> 00:14:33,557
Observe que essa arbitrária
primeiro division-- há

325
00:14:33,557 --> 00:14:34,640
nenhuma separação visual aqui.

326
00:14:34,640 --> 00:14:37,150
Ele realmente não fazer nada, certo?

327
00:14:37,150 --> 00:14:38,220
>> E então eu tenho a minha forma.

328
00:14:38,220 --> 00:14:39,890
E eu não fazer qualquer formatação especial.

329
00:14:39,890 --> 00:14:42,680
Então, a forma é apenas um
grande linha de informações.

330
00:14:42,680 --> 00:14:46,424
Se eu tivesse formatado minha forma diferente,
Eu poderia tê-lo linha por linha por linha.

331
00:14:46,424 --> 00:14:47,590
Mas eu não fazer qualquer estilo.

332
00:14:47,590 --> 00:14:49,256
Novamente, nós não estamos falando de CSS aqui.

333
00:14:49,256 --> 00:14:51,030
Nós estamos apenas falando de HTML.

334
00:14:51,030 --> 00:14:53,980
>> Bem, na minha forma de texto que posso type--
lembre-se que as formas de tipo de texto

335
00:14:53,980 --> 00:14:55,480
para que eu possa colocar o meu nome.

336
00:14:55,480 --> 00:14:57,330
E na minha senha I
pode digitar minha senha.

337
00:14:57,330 --> 00:14:59,740
E porque esse campo
é do tipo senha,

338
00:14:59,740 --> 00:15:01,470
você não sabe o que minha senha está.

339
00:15:01,470 --> 00:15:02,800
É todos os pontos.

340
00:15:02,800 --> 00:15:09,140
>> Eu também pode optar por marcar fora um
botão de opção ou assinalar fora de uma caixa de seleção.

341
00:15:09,140 --> 00:15:10,420
Ou eu poderia enviar meu formulário.

342
00:15:10,420 --> 00:15:11,810
E eu não fiz nada,
então quando eu enviar a minha forma,

343
00:15:11,810 --> 00:15:13,090
a página apenas refresca.

344
00:15:13,090 --> 00:15:16,970
Mas eu talvez pudesse configurar o meu
Submit para fazer outra coisa.

345
00:15:16,970 --> 00:15:20,410
E vamos ver o que podemos fazer com
em que um vídeo no futuro PHP.

346
00:15:20,410 --> 00:15:22,520
Mas isso cria uma muito
formulário simples que nós

347
00:15:22,520 --> 00:15:27,360
pode usar para que os usuários interagem e
enviar informações ao nosso site.

348
00:15:27,360 --> 00:15:29,620
>> Um último comentário antes de nós
passar para algumas outras tags

349
00:15:29,620 --> 00:15:32,040
estão a dar uma olhada neste
tag de entrada mais uma vez.

350
00:15:32,040 --> 00:15:35,760
Repare que eu tenho em destaque
as extremidades da etiqueta no vermelho.

351
00:15:35,760 --> 00:15:39,390
Cada outra tag que vimos até agora tem
teve um começo e um fim, uma abertura

352
00:15:39,390 --> 00:15:41,030
tag e uma tag de fechamento.

353
00:15:41,030 --> 00:15:42,520
>> Mas uma marca de entrada não.

354
00:15:42,520 --> 00:15:46,860
Não há nenhum texto que vai
entre tags de entrada.

355
00:15:46,860 --> 00:15:49,160
Todas as informações
nós estamos pretendendo transmitir

356
00:15:49,160 --> 00:15:52,640
está ligada como parte do
atributos desse insumo.

357
00:15:52,640 --> 00:15:54,690
Observe temos o nome de entrada é igual a x.

358
00:15:54,690 --> 00:15:55,580
Tipo iguala y.

359
00:15:55,580 --> 00:15:57,660
Isso é realmente tudo o
informações que precisamos.

360
00:15:57,660 --> 00:15:59,470
>> Isso é chamado de tag de fecho automático.

361
00:15:59,470 --> 00:16:02,470
Ela não requer uma abertura e um
perto, porque todas as informações

362
00:16:02,470 --> 00:16:04,974
está contida no interior da
tag e seus atributos.

363
00:16:04,974 --> 00:16:06,390
Então, às vezes você vai ver isso também.

364
00:16:06,390 --> 00:16:10,400
Então, basta estar ciente de que se você tem um
tag que é totalmente auto-suficiente,

365
00:16:10,400 --> 00:16:14,170
ele abre e fecha-se com
o suporte de ângulo aberto na esquerda

366
00:16:14,170 --> 00:16:17,000
e o ângulo de corte
suporte do lado direito.

367
00:16:17,000 --> 00:16:20,580
Vamos ver mais um daqueles
agora com tags de imagem também.

368
00:16:20,580 --> 00:16:23,300
>> Antes de falarmos sobre as imagens, nós
Precisamos conversar sobre hyperlinks.

369
00:16:23,300 --> 00:16:26,080
Se queremos que a nossa página web para ser
interativa e mover-se em torno de nós,

370
00:16:26,080 --> 00:16:28,121
seria bom ser capaz
a clicar em um desses

371
00:16:28,121 --> 00:16:30,190
o que tem sido tipicamente um link azul.

372
00:16:30,190 --> 00:16:34,440
Esta é realmente a forma como construímos
um hiperlink em nossa página web.

373
00:16:34,440 --> 00:16:36,540
E, curiosamente
há uma outra tag HTML

374
00:16:36,540 --> 00:16:39,000
chamado de link, que não é um hiperlink.

375
00:16:39,000 --> 00:16:44,130
Um aqui insere uma âncora, e
é assim que indicam um hiperlink.

376
00:16:44,130 --> 00:16:49,150
>> Um href é igual x meios ir para
página web X. E tudo

377
00:16:49,150 --> 00:16:51,580
entre o aberto Uma tag
ea estreita A tag

378
00:16:51,580 --> 00:16:56,010
é o que vai ser que sublinhou
texto azul que se parece com um link

379
00:16:56,010 --> 00:16:57,590
que estamos familiarizados.

380
00:16:57,590 --> 00:17:01,660
Abaixo disso temos uma tag de imagem, que
é uma auto fechamento tag para exibir

381
00:17:01,660 --> 00:17:05,599
uma imagem localizada em X. E
você pode ser capaz de mudar

382
00:17:05,599 --> 00:17:08,280
aquela imagem especificando
largura e altura

383
00:17:08,280 --> 00:17:11,640
e outros atributos
que dot dot dot lá.

384
00:17:11,640 --> 00:17:14,260
>> Na parte inferior aqui
temos um muito interessante

385
00:17:14,260 --> 00:17:16,170
olhando tag que não faz
ter uma tag de fechamento.

386
00:17:16,170 --> 00:17:19,410
É exclamação HTML ponto doctype.

387
00:17:19,410 --> 00:17:23,300
Então HTML tem sido em torno desde o
início de 1990 para a construção de páginas web,

388
00:17:23,300 --> 00:17:25,859
e ele se foi submetido
várias revisões desde então.

389
00:17:25,859 --> 00:17:28,550
Mais recentemente, em 2014
ele foi submetido a uma revisão

390
00:17:28,550 --> 00:17:33,440
chamado HTML5, que agora é a corrente
tipo de padrão de facto HTML.

391
00:17:33,440 --> 00:17:36,730
>> Para indicar que a nossa web
páginas são escritas usando HTML5,

392
00:17:36,730 --> 00:17:38,160
isto é como nós começar.

393
00:17:38,160 --> 00:17:40,380
Ele pode ser omitido, mas
o que, basicamente,

394
00:17:40,380 --> 00:17:45,930
meios é que você não pode usar qualquer uma das marcas
que são tags HTML5, essas novas tags.

395
00:17:45,930 --> 00:17:48,591
Então, nós sempre começar
se estamos usando HTML5.

396
00:17:48,591 --> 00:17:51,340
E todas as marcas nós já conversamos sobre
anteriormente não são tags HTML5.

397
00:17:51,340 --> 00:17:55,470
Mas isso indica que
Tags de HTML5 estará presente.

398
00:17:55,470 --> 00:17:58,400
E por isso temos de exclamação
doctype HTML, que

399
00:17:58,400 --> 00:18:01,280
é logo no início da nossa
Arquivo HTML, e em seguida, depois desse ponto

400
00:18:01,280 --> 00:18:04,930
nós realmente temos o nosso HTML aberto
marcar e proceder a partir daí.

401
00:18:04,930 --> 00:18:10,050
>> A última é uma tag de comentário,
que parece um pouco diferente, também.

402
00:18:10,050 --> 00:18:12,810
Ela começa com ângulo
suporte de exclamação traço

403
00:18:12,810 --> 00:18:15,220
traço, mas não colchete de fechamento.

404
00:18:15,220 --> 00:18:20,150
Entre esses dois elementos lá
é onde você escrever seus comentários.

405
00:18:20,150 --> 00:18:28,420
E vamos dar uma olhada em imagens
e comentários e links em CS50 IDE.

406
00:18:28,420 --> 00:18:32,850
>> Então, eu tenho aqui um arquivo chamado link de imagem
dot HTML que eu vou abrir.

407
00:18:32,850 --> 00:18:36,420
E repare que eu tenho um par de
comenta aqui em meus comentários HTML.

408
00:18:36,420 --> 00:18:38,990
Assim como em C e outro
linguagens de programação,

409
00:18:38,990 --> 00:18:43,169
HTML apenas por ser uma linguagem de marcação
tem a capacidade de ter comentários.

410
00:18:43,169 --> 00:18:45,710
E por isso estou aparentemente, vai
colocar uma foto de Rick Astley

411
00:18:45,710 --> 00:18:49,060
algures entre esta div
tag, essa divisão arbitrária.

412
00:18:49,060 --> 00:18:51,497
Aparentemente, esse arquivo é
localizado no Rick ponto JPEG, que

413
00:18:51,497 --> 00:18:53,580
se dirigir de volta para
minha árvore de arquivos para um segundo,

414
00:18:53,580 --> 00:18:55,490
é um arquivo que existe em
o diretório atual.

415
00:18:55,490 --> 00:18:56,031
Então, isso é OK.

416
00:18:56,031 --> 00:18:57,710
Eu posso fazer referência a ela.

417
00:18:57,710 --> 00:18:59,680
>> Então eu posso ter ligações internas.

418
00:18:59,680 --> 00:19:05,080
Então, observe na linha 11 aqui
meu href é Olá dot HTML.

419
00:19:05,080 --> 00:19:09,050
De modo que apenas se refere a Olá dot HTML
que existe no diretório atual.

420
00:19:09,050 --> 00:19:12,980
E eu também pode ter externo
ligações por apenas especificando HTTPS

421
00:19:12,980 --> 00:19:16,180
para indicar que eu não estou falando
sobre um arquivo no meu diretório atual.

422
00:19:16,180 --> 00:19:19,730
Eu estou falando sobre um arquivo que existe
em algum lugar na internet, o que eu tenho

423
00:19:19,730 --> 00:19:23,370
para solicitar, utilizando o protocolo HTTP.

424
00:19:23,370 --> 00:19:25,990
>> Então, vamos dar uma olhada no que
Nesta página pode parecer

425
00:19:25,990 --> 00:19:29,500
e prepare-se para uma imagem de Rick
Astley para aparecer na sua tela.

426
00:19:29,500 --> 00:19:31,490
Então, eu vou visualizar isso.

427
00:19:31,490 --> 00:19:33,800
Há Rick Astley no
muito superior neste arbitrária

428
00:19:33,800 --> 00:19:35,008
divisão de eu colocá-lo no topo.

429
00:19:35,008 --> 00:19:36,960
E, em seguida, para baixo abaixo I
tenho minhas ligações, certo?

430
00:19:36,960 --> 00:19:39,330
>> Eu tenho um link para Olá dot HTML.

431
00:19:39,330 --> 00:19:42,860
E se eu clicar em que, eu recebo
transferida para esta página

432
00:19:42,860 --> 00:19:47,050
que estamos muito familiarizados com a partir de
o início do nosso programa.

433
00:19:47,050 --> 00:19:50,880
Se eu aparecer essa página aberta novamente, se eu
pop link de imagem abrir mais uma vez,

434
00:19:50,880 --> 00:19:54,420
Eu também pode ir externamente
para o site do CS50.

435
00:19:54,420 --> 00:19:56,740
E lá nós see-- eu vou
zoom out um pouco aqui--

436
00:19:56,740 --> 00:20:00,260
vamos ver do CS50 tipo de website
incorporado no meio de nossa página.

437
00:20:00,260 --> 00:20:04,670
Então, eu era capaz de fazer um interno
vincular, bem como um link externo.

438
00:20:04,670 --> 00:20:07,200
>> A última regra com HTML que
vamos falar aqui

439
00:20:07,200 --> 00:20:09,510
é que o HTML deve ser bem formado.

440
00:20:09,510 --> 00:20:13,020
Em C, falamos muito sobre
a sintaxe de várias coisas.

441
00:20:13,020 --> 00:20:17,650
Em HTML a sintaxe realmente
gira em torno de tags.

442
00:20:17,650 --> 00:20:19,660
Cada tag você abre precisa ser fechado.

443
00:20:19,660 --> 00:20:22,630
E, de fato, cada tag você abre
devem ser fechados pela ordem inversa.

444
00:20:22,630 --> 00:20:25,790
>> Então, se você abrir uma etiqueta em negrito, itálico uma
tag, e então uma tag sublinhado

445
00:20:25,790 --> 00:20:28,120
para fazer todos os três para um
especial conjunto de texto,

446
00:20:28,120 --> 00:20:30,070
você deve fechá-los em ordem inversa.

447
00:20:30,070 --> 00:20:32,270
Então, se você abriu corajoso,
itálico, sublinhado, você

448
00:20:32,270 --> 00:20:35,240
quer encerrar sublinhado, itálico, negrito.

449
00:20:35,240 --> 00:20:39,990
Este tipo de encapsulamento é o que
mantém HTML agradável e organizado.

450
00:20:39,990 --> 00:20:44,370
>> Ao contrário de C, porém, erros de sintaxe não vai
na verdade, prejudicar o seu HTML, possivelmente.

451
00:20:44,370 --> 00:20:48,730
Seu HTML pode não ser bem
formado, mas que ainda funcionam.

452
00:20:48,730 --> 00:20:50,589
E assim estes erros
pode classificar de slide.

453
00:20:50,589 --> 00:20:52,130
É até você para realmente ser vigilante.

454
00:20:52,130 --> 00:20:54,760
Às vezes, eles vão falhar, mas
às vezes você pode começar afastado com ele.

455
00:20:54,760 --> 00:20:56,509
>> Pode ser um realmente
tarefa difícil, porém,

456
00:20:56,509 --> 00:21:00,660
manter o controle de quando você abriu
uma tag, quando você fechou-a,

457
00:21:00,660 --> 00:21:04,110
especialmente como seu HTML
arquivos ficar maior e maior.

458
00:21:04,110 --> 00:21:05,490
Você vai querer alguma ajuda.

459
00:21:05,490 --> 00:21:07,560
E há on-line
ferramentas de validação que você

460
00:21:07,560 --> 00:21:11,474
pode usar para ter um olhar para o seu web
página e ver se ele está bem formado HTML.

461
00:21:11,474 --> 00:21:13,390
E você deve definitivamente
Dê uma olhada os

462
00:21:13,390 --> 00:21:16,620
e começar a usá-los como você
começar a fazer algum trabalho com HTML,

463
00:21:16,620 --> 00:21:20,800
escrever em HTML, apenas para que você obtenha
alguns bons hábitos sobre a organização

464
00:21:20,800 --> 00:21:24,377
o seu HTML em um bom caminho e
bom estilo e certificando-

465
00:21:24,377 --> 00:21:27,210
que você não está fazendo qualquer coisa que
poderia criar um erro de sintaxe que

466
00:21:27,210 --> 00:21:30,270
faria com que você um pouco de
um problema no caminho.

467
00:21:30,270 --> 00:21:31,190
>> Eu sou Doug Lloyd.

468
00:21:31,190 --> 00:21:33,450
Este é CS50.

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