1
00:00:00,660 --> 00:00:04,430
Então, o próximo elemento de que quero falar é a tabela HCM l.

2
00:00:04,770 --> 00:00:12,110
Então, a tabela é como criamos tabelas ou tabelas como essa aqui na tabela indiana para a tabela.

3
00:00:12,480 --> 00:00:15,760
Há uma tabela aqui que você pode ver de um gráfico.

4
00:00:16,620 --> 00:00:22,190
Há outra tabela aqui para cores e, em seguida, aqui estão alguns exemplos dos tipos de coisas em

5
00:00:22,200 --> 00:00:23,090
que vamos trabalhar.

6
00:00:23,340 --> 00:00:25,300
Então estas são mesas na natureza.

7
00:00:25,380 --> 00:00:26,560
Eles são bastante simples.

8
00:00:26,560 --> 00:00:31,470
sem estilo, mas são muito úteis para exibir informações em um formato tabular.

9
00:00:31,470 --> 00:00:34,800
Obviamente, eles não são as coisas mais bonitas

10
00:00:34,800 --> 00:00:37,580
Vou seguir em frente e comentar.

11
00:00:37,860 --> 00:00:47,870
Muito deste arquivo lembrar na barra de comando sublime e vou colocar um novo elemento de tabela e dentro de cada mesa e é

12
00:00:49,980 --> 00:00:54,420
aí que fica um pouco complicado porque existem algumas maneiras diferentes

13
00:00:54,420 --> 00:00:55,550
de fazer isso.

14
00:00:55,560 --> 00:01:03,810
O primeiro que vamos mostrar é que escrevemos um elemento t r que representa a linha da tabela e, em seguida,

15
00:01:03,810 --> 00:01:08,590
dentro de cada linha da tabela você colocou um elemento t d.

16
00:01:08,790 --> 00:01:14,040
vou escrever isso apenas para mostrar uma foto primeiro, então vamos voltar e discutir.

17
00:01:14,040 --> 00:01:14,490
Então,

18
00:01:14,490 --> 00:01:20,550
Então, tiddy e vamos colocar alguns textos aleatórios aqui, então vamos voltar às cores

19
00:01:20,880 --> 00:01:23,670
vermelhas e laranja e vamos deixar isso.

20
00:01:23,700 --> 00:01:27,150
Eu atualizo minha página e tenho uma bela mesa.

21
00:01:27,150 --> 00:01:32,320
No entanto, eu não tenho nenhuma borda nesta tabela, então é difícil ver o que está acontecendo.

22
00:01:32,460 --> 00:01:34,340
Você faria isso usando CSSA.

23
00:01:34,350 --> 00:01:41,040
Normalmente, esta não é uma ótima idéia da maneira como eu fiz isso aqui com um atributo de borda.

24
00:01:41,160 --> 00:01:43,760
Esta é uma maneira antiga de fazê-lo.

25
00:01:43,830 --> 00:01:51,150
É assim que você poderia fazê-lo no tempo para, basicamente, antes que as coisas se tornassem mais orientadas ao fazer todo o seu

26
00:01:51,180 --> 00:01:54,780
estilo em seu C Ss para que você ainda pudesse fazê-lo.

27
00:01:54,780 --> 00:01:56,960
Eu só vou adicionar aqui apenas para mostrar o que está acontecendo.

28
00:01:57,120 --> 00:02:04,360
Então, o que eu fiz é fazer uma tabela que é uma linha e tem dois elementos para TDL em vez de uma linha.

29
00:02:04,770 --> 00:02:09,210
Então eu posso fazer outra linha e eu vou fazer verde e amarelo e

30
00:02:11,970 --> 00:02:12,600
demorar um

31
00:02:16,260 --> 00:02:20,070
momento para pensar apenas sobre o que isso deveria parecer quando eu atualizar.

32
00:02:20,070 --> 00:02:25,070
Todos nós temos duas linhas agora vermelhas e laranja, amarelo e verde.

33
00:02:25,890 --> 00:02:32,990
Então, novamente, temos tabela que temos t r para cada linha e, em seguida, um T D para cada célula.

34
00:02:33,900 --> 00:02:35,300
Então é ótimo.

35
00:02:35,310 --> 00:02:41,010
A próxima coisa, porém, que eu quero mostrar é como podemos criar um título na mesa, então

36
00:02:41,010 --> 00:02:45,090
vamos mudar nossos dados um pouco e vamos fazer essa tabela sobre pessoas.

37
00:02:45,090 --> 00:02:55,920
Então, teremos algo como nome e idade e, em seguida, abaixo, teremos que você conhece o nome é ou talvez este seja cães

38
00:02:55,920 --> 00:02:59,950
que estão enferrujados. Meu cachorro tem que assisti-lo.

