1
00:00:00,240 --> 00:00:01,290
Welkom terug.

2
00:00:01,290 --> 00:00:06,670
Dus deze video gaat om een ​​hoog niveau overzicht van hoe het werkt en wat het doet te beoordelen.

3
00:00:06,720 --> 00:00:13,120
Dus we willen eigenlijk het schrijven van een code tot de volgende les en vrijwel elke les van daar op uit met betrekking tot SEUS ons.

4
00:00:13,500 --> 00:00:21,870
Maar wat we gaan doen is drie belangrijke dingen die we gaan naar succes te definiëren en te praten over de rol die het speelt waarom je het gebruiken wat het doet.

5
00:00:21,870 --> 00:00:24,180
We gaan een aantal websites die het nodig.

6
00:00:24,210 --> 00:00:27,560
We gaan naar de C S C S weg te nemen en te zien hoe ze veranderen.

7
00:00:27,900 --> 00:00:34,340
En dan gaan we deze algemene regel die zal volgen voor elke CSSA lijn die we opstelt.

8
00:00:34,380 --> 00:00:39,580
Dus laten we gaan en praten over wat is het standpunt van cascading style sheets.

9
00:00:39,840 --> 00:00:43,670
Dus de trapsgewijze gedeelte we eigenlijk aan de hand om terug te komen in een latere video.

10
00:00:43,830 --> 00:00:46,690
Maar de style sheets is vrij vanzelfsprekend.

11
00:00:46,710 --> 00:00:55,390
Vergeet niet dat C Ss vaak wordt beschouwd als de bijvoeglijke naamwoorden of de huid waar H M L de zelfstandige naamwoorden zou zijn.

12
00:00:55,590 --> 00:00:59,830
Dus Jim Ellis de structuur die we willen in rubriek hier en een kogel punt hier.

13
00:01:00,090 --> 00:01:09,170
We gebruikten om te zeggen maken de koppen paars en lettergrootte 50 pixels en verplaats deze naar beneden en geef het een grens.

14
00:01:09,240 --> 00:01:13,760
Dus gebruiken we het om te beschrijven hoe de dingen zouden moeten zien er zo style sheets.

15
00:01:13,770 --> 00:01:21,030
Het andere deel is het vellen deel van uit en wat dat betekent is dat we gaan schrijven deze los van elk team.

16
00:01:21,110 --> 00:01:23,400
Ze zijn niet in HMO.

17
00:01:23,460 --> 00:01:27,590
Ze zijn afzonderlijke documenten die wij vervolgens opnemen in onze HMO.

18
00:01:28,020 --> 00:01:31,510
Dus laten we beginnen met het nemen van een kijkje bij enkele voorbeelden.

19
00:01:31,560 --> 00:01:45,220
Er is een site die ik echt heel graag genoemd CSX Zen-tuin en het hele punt van deze site is aan te tonen u de verscheidenheid van dingen die je kunt bereiken met Jesse s s.

20
00:01:45,300 --> 00:01:49,200
Dus als je hier een kijkje te nemen hebben we een aantal markup.

21
00:01:49,260 --> 00:01:52,120
Laten we eens kijken naar de HDMI-bestand.

22
00:01:52,410 --> 00:01:54,010
We kunnen gaan en open die up.

23
00:01:54,450 --> 00:01:58,780
Dus dit is de kern bestand dat elke pagina NCEA zegt.

24
00:01:58,840 --> 00:02:00,300
Zen-tuin gebruikt.

25
00:02:00,300 --> 00:02:02,130
Dus je kunt zien dat het vrij eenvoudig.

26
00:02:02,130 --> 00:02:04,280
We hebben een aantal rubrieken.

27
00:02:04,280 --> 00:02:17,580
We hebben een aantal punten kreeg een aantal links enkele kogel punten aan de onderkant en dan is het hele idee van deze site is dat medewerkers neem deze e-mail en schrijven hun eigen CSSA zonder dat het helemaal uit de leeftijd van hem.

28
00:02:17,580 --> 00:02:23,360
Zodat u alleen te veranderen om te zien evalueren van de structuur is hetzelfde en je eindigt met verschillende resultaten.

29
00:02:23,370 --> 00:02:25,550
Dus hier is één.

30
00:02:25,720 --> 00:02:33,800
En aan de rechterkant kunt u kijken op een paar anderen en er is er een heleboel van hen op de site en in feite je kunt bijdragen uw eigen als u dat wilt.

