1
00:00:01,300 --> 00:00:04,270
OK alors il est temps que nous écrivons réellement quelque C S. S.

2
00:00:04,290 --> 00:00:05,400
Très excitant.

3
00:00:05,400 --> 00:00:09,000
Avant que nous faisons que si nous avons besoin d'avoir un peu vieilli Al que nous pouvons style.

4
00:00:09,180 --> 00:00:18,140
Donc, je vais aller de l'avant et en sublime faire un nouveau fichier de sauvegarder, il suffit de mettre sur mon bureau pour l'instant et je vais l'appeler sur moi.

5
00:00:18,220 --> 00:00:21,180
HMO.

6
00:00:22,470 --> 00:00:30,400
Utilisez ce petit tour obtenir le squelette de la plaque de la chaudière et ce va être une page très simple.

7
00:00:30,600 --> 00:00:34,500
Je vous dis maintenant que ce ne sera pas beau quand nous aurons terminé.

8
00:00:34,590 --> 00:00:36,110
Nous allons changer quelques couleurs.

9
00:00:36,210 --> 00:00:38,950
Nous ne faisons que reprendre les bases de la façon dont tout cela fonctionne ensemble.

10
00:00:39,240 --> 00:00:52,430
Alors je vais juste et chacun sur moi et puis disons une démangeaison pour mes hobbies.

11
00:00:52,740 --> 00:00:55,150
N'hésitez pas à vous adapter à vous-même.

12
00:00:55,530 --> 00:01:12,730
Ajoutons une liste et quelques alliés et faisons voler la cuisson au goudron et l'origami et sauvegarder ce fichier.

13
00:01:13,110 --> 00:01:14,180
On va juste vérifier.

14
00:01:14,280 --> 00:01:16,870
Ouvrons-le.

15
00:01:16,920 --> 00:01:17,480
Génial.

16
00:01:17,550 --> 00:01:19,970
Voici notre site merveilleux que nous allons à style.

17
00:01:20,580 --> 00:01:26,650
Donc, avant de commencer à écrire le succès, nous devons décider où mettre le succès.

18
00:01:26,820 --> 00:01:28,520
Et il ya effectivement quelques choix.

19
00:01:28,860 --> 00:01:36,840
Donc, dans les notes, il ya deux que je suis référencement sur cette page et le premier que je vais vous dire en ce moment n'est pas une bonne idée.

20
00:01:36,840 --> 00:01:41,100
Je vous le montre pour que vous le sachiez pour deux raisons.

21
00:01:41,100 --> 00:01:51,390
Celle-ci est la seule façon d'utiliser des éléments de style avant une feuille de style distincte et avant CSSA vous avez réellement fait ceci dans chaque élément unique.

22
00:01:51,660 --> 00:01:55,380
Permettez-moi de vous montrer un exemple.

23
00:01:55,830 --> 00:01:59,140
Je veux faire ce premier mensonge pourpre.

24
00:01:59,340 --> 00:02:08,000
Je dirais que le style et puis dans la citation dire couleur pourpre et qui fonctionnera.

25
00:02:08,580 --> 00:02:10,800
Et cela devient violet.

26
00:02:11,490 --> 00:02:20,880
Il ya donc un problème qui est si je veux que tous les trois de ces pour être violet, j'ai besoin d'aller de l'avant et dupliquer cela à chaque fois.

27
00:02:20,880 --> 00:02:21,910
Ce qui est beaucoup de travail.

28
00:02:21,990 --> 00:02:28,570
Et puis si je décide oh non, je veux qu'ils soient verts, puis j'ai besoin d'aller et de changer trois endroits différents pour être vert.

29
00:02:28,770 --> 00:02:35,940
Et évidemment, ce problème est bien pire quand vous avez des centaines de même élément avec le même style sur une page donnée.

30
00:02:35,940 --> 00:02:37,200
C'est donc une mauvaise idée.

31
00:02:37,470 --> 00:02:43,220
Et l'autre raison, ce n'est pas une bonne idée, c'est que nous voulons séparer notre h tim L de RCA.

32
00:02:43,380 --> 00:02:46,050
C'est cette idée de la séparation des préoccupations.

33
00:02:46,200 --> 00:02:50,030
Nous voulons que notre CSSA soit autonome dans son propre dossier.

34
00:02:50,040 --> 00:02:53,270
Nous voulons le vieillir pour qu'il soit son propre dossier avec juste la structure.

35
00:02:53,290 --> 00:02:55,130
C Ss est juste le style.

36
00:02:55,230 --> 00:02:58,490
Donc, à l'heure actuelle, c'est un mélange bizarre des deux.

37
00:02:58,710 --> 00:03:07,010
Donc je vais m'en débarrasser et l'autre façon dans les notes est quelque chose qu'on appelle une attaque de style.

38
00:03:07,360 --> 00:03:15,580
Ainsi, un tag de style nous permet d'écrire la syntaxe C Ss où nous sélectionnons les choses et nous avons les accolades que nous ne pouvions pas faire ici.

39
00:03:16,230 --> 00:03:20,590
Mais ce que nous pouvons faire, c'est de le faire dans un document html.