39
00:02:59,970 --> 00:03:04,130
O meu outro cachorro com 13 anos e assim por diante.

40
00:03:04,260 --> 00:03:11,250
Então, para fazer isso, queremos nome e idade para fazer parte de um tipo de tabela do título em negrito da tabela.

41
00:03:11,250 --> 00:03:12,770
E, portanto, há outro elemento.

42
00:03:13,080 --> 00:03:20,380
Vamos fazer outra linha e, em vez de Tweedy, vamos usar uma tag chamada Th.

43
00:03:20,940 --> 00:03:23,820
Então, é para uma cabeça de tabela ou cabeçalho de tabela.

44
00:03:24,370 --> 00:03:36,750
E vamos ter um nome e idade e, em seguida, nossa primeira fila vai continuar e preencher Rusty

45
00:03:36,750 --> 00:03:46,970
e sua idade é para então, nossa próxima fila será Wyatt e seus 13 anos.

46
00:03:47,610 --> 00:03:49,220
É bom para um cachorro.

47
00:03:49,590 --> 00:03:51,320
Então eu atualizo a página.

48
00:03:51,540 --> 00:03:56,170
Ah, você pode ver meu lindo diagrama desse comentário.

49
00:03:56,910 --> 00:03:58,240
E agora está aqui a minha mesa.

50
00:03:58,470 --> 00:04:04,440
Então eu tenho meu th's em uma linha e então, se eu tivesse outra linha com dois elementos e depois

51
00:04:04,530 --> 00:04:06,070
outra linha com dois elementos.

52
00:04:06,150 --> 00:04:08,540
Então, uma outra coisa que podemos discutir aqui.

53
00:04:08,850 --> 00:04:13,150
Há uma maneira um pouco mais complicada de fazer exatamente a mesma tabela.

54
00:04:13,620 --> 00:04:19,590
E é realmente mais complicado, é apenas uma ou outra tag que dá à nossa tabela mais significado.

55
00:04:19,590 --> 00:04:25,900
Então, agora, nossa informação de cabeçalho é dois cabeçalhos são apenas parte de um TR regular.

56
00:04:26,100 --> 00:04:31,370
Portanto, não há distinção entre este TR e este TR. Ambos são apenas linhas de tabela.

57
00:04:31,680 --> 00:04:38,040
Bem, inicialmente de todos os cinco novamente a ênfase é fazer com que cada equipe e ter uma marcação que seja

58
00:04:38,040 --> 00:04:38,620
algo significativo.

59
00:04:38,640 --> 00:04:43,860
Então, se algum outro código estiver vislumbrando este site e alguém que estiver usando um leitor de tela, o

60
00:04:43,860 --> 00:04:49,440
código do leitor de tela pode ver meu envelhecer HMO e lê-lo e ele saberá que o título dele saberá

61
00:04:49,440 --> 00:04:55,350
o que o corpo da mesa pode comportar um pouco diferente do que se apenas lê todas as estradas em voz alta.

62
00:04:55,350 --> 00:05:04,830
Então, o que fazemos lá são dois elementos que podemos adicionar e há uma cabeça T e um corpo

63
00:05:04,830 --> 00:05:08,670
t e isso não fará diferença na aparência.

64
00:05:08,860 --> 00:05:16,800
Mas eu posso fazer é simplesmente mover o encabeçamento tudo o que corresponde a esta parte superior em uma cabeça T.

65
00:05:18,810 --> 00:05:24,270
E então, o que vou fazer é mover o corpo real da mesa todo

66
00:05:27,060 --> 00:05:31,610
o conteúdo para o corpo por isso parece idêntico, nada deve mudar.

67
00:05:31,770 --> 00:05:36,930
E vamos fazer um outro rápido para mudar aqui, então vamos adicionar outra coluna, então esta será a

68
00:05:37,260 --> 00:05:38,870
idade do nome e a raça.

69
00:05:39,690 --> 00:05:46,320
Então resti é um vira-lata e por que é um dourado.

70
00:05:46,950 --> 00:05:47,610
Aqui vamos nós.

71
00:05:47,760 --> 00:05:50,340
Então, essa é a base das tabelas.

72
00:05:50,340 --> 00:05:52,470
Mais uma vez, eles geralmente não são feios.

73
00:05:52,470 --> 00:05:57,450
Costumamos usar C S S e, portanto, isso é apenas uma tabela normal sem nenhum estilo.

74
00:05:57,450 --> 00:06:01,380
E então iremos ver e avaliar e alterar as fontes e adicionar uma borda e cores de fundo e

75
00:06:01,380 --> 00:06:01,880
tudo isso.

76
00:06:02,130 --> 00:06:02,930
Certo, ótimo.