31
00:02:34,080 --> 00:02:35,020
Nou laten we eens een kijkje nemen.

32
00:02:35,250 --> 00:02:42,750
Dus dit is radicaal anders totaal andere lay-out van verschillende kleurenschema's fonts beelden.

33
00:02:42,750 --> 00:02:44,190
Deze is ook heel anders.

34
00:02:44,190 --> 00:02:47,840
Het heeft deze mooie animatie voor het laadproces allemaal gedaan Roscius ons.

35
00:02:48,240 --> 00:02:56,050
U kunt naar beneden scrollen en we hebben dit effect waar onze inhoud rollen, maar de achtergrond afbeelding is statisch.

36
00:02:56,130 --> 00:03:00,190
We hebben dit een die radicaal anders.

37
00:03:01,020 --> 00:03:08,820
En we konden de hele dag hier en vinden we nog één die mijn favoriet is dat een robot genaamd Jimmy.

38
00:03:09,190 --> 00:03:13,510
We krijgen dit kleine robot die opduikt in dit spinnen een starburst in de rug.

39
00:03:13,620 --> 00:03:20,860
Ook een andere scrollen effect dus ik dit te zien krijgt, zodat u kunt zien hoe krachtig CSSA is.

40
00:03:21,060 --> 00:03:23,330
Het is eigenlijk de huid arts.

41
00:03:23,370 --> 00:03:27,330
De additieven voor de structuur kan veranderen.

42
00:03:27,330 --> 00:03:35,020
Je weet dat afgezien van te kijken als dit en het kan veranderen om te kijken als dit.

43
00:03:35,070 --> 00:03:40,690
Dus hopelijk dat is genoeg om je enthousiast over het leren van C S s r h d m l kant tot nu toe vrij smakeloos geweest te krijgen.

44
00:03:40,770 --> 00:03:45,170
We hebben niet elke stijl naast de standaard zwart-wit stijl.

45
00:03:46,440 --> 00:03:51,880
Dus de volgende wil ik het hebben over een algemene regel dat elke lijn van CSSA dat we write zullen volgen.

46
00:03:52,050 --> 00:03:55,090
Dus dit patroon hier ziet het er zo uit.

47
00:03:55,230 --> 00:03:56,800
Wij selecteren iets.

48
00:03:57,270 --> 00:04:06,470
Dus we gaan veel te praten over wat er werkelijk gaat er maar we zullen iets dergelijks Alle h degenen of elke ankercode binnenkant van een bondgenoot te selecteren.

49
00:04:06,540 --> 00:04:24,350
Dus iets te doen we waar we het selecteren van h tim l elementen zijn verwijzingen bestaande html en vervolgens binnen de accolades we een aantal modellen toe te passen en zij volgen deze sleutel waarde paar formaat waar we een woning dubbele punt en dan een overeenkomstige waarde en vervolgens een semi -dikke darm.

50
00:04:24,690 --> 00:04:33,770
Dus we kunnen een ding hebben hier kunnen we 100 verschillende eigenschappen die we veranderen, maar ze volgen altijd dit syntax eigenschap Colan waarde.

51
00:04:34,740 --> 00:04:36,510
Dus hier zijn twee voorbeelden.

52
00:04:36,540 --> 00:04:40,190
Dit eerste deel gaat naar alle h degenen te selecteren.

53
00:04:40,260 --> 00:04:42,920
Dus nogmaals we gaan om terug te komen om te zien hoe deze selectors werken.

54
00:04:43,080 --> 00:05:02,100
Maar het gaat om alle elk die op een pagina te selecteren en vervolgens het gaat hen kleur van paars en lettergrootte van 56 te geven en dan deze volgende hier beneden gaat alle image-tags te selecteren en geef ze de grens kleur rood en de grens met van drie pixels.

55
00:05:02,100 --> 00:05:06,350
Dus u weet dat we niet altijd naar alle die in alle image-tags te selecteren.

56
00:05:06,570 --> 00:05:15,310
We gaan meerdere video's hebben op het daadwerkelijk de nuances van de dingen te selecteren soms willen we vele dingen te selecteren soms we doen een klein element tegelijk.

57
00:05:15,450 --> 00:05:19,160
Dus er is een heleboel opties daar, maar het volgt altijd dit formaat.