40
00:03:20,700 --> 00:03:43,260
Donc, dans la tête si nous allons de l'avant et juste créer la balise appelée style et nous pouvons lui donner ce type d'attribut égale texte ss Css, nous pouvons maintenant écrire quelques C Ss tags et sélecteurs à l'intérieur d'ici.

41
00:03:43,470 --> 00:03:55,240
Donc, n'oubliez pas que nous avons ce est le sélecteur règle générale et puis nous avons la propriété à l'intérieur des accolades et puis la valeur et puis un point-virgule.

42
00:03:55,920 --> 00:03:58,990
Donc je vais commenter cela par la façon de faire des commentaires.

43
00:03:59,040 --> 00:04:03,870
SS utiliser slash et l'astérisque, puis astérisque et slash.

44
00:04:04,230 --> 00:04:06,060
Je veux dire que je vais laisser ça ici.

45
00:04:06,270 --> 00:04:12,990
Et commençons par changer le H-1 pour être violet.

46
00:04:13,020 --> 00:04:16,810
Donc la façon dont nous écrivons que si nous suivons ce modèle, nous le sélectionnons.

47
00:04:17,070 --> 00:04:24,680
Donc nous allons écrire chaque et encore et nous allons passer beaucoup de temps sur les différents types de sélecteurs.

48
00:04:24,690 --> 00:04:32,860
Donc en ce moment nous apprenons à propos d'un appelé le sélecteur d'éléments qui a conduit à sélectionner basée sur un type d'élément qui est H-1.

49
00:04:33,300 --> 00:04:40,220
Alors maintenant, nous allons ajouter une propriété ici et dans cette vidéo, nous allons simplement la garder extrêmement simple et utiliser la couleur.

50
00:04:40,740 --> 00:05:06,510
Donc, je vais dire la couleur et puis pourpre et enregistrer cette recharge ou la page de sauvegarde et nous obtenons un violet H-1 Alors la prochaine chose que nous pouvons faire est de changer tous les alliés d'être orange et de faire que nous sélectionnons avec un sélecteur d'élément Encore une fois et nous pouvons le faire juste après.

51
00:05:06,520 --> 00:05:10,660
Nous n'avons pas besoin de virgule ou de toute autre ponctuation.

52
00:05:10,660 --> 00:05:19,390
Nous faisons juste une autre règle ici s'appliquent les accolades et cette fois nous allons dire que la couleur est orange.

53
00:05:19,390 --> 00:05:28,500
Donc, la raison pour laquelle nous faisons ceci est que je veux vous montrer que ce sélecteur Elyse il ne sélectionne pas seulement un sélectionne tous les mensonges.

54
00:05:28,600 --> 00:05:33,340
Alors nous rafraîchissons tous les trois sont maintenant orange.

55
00:05:33,340 --> 00:05:36,220
De même avec le H-1 si nous avions plusieurs h ones.

56
00:05:36,310 --> 00:05:38,190
Je vais donc ajouter trois.

57
00:05:38,260 --> 00:05:42,210
Ils seraient tous pourpres.

58
00:05:42,220 --> 00:05:54,860
Une autre chose que je vais vous montrer ici est si je dois trouver un autre style pour chacun ensuite et je dis qu'il devrait être bleu, il devient bleu.

59
00:05:54,910 --> 00:05:56,020
Tous deviennent bleus.

60
00:05:56,080 --> 00:06:02,680
Et donc cela obtient à quelque chose que nous allons apprendre beaucoup plus sur ce qui se passe quand il ya des informations de style contradictoires.

61
00:06:02,680 --> 00:06:05,200
Et dans ce cas nous avons changé tous pour être pourpre.

62
00:06:05,410 --> 00:06:07,870
Ensuite, nous les changeons tous en bleu.

63
00:06:07,870 --> 00:06:12,510
Donc celui qui est venu plus tard a gagné la bataille, je suppose.

64
00:06:13,560 --> 00:06:14,040
D'ACCORD.

65
00:06:14,050 --> 00:06:22,550
Donc, le problème avec ce que nous venons de faire semble bien mais malheureusement, il est toujours dans notre HMO.

66
00:06:22,690 --> 00:06:30,210
Et je viens de dire qu'il y a quelques minutes, nous voulons le séparer ou l'éliminer et nous ne voulons pas qu'ils soient connectés.

67
00:06:30,320 --> 00:06:35,000
Eh bien, nous voulons qu'ils soient connectés, nous ne voulons pas que les CC soient imbriqués à l'intérieur de son HMO.

68
00:06:35,440 --> 00:06:38,630
Donc fonctionnellement il fonctionne exactement de la même manière.

69
00:06:38,800 --> 00:06:46,880
Nous ne voyons pas de différence visuelle, mais bien ce que nous voulons réellement faire est d'utiliser une balise de lien.

70
00:06:47,290 --> 00:07:01,580
Donc ce qu'une balise de lien nous permet de faire est d'écrire ou de voir SS dans un fichier totalement séparé et ensuite connecté avec la balise de lien au lieu de notre tête qui va essentiellement aller chercher le contenu de ce fichier et l'âme et tout le style de notre époque.

