1
00:00:00,240 --> 00:00:01,290
Bem vindo de volta.

2
00:00:01,290 --> 00:00:06,670
Então, este vídeo será uma visão geral de alto nível de como funciona a avaliação e o que ela faz.

3
00:00:06,720 --> 00:00:11,310
Então, queremos realmente estar escrevendo qualquer código até a próxima lição e praticamente todas as lições

4
00:00:11,310 --> 00:00:13,120
a partir daí nos cobrindo SEUS.

5
00:00:13,500 --> 00:00:18,930
Mas o que vamos fazer é três coisas importantes que vamos definir o sucesso e falar sobre o

6
00:00:18,930 --> 00:00:21,870
papel que ele desempenha porque você usa o que faz.

7
00:00:21,870 --> 00:00:24,180
Nós vamos ver alguns sites que possuem o.

8
00:00:24,210 --> 00:00:27,560
Vamos tirar o C S C S e ver como eles mudam.

9
00:00:27,900 --> 00:00:32,490
E então vamos definir esta regra geral que seguirá para cada linha CSSA que escrevemos.

10
00:00:34,380 --> 00:00:39,580
Então, vamos em frente e falamos sobre qual é a postura para as folhas de estilo em cascata.

11
00:00:39,840 --> 00:00:43,670
Então, a parte em cascata em que realmente vamos voltar em um vídeo posterior.

12
00:00:43,830 --> 00:00:46,690
Mas as folhas de estilo são bastante auto-explicativas.

13
00:00:46,710 --> 00:00:55,390
Lembre-se de que C Ss é freqüentemente considerado os adjetivos ou a pele onde H M L seria o substantivo.

14
00:00:55,590 --> 00:00:59,830
Então, Jim Ellis, a estrutura que desejamos encaminhar aqui e um ponto de bala aqui.

15
00:01:00,090 --> 00:01:07,740
Nós costumávamos dizer que os cabeçalhos são roxos e tamanho da fonte de 50 pixels e mova isso para baixo

16
00:01:07,740 --> 00:01:09,170
e dê uma borda.

17
00:01:09,240 --> 00:01:13,760
Então, usamos isso para descrever como as coisas devem se parecer com estilos de estilo.

18
00:01:13,770 --> 00:01:19,410
A outra parte é a parte dos folhetos e o que isso significa é que nós estaremos escrevendo

19
00:01:19,530 --> 00:01:21,030
estes separadamente de cada equipe.

20
00:01:21,110 --> 00:01:23,400
Eles não estão dentro da HMO.

21
00:01:23,460 --> 00:01:27,590
Eles são documentos separados que incluímos no nosso HMO.

22
00:01:28,020 --> 00:01:31,510
Então, vamos começar por dar uma olhada em alguns exemplos.

23
00:01:31,560 --> 00:01:35,430
site que realmente gosto muito do jardim chamado CSX Zen e o

24
00:01:38,610 --> 00:01:44,490
ponto inteiro deste site é mostrar a variedade de coisas que você pode realizar com a Jesse s s.

25
00:01:44,490 --> 00:01:45,220
Há um

26
00:01:45,300 --> 00:01:49,200
Então, se você dar uma olhada aqui, temos uma marcação.

27
00:01:49,260 --> 00:01:52,120
Vejamos o arquivo HDMI.

28
00:01:52,410 --> 00:01:54,010
Podemos avançar e abrir isso.

29
00:01:54,450 --> 00:01:58,780
Então, este é o arquivo principal que toda a página NCEA diz.

30
00:01:58,840 --> 00:02:00,300
Jardim Zen usa.

31
00:02:00,300 --> 00:02:02,130
Então você pode ver que é bastante básico.

32
00:02:02,130 --> 00:02:04,280
Nós temos alguns títulos.

33
00:02:04,280 --> 00:02:10,260
Nós temos alguns parágrafos alguns links de pontos de bala na parte inferior e, em seguida, toda a

34
00:02:10,260 --> 00:02:16,710
idéia deste site é que os contribuidores tomam isso para enviar e-mail e escrever seus próprios CSSA sem alterar

35
00:02:16,710 --> 00:02:17,580
o envelhecido.

36
00:02:17,580 --> 00:02:23,360
Então, você só muda para ver avaliar a estrutura é o mesmo e você acaba com resultados diferentes.

37
00:02:23,370 --> 00:02:25,550
Então, aqui está um.

38
00:02:25,720 --> 00:02:31,320
E no lado direito você pode verificar alguns outros e há um monte deles no site e, na verdade, você

39
00:02:31,350 --> 00:02:33,800
pode contribuir com o seu próprio se você quiser.

40
00:02:34,080 --> 00:02:35,020
Bem, vamos dar uma olhada.