71
00:07:01,580 --> 00:07:05,090
Tim L. vu le contenu de ce fichier.

72
00:07:07,270 --> 00:07:17,630
Donc, pour écrire que nous pouvons commencer par créer un nouveau fichier et que nous allons mettre RC SS ici, alors nous allons le sauver et je vais simplement l'appeler.

73
00:07:17,690 --> 00:07:28,960
C Ss vous appelez ce que vous voulez, mais doit être dot C Ss et je le mets dans le même répertoire que mon fichier HDMI.

74
00:07:29,050 --> 00:07:42,630
La prochaine chose que je vais faire est juste de définir quelques styles et ici donc H-1 disons que la couleur est rouge et la couleur des mensonges est vert.

75
00:07:43,240 --> 00:07:46,870
Et pendant que nous sommes ici nous allons le changer pour aussi bien.

76
00:07:46,870 --> 00:07:49,330
Couleur violet.

77
00:07:49,870 --> 00:07:50,830
Génial.

78
00:07:50,980 --> 00:07:58,180
Donc, nous avons CSSA défini ici bien sûr et je vais commenter cela pour l'instant.

79
00:07:58,180 --> 00:08:00,750
Bien sûr, bien qu'ils ne soient pas connectés en ce moment.

80
00:08:01,120 --> 00:08:04,030
Nous avons donc créé un fichier, mais il n'est pas connecté.

81
00:08:04,180 --> 00:08:06,550
Donc, pour ce faire, nous devons utiliser la balise de lien.

82
00:08:06,880 --> 00:08:22,110
Alors je voudrais simplement taper le lien et ensuite cliquer sur l'onglet et vous pouvez voir qu'il ya cet attribut important que le texte sublime veut que nous remplissions ce qui s'appelle A-Trak et il fonctionne comme le creux d'une balise d'ancrage et qui serait Lui donner une arrivée.

83
00:08:22,140 --> 00:08:24,900
Nous lui donnons un endroit pour trouver le fichier.

84
00:08:24,940 --> 00:08:35,140
Donc, dans ce cas, ce fichier est juste appelé apt nous donc nous écrivons juste enlevés oui nous sauver et rafraîchir.

85
00:08:35,140 --> 00:08:42,540
Maintenant, vous pouvez voir que nous avons lu H-1 une page pourpre 4 et alliés verts alors allons tout ce que nous allons faire.

86
00:08:42,540 --> 00:08:43,920
En ce qui concerne le style pour l'instant.

87
00:08:44,110 --> 00:08:57,140
Donc, pour récapituler ici la première chose que nous avons discuté est d'utiliser l'attribut de style pour ajouter du style en ligne qui ressemble à ce style égale et puis lui donner une propriété et c'est une mauvaise idée pour deux raisons.

88
00:08:57,160 --> 00:09:01,420
La première est que nous ne voulons pas encombrer ou H Tim L avec un tas de styles.

89
00:09:01,480 --> 00:09:02,890
Nous voulons qu'ils soient séparés.

90
00:09:03,160 --> 00:09:06,860
Et la deuxième raison est que c'est une douleur si nous voulons changer les choses.

91
00:09:07,150 --> 00:09:11,500
Il ya beaucoup de duplication si nous voulons faire tous 3H un thread.

92
00:09:11,530 --> 00:09:14,850
Nous devons copier ce code à trois endroits différents.

93
00:09:15,340 --> 00:09:23,110
La prochaine chose que nous avons appris était d'utiliser la balise de style et la balise de style nous permet d'écrire C S nous à l'intérieur de notre h Timo.

94
00:09:23,410 --> 00:09:24,940
Et ça marche bien.

95
00:09:24,940 --> 00:09:30,010
Il nous permet d'utiliser la syntaxe CSSA où nous pouvons sélectionner chacun à la fois.

96
00:09:30,010 --> 00:09:34,710
Le problème, c'est que nous ne voulons pas mettre R C S S directement enragé lui.

97
00:09:35,230 --> 00:09:42,880
Mais vous l'utiliserez de temps en temps si vous êtes juste le débogage quelque chose que vous voulez ajouter rapidement des styles que vous ne voulez pas faire un nouveau fichier et ensuite connecté.

98
00:09:42,920 --> 00:09:44,480
Vous allez simplement le supprimer après.

99
00:09:44,590 --> 00:09:46,100
C'est vraiment le moment où je l'utilise.

100
00:09:46,100 --> 00:09:48,530
C'est juste pour des fins de démonstration rapide.

101
00:09:48,730 --> 00:09:53,670
Mais ce que nous voulons réellement utiliser est la balise de lien de la balise de lien.

102
00:09:53,860 --> 00:09:55,810
C'est juste une référence à un autre fichier.

103
00:09:55,960 --> 00:10:05,800
Donc, nous avons besoin d'un fichier rempli de styles doit terminer avec Dotsie évaluer enregistrer, puis le relier à l'attribut H ref et c'est tout ce que nous devons faire.

104
00:10:05,800 --> 00:10:12,550
Une chose que j'ai oublié de mentionner est que vous voulez certainement mettre des balises et des styles de lien dans votre tête.