41
00:02:35,250 --> 00:02:42,750
Portanto, este é radicalmente diferente, diferentes diferentes, criam diferentes imagens de fontes de esquemas de cores.

42
00:02:42,750 --> 00:02:44,190
Este também é muito diferente.

43
00:02:44,190 --> 00:02:47,840
Tem esta animação de carregamento agradável tudo feito Roscius nós.

44
00:02:48,240 --> 00:02:54,420
Você pode rolar para baixo e nós temos esse efeito onde nosso conteúdo rola, mas a imagem de fundo é estática.

45
00:02:56,130 --> 00:03:00,190
Nós temos esse que é radicalmente diferente também.

46
00:03:01,020 --> 00:03:06,990
E nós poderíamos passar o dia inteiro aqui e acabamos de encontrar mais um que é o meu favorito,

47
00:03:06,990 --> 00:03:08,820
que é um robô chamado Jimmy.

48
00:03:09,190 --> 00:03:13,510
Nós conseguimos esse pequeno robô que aparece nessa girando uma explosão de estrelas nas costas.

49
00:03:13,620 --> 00:03:20,860
Também outro efeito de rolagem, então estou mostrando isso para você, para que você veja como o CSSA é poderoso.

50
00:03:21,060 --> 00:03:23,330
É basicamente o médico da pele.

51
00:03:23,370 --> 00:03:27,330
Os aditivos para sua estrutura podem mudar.

52
00:03:27,330 --> 00:03:35,020
Você sabe, além de se parecer com isso e pode mudá-lo para se parecer com isso.

53
00:03:35,070 --> 00:03:40,140
Então, espero que seja o suficiente para você ficar entusiasmado com a aprendizagem de C S s r h d m l lado até agora tem

54
00:03:40,140 --> 00:03:40,690
sido bastante branda.

55
00:03:40,770 --> 00:03:45,170
Não tivemos nenhum estilo além dos estilos pretos e brancos padrão.

56
00:03:46,440 --> 00:03:51,660
Então, em seguida, quero falar sobre uma regra geral que seguirá toda linha de CSSA que escrevemos.

57
00:03:52,050 --> 00:03:55,090
Então, esse padrão aqui parece assim.

58
00:03:55,230 --> 00:03:56,800
Nós selecionamos algo.

59
00:03:57,270 --> 00:04:02,990
Então, vamos conversar muito sobre o que realmente acontece, mas vamos selecionar algo como All h ones

60
00:04:03,300 --> 00:04:06,470
ou todas as marcas de âncora dentro de um aliado.

61
00:04:06,540 --> 00:04:12,690
Então, fazemos algo em que estamos selecionando h tim. Os elementos estão referenciando o html existente e, em seguida,

62
00:04:12,690 --> 00:04:19,710
dentro dos aparelhos curly, aplicamos alguns estilos e eles seguem esse formato de par do valor da chave em que temos uma

63
00:04:19,710 --> 00:04:24,350
propriedade dois pontos e, em seguida, um valor correspondente e, em seguida, um semi -cólon.

64
00:04:24,690 --> 00:04:30,090
diferentes que estamos mudando, mas elas seguem sempre esse valor de propriedade da sintaxe Colan.

65
00:04:30,090 --> 00:04:33,770
Então, podemos ter uma coisa aqui, podemos ter 100 propriedades

66
00:04:34,740 --> 00:04:36,510
Então, aqui estão dois exemplos.

67
00:04:36,540 --> 00:04:40,190
Esta primeira seção vai selecionar todos os h.

68
00:04:40,260 --> 00:04:42,920
Então, novamente, vamos voltar para você como esses seletores funcionam.

69
00:04:43,080 --> 00:04:49,350
Mas vai selecionar todos os dados em uma página e depois lhes dará cor de

70
00:04:49,350 --> 00:04:57,000
púrpura e tamanho de fonte de 56 e, em seguida, o próximo aqui vai selecionar todas as tags de

71
00:04:57,000 --> 00:05:02,100
imagem e dar-lhes cor de borda vermelha e borda de três pixels.

72
00:05:02,100 --> 00:05:06,350
Então você sabe que nem sempre vamos selecionar todos em todas as tags de imagem.

73
00:05:06,570 --> 00:05:10,860
Vamos ter vários vídeos, na verdade, as nuances de selecionar as coisas, às vezes,

74
00:05:10,860 --> 00:05:15,310
queremos selecionar toneladas de coisas, às vezes estamos fazendo um pequeno elemento por vez.

75
00:05:15,450 --> 00:05:19,160
Então há muitas opções lá, mas sempre segue esse formato.

76
00:05:19,470 --> 00:05:26,250
Nós selecionamos algumas chaves e, em seguida, dentro das chaves curly temos pares de valores-chave que são realmente apenas propriedades

77
00:05:26,250 --> 00:05:27,420
que estamos mudando