1 00:00:00,000 --> 00:00:00,500 2 00:00:00,500 --> 00:00:04,500 >> [Speel van musiek] 3 00:00:04,500 --> 00:00:10,099 4 00:00:10,099 --> 00:00:12,224 ALLISON Buchholtz-AU: So ons is basies net gaan 5 00:00:12,224 --> 00:00:14,629 te gee jy 'n oorsig van CSS, want ons weet 6 00:00:14,629 --> 00:00:16,420 dat dit nie gedek in al die afdelings. 7 00:00:16,420 --> 00:00:20,090 En ons wil regtig om seker te maak dat jy ouens het hierdie instrument tot jou beskikking, 8 00:00:20,090 --> 00:00:24,790 want dit het die vermoë om te maak jou webtuistes lyk baie mooier. 9 00:00:24,790 --> 00:00:28,660 >> En as jy 'n webwerf te bou, dan jy waarskynlik wil dit mooi te maak. 10 00:00:28,660 --> 00:00:31,372 Ek bedoel, jy hoef nie te, maar ek sal dit stel. [Lag] 11 00:00:31,372 --> 00:00:35,430 As jy wil hê dat gebruikers om dit te gebruik, kan jy wil dit 'n bietjie [onhoorbaar] te maak. 12 00:00:35,430 --> 00:00:39,130 So ons gaan om te probeer en gee jou net 'n paar basiese gereedskap en begrip, 13 00:00:39,130 --> 00:00:42,340 sodat wanneer jy gaan uit en jy navorsing dinge oor CSS, 14 00:00:42,340 --> 00:00:45,902 dit is nie 'n gebrabbel voltooi, soos CSS soms te wees. 15 00:00:45,902 --> 00:00:47,240 >> TOMAS Reimers: Ja. 16 00:00:47,240 --> 00:00:49,930 Allison sê dit baie goed. 17 00:00:49,930 --> 00:00:53,250 So ek dink die eerste ding wat ons moet begin met is wat CSS? 18 00:00:53,250 --> 00:00:55,750 So CSS is awesome. 19 00:00:55,750 --> 00:00:56,250 CSS-- 20 00:00:56,250 --> 00:00:58,320 >> ALLISON Buchholtz-AU: Dit is die naam van ons seminaar. 21 00:00:58,320 --> 00:00:58,434 >> TOMAS Reimers: Ja. 22 00:00:58,434 --> 00:01:00,130 Dit is regtig belangrik dat jy verstaan ​​dat deur toe. 23 00:01:00,130 --> 00:01:03,090 As jy net weg te neem een ding, dit is wat CSS as awesome. 24 00:01:03,090 --> 00:01:06,180 Twee is CSS staan ​​vir Cascading Style Sheets. 25 00:01:06,180 --> 00:01:10,380 So in sy kern, CSS is 'n styl blad, wat beteken 26 00:01:10,380 --> 00:01:13,200 dit kan jy 'n webblad te stileer. 27 00:01:13,200 --> 00:01:16,609 En dan wat dit beteken, is dit 'n manier styl te voeg tot jou webtuistes. 28 00:01:16,609 --> 00:01:18,900 So deur styl, bedoel ons alles dit is nie structural-- 29 00:01:18,900 --> 00:01:24,350 so goed soos kleure, agtergrond beelde, grense, soos, padding, 30 00:01:24,350 --> 00:01:25,040 marges. 31 00:01:25,040 --> 00:01:27,310 Ons sal praat oor wat al beteken dit dat in 'n bietjie. 32 00:01:27,310 --> 00:01:30,110 >> Dus het ons net vooruit gegaan en oopgemaak beide van diegene in gedit. 33 00:01:30,110 --> 00:01:32,680 So, dit is index.html. 34 00:01:32,680 --> 00:01:34,800 En dit is main.css. 35 00:01:34,800 --> 00:01:36,829 So main.css het niks. 36 00:01:36,829 --> 00:01:38,412 ALLISON Buchholtz-AU: Nee styl so ver. 37 00:01:38,412 --> 00:01:39,245 TOMAS Reimers: Geen. 38 00:01:39,245 --> 00:01:42,577 En as jy sien, dit is 'n baie lelike site. 39 00:01:42,577 --> 00:01:44,160 ALLISON Buchholtz-AU: Dit is net plain. 40 00:01:44,160 --> 00:01:45,820 TOMAS Reimers: Ja. 41 00:01:45,820 --> 00:01:49,150 Ja, dit is nie lelik nie, dit is net minimalistiese. 42 00:01:49,150 --> 00:01:53,430 En dan is hier ons index.html. 43 00:01:53,430 --> 00:01:55,729 En so is dit vir 'n vinnige herhaling van HTML, Allison, 44 00:01:55,729 --> 00:01:57,270 jy wil net praat oor die bladsy? 45 00:01:57,270 --> 00:01:58,395 >> ALLISON Buchholtz-AU: Ja. 46 00:01:58,395 --> 00:02:01,100 So natuurlik, ons het ons HTML tag, wat net name HTML-lêer. 47 00:02:01,100 --> 00:02:07,080 Ons het ons kop hier, met CSS Awesomeness, which-- as jy terug te gaan. 48 00:02:07,080 --> 00:02:07,720 Waar is dit? 49 00:02:07,720 --> 00:02:09,136 >> TOMAS Reimers: Oh. 50 00:02:09,136 --> 00:02:10,301 Ja, jy kan sien. 51 00:02:10,301 --> 00:02:12,092 ALLISON Buchholtz-AU: En kennis van die kop 52 00:02:12,092 --> 00:02:14,120 is hierdie blad kop reg hier. 53 00:02:14,120 --> 00:02:17,130 En dan "Hello, world!" is die teks wat ons het net 54 00:02:17,130 --> 00:02:19,620 vertoon op die web bladsy, wat is-- gaan terug. 55 00:02:19,620 --> 00:02:21,290 Terug. 56 00:02:21,290 --> 00:02:24,287 Wat net in ons liggaam here-- die plain text. 57 00:02:24,287 --> 00:02:26,120 Ook, een ding om te sien, as jy kyk hier, 58 00:02:26,120 --> 00:02:29,410 Tomas aangeskakel tot hierdie twee van ons gly. 59 00:02:29,410 --> 00:02:32,035 So lank as wat jy al drie van hierdie, jy is fyn. 60 00:02:32,035 --> 00:02:34,044 Hulle kan in enige volgorde wat hulle wil. 61 00:02:34,044 --> 00:02:39,368 Wat is die belangrikste is net dat jy het elk van die drie dinge. 62 00:02:39,368 --> 00:02:40,340 >> TOMAS Reimers: Cool. 63 00:02:40,340 --> 00:02:41,111 Voeg 'n doc tipe? 64 00:02:41,111 --> 00:02:42,235 ALLISON Buchholtz-AU: Ja. 65 00:02:42,235 --> 00:02:43,068 TOMAS Reimers: Ja. 66 00:02:43,068 --> 00:02:43,769 Cool. 67 00:02:43,769 --> 00:02:46,102 ALLISON Buchholtz-AU: Blykbaar, my mie hou nie my. 68 00:02:46,102 --> 00:02:49,650 TOMAS Reimers: O, gee ons 'n sekonde net terwyl Allison skakel haar mic. 69 00:02:49,650 --> 00:02:50,500 So ja. 70 00:02:50,500 --> 00:02:52,030 So het ons ons hoofblad. 71 00:02:52,030 --> 00:02:53,890 Dit is soort van unstyled. 72 00:02:53,890 --> 00:02:54,780 Ons het nie veel nie. 73 00:02:54,780 --> 00:02:57,110 Ons moet net basies teks. 74 00:02:57,110 --> 00:02:59,470 Ons het die styl vel. 75 00:02:59,470 --> 00:03:00,220 Ons het die titel. 76 00:03:00,220 --> 00:03:04,020 Dus net kaal sonder been komponente van 'n webwerf. 77 00:03:04,020 --> 00:03:08,880 >> So van daar af, laat ons praat oor wat CSS is 78 00:03:08,880 --> 00:03:11,270 en hoe dit lyk en al daardie. 79 00:03:11,270 --> 00:03:12,047 So vir that-- 80 00:03:12,047 --> 00:03:13,755 ALLISON Buchholtz-AU: Terug na die skyfies. 81 00:03:13,755 --> 00:03:15,200 TOMAS Reimers: Terug na die skyfies. 82 00:03:15,200 --> 00:03:17,240 En Allison kan oorneem. 83 00:03:17,240 --> 00:03:18,720 >> ALLISON Buchholtz-AU: Woo. 84 00:03:18,720 --> 00:03:19,220 OK. 85 00:03:19,220 --> 00:03:22,360 So in jou CSS-lêer, jy gaan te hê 86 00:03:22,360 --> 00:03:25,010 'n baie van hierdie dinge genoem keurders. 87 00:03:25,010 --> 00:03:27,420 Dit sal net die basis van jou CSS-lêer. 88 00:03:27,420 --> 00:03:29,480 Dit is net gaan om te wees baie, baie van hulle nie. 89 00:03:29,480 --> 00:03:30,780 So selector. 90 00:03:30,780 --> 00:03:32,649 Dit is net die algemene anatomie. 91 00:03:32,649 --> 00:03:35,190 Ons gaan om te gaan deur middel van voorbeelde, want as jy ouens nooit 92 00:03:35,190 --> 00:03:38,400 gekyk my artikel, ek voel soos dinge in die abstrakte 93 00:03:38,400 --> 00:03:39,400 nie regtig sin maak nie. 94 00:03:39,400 --> 00:03:41,110 Dit help altyd die voorbeelde te sien. 95 00:03:41,110 --> 00:03:42,420 >> So ons het 'n paar selector. 96 00:03:42,420 --> 00:03:49,120 Dit gaan 'n paar identifiseerder vir om te wees wat ons wil hê dat die styl op. 97 00:03:49,120 --> 00:03:52,220 En dan kan ons enige het stel reëls en waardes. 98 00:03:52,220 --> 00:03:55,680 So keurders wat jy dalk sien dalk iets soos die liggaam wees, 99 00:03:55,680 --> 00:04:00,262 of paragraaf met P, of kop, of wat ook al, 100 00:04:00,262 --> 00:04:02,000 alles wat jy wil hê dat jou HTML tags te wees. 101 00:04:02,000 --> 00:04:03,570 >> So in hierdie geval, ons het die liggaam. 102 00:04:03,570 --> 00:04:06,985 En ons het 'n paar reël, wat dit stem ooreen 103 00:04:06,985 --> 00:04:09,610 na wat jou styl van toepassing is. 104 00:04:09,610 --> 00:04:12,720 So in hierdie geval, ons het agtergrond en font gewig. 105 00:04:12,720 --> 00:04:16,200 So dit gaan verander die agtergrond van enigiets 106 00:04:16,200 --> 00:04:19,640 binne 'n liggaam tag van ons HTML-lêer. 107 00:04:19,640 --> 00:04:22,810 En dit gaan om te gee dit hierdie ligblou waarde. 108 00:04:22,810 --> 00:04:24,820 >> So dit gaan die maak agtergrond ligblou. 109 00:04:24,820 --> 00:04:28,660 En dan enigiets binne liggaam is gaan 'n font gewig vet te hê. 110 00:04:28,660 --> 00:04:31,142 So dit is net gaan om te vet almal van ons teks. 111 00:04:31,142 --> 00:04:32,970 En dit is net een selector. 112 00:04:32,970 --> 00:04:34,680 Maar jy kan baie baie van hierdie. 113 00:04:34,680 --> 00:04:38,730 En as ons gaan om te wys later, 'n bietjie meer in hoe 114 00:04:38,730 --> 00:04:40,709 wat werk en meer voorbeelde is daar. 115 00:04:40,709 --> 00:04:41,750 Enigiets wat jy wil byvoeg? 116 00:04:41,750 --> 00:04:42,499 >> TOMAS Reimers: No. 117 00:04:42,499 --> 00:04:43,500 Allison het dit. 118 00:04:43,500 --> 00:04:46,144 Ons is maar net gaan om te sny 'n byvoorbeeld hier op ons voorbeeld site. 119 00:04:46,144 --> 00:04:47,310 So laat ons eintlik neem hierdie. 120 00:04:47,310 --> 00:04:48,620 Dit is ideaal. 121 00:04:48,620 --> 00:04:54,460 So ek is net gaan om te kopieer en plak daardie reg in ons main.css lêer. 122 00:04:54,460 --> 00:04:56,530 En ek gaan om dit te red. 123 00:04:56,530 --> 00:04:59,190 En dan sal ons dit loop. 124 00:04:59,190 --> 00:05:01,600 So kant nota, een van die mees frustrerende dinge 125 00:05:01,600 --> 00:05:04,490 word as jy nie 'n lêer stoor nie, en Dan moet jy, soos, herlaai die bladsy, 126 00:05:04,490 --> 00:05:07,450 en soos, hoekom is nie die verandering gebeur? 127 00:05:07,450 --> 00:05:07,950 Dit gebeur. 128 00:05:07,950 --> 00:05:14,230 So hier het ons gesien dat ons ons webwerf 'n ligte blou agtergrond 129 00:05:14,230 --> 00:05:16,560 en 'n paar vetdruk teks. 130 00:05:16,560 --> 00:05:20,730 >> Ek moet ook noem, as jy ouens het vrae oor enigiets 131 00:05:20,730 --> 00:05:23,622 ons doen, voel asseblief vry om ons te stop en vra ons. 132 00:05:23,622 --> 00:05:25,330 Ons is heeltemal bereid vrae aan akker. 133 00:05:25,330 --> 00:05:27,951 134 00:05:27,951 --> 00:05:31,930 >> ALLISON Buchholtz-AU: Dit is duidelik dat, met CSS, alles bou op sigself. 135 00:05:31,930 --> 00:05:34,107 So as daar een ding doen nie sin maak nou, ons 136 00:05:34,107 --> 00:05:35,690 wil nie dat jy te bog later af. 137 00:05:35,690 --> 00:05:38,390 138 00:05:38,390 --> 00:05:41,930 >> TOMAS Reimers: So laat soort dissekteer hierdie. 139 00:05:41,930 --> 00:05:44,210 So wil jy begin met die selector hier? 140 00:05:44,210 --> 00:05:45,979 >> ALLISON Buchholtz-AU: Ja. 141 00:05:45,979 --> 00:05:48,270 Soos ek voor sê, liggaam is net ons selector hier. 142 00:05:48,270 --> 00:05:50,950 So as ons gaan terug na ons index-- ah. 143 00:05:50,950 --> 00:05:53,245 >> TOMAS Reimers: Wat ek net gesluit. 144 00:05:53,245 --> 00:05:54,530 Gee my 'n tweede. 145 00:05:54,530 --> 00:05:58,286 So File, Open, index.html. 146 00:05:58,286 --> 00:05:59,410 ALLISON Buchholtz-AU: Cool. 147 00:05:59,410 --> 00:06:02,710 So as jy hier sien, het ons het hierdie liggaam tags, reg? 148 00:06:02,710 --> 00:06:06,270 So het die selector ooreenstem net die etikette wat ons praat. 149 00:06:06,270 --> 00:06:07,670 So lyk reg hier. 150 00:06:07,670 --> 00:06:10,315 So wat ons sê is everything-- kan ons teruggaan? 151 00:06:10,315 --> 00:06:12,065 Ek wens ek kon net soos raak die skerm. 152 00:06:12,065 --> 00:06:14,410 Dit sou so baie koeler. 153 00:06:14,410 --> 00:06:17,150 >> So iets binne daardie liggaam etikette, wat ons gesien 154 00:06:17,150 --> 00:06:19,637 was net soos die teks, en die liggaam in die algemeen 155 00:06:19,637 --> 00:06:20,970 verwys na, soos die agtergrond. 156 00:06:20,970 --> 00:06:22,720 As jy ooit wil verander die agtergrond, 157 00:06:22,720 --> 00:06:25,090 wat gaan om te wees in 'n liggaam tag. 158 00:06:25,090 --> 00:06:27,120 Net het hierdie reëls toegepas word vir hulle. 159 00:06:27,120 --> 00:06:32,040 >> So as ons om te gaan na index.html and-- eintlik, 160 00:06:32,040 --> 00:06:33,840 kan ons iets buite die liggaam? 161 00:06:33,840 --> 00:06:37,340 As ons gehad het, soos 'n footer of iets, sou dit nie van toepassing op hierdie. 162 00:06:37,340 --> 00:06:40,900 Maar enigiets binne hierdie liggaam tags gaan 163 00:06:40,900 --> 00:06:44,960 geraak word deur hierdie liggaam selector wat ons gemaak het. 164 00:06:44,960 --> 00:06:47,405 So as jy was om te tik iets anders there-- 165 00:06:47,405 --> 00:06:49,400 >> TOMAS Reimers: Kom ons ry dat die huis. 166 00:06:49,400 --> 00:06:55,330 So as ons 'n div-- so dit is net nog 'n tag wat jy kan hê. 167 00:06:55,330 --> 00:06:56,350 Ek gaan om dit te sluit. 168 00:06:56,350 --> 00:06:58,280 Of laat ons maak dit 'n paragraaf. 169 00:06:58,280 --> 00:07:01,430 So p staan ​​vir paragraaf. 170 00:07:01,430 --> 00:07:02,560 En binne daardie paragraaf. 171 00:07:02,560 --> 00:07:05,650 En dan sê ek: "Dit is die teks." 172 00:07:05,650 --> 00:07:06,369 Cool. 173 00:07:06,369 --> 00:07:09,160 En dan het ek hierdie reël van toepassing op 'n paragraaf in plaas van die liggaam. 174 00:07:09,160 --> 00:07:12,390 175 00:07:12,390 --> 00:07:17,320 Jy sal sien hoe dit slegs van toepassing op die nuutgestigte paragraaf, regs, 176 00:07:17,320 --> 00:07:18,892 nie die hele ding. 177 00:07:18,892 --> 00:07:20,090 Maak dit sin maak? 178 00:07:20,090 --> 00:07:21,840 >> ALLISON Buchholtz-AU: So, dit is al die liggaam, 179 00:07:21,840 --> 00:07:24,450 Maar nou is ons selector net ooreenstem met die paragraaf. 180 00:07:24,450 --> 00:07:27,050 So het ons net vet en blou vir hierdie spesifieke paragraaf, 181 00:07:27,050 --> 00:07:30,760 want dit is die enigste ding wat wat is ingesluit in die p tag. 182 00:07:30,760 --> 00:07:35,349 >> TOMAS Reimers: Maak dit sin soort van hoe dinge omsluit ander dinge? 183 00:07:35,349 --> 00:07:38,140 ALLISON Buchholtz-AU: Ook, net om te sê, soos, een van die beste maniere om 184 00:07:38,140 --> 00:07:40,889 om werklik gemaklik met CSS is om net dinge doen soos hierdie, 185 00:07:40,889 --> 00:07:42,050 net probeer om dit uit. 186 00:07:42,050 --> 00:07:46,700 Dit is baie eenvoudig om iets te tik uit, getref verfris en kyk wat gebeur. 187 00:07:46,700 --> 00:07:48,940 En soos met die meeste CS, eksperimentering kan dikwels 188 00:07:48,940 --> 00:07:51,790 lei tot 'n veel beter intuïtiewe begrip. 189 00:07:51,790 --> 00:07:54,432 Selfs meer as ons net, soos, praat met jou. 190 00:07:54,432 --> 00:07:58,350 >> TOMAS Reimers: Absoluut 100% saamstem oor die punt. 191 00:07:58,350 --> 00:08:02,430 So as ons gaan terug na hierdie, laat ons begin dissektering presies wat die twee doen. 192 00:08:02,430 --> 00:08:04,550 So het ons twee reëls op hierdie punt. 193 00:08:04,550 --> 00:08:07,420 So het die eerste een is die agtergrond. 194 00:08:07,420 --> 00:08:10,590 En jy sien dat ons sit dit gelykstaande aan 'n waarde ligblou. 195 00:08:10,590 --> 00:08:15,009 >> So in CSS, CSS is 'n soort van baie los oor hoe 196 00:08:15,009 --> 00:08:16,300 jy mag kleur te definieer. 197 00:08:16,300 --> 00:08:17,800 So kan jy hulle definieer by die naam. 198 00:08:17,800 --> 00:08:20,650 Jy kan ook iets doen, soos "rooi." 199 00:08:20,650 --> 00:08:25,270 En dan as ons gaan terug na hierdie, sal jy sien dat die agtergrond is rooi. 200 00:08:25,270 --> 00:08:29,040 Jy kan ook really-- Ek dink jy kan 'n bietjie kreatiewe met hierdie, 201 00:08:29,040 --> 00:08:29,540 kan jy nie? 202 00:08:29,540 --> 00:08:31,170 >> ALLISON Buchholtz-AU: Ek dink jy kan blok gebruik. 203 00:08:31,170 --> 00:08:31,250 Kan jy nie? 204 00:08:31,250 --> 00:08:32,083 >> TOMAS Reimers: Ja. 205 00:08:32,083 --> 00:08:32,969 Sodat jy kan gebruik blok. 206 00:08:32,969 --> 00:08:34,490 Maar ek dink die naam-wyse. 207 00:08:34,490 --> 00:08:35,385 Is daar nie? 208 00:08:35,385 --> 00:08:37,260 ALLISON Buchholtz-AU: Jy kan 'n hele paar doen. 209 00:08:37,260 --> 00:08:43,350 Pretty much soos die meeste kleure wat jy kan name-- soos, ek dink salm is een. 210 00:08:43,350 --> 00:08:45,322 >> TOMAS Reimers: Ons gaan probeer salm. 211 00:08:45,322 --> 00:08:47,530 ALLISON Buchholtz-AU: Ek dink chartreuse is daar in. 212 00:08:47,530 --> 00:08:48,050 TOMAS Reimers: Ja. 213 00:08:48,050 --> 00:08:48,550 Sien? 214 00:08:48,550 --> 00:08:50,080 So jy kan 'n bietjie kreatief te wees. 215 00:08:50,080 --> 00:08:52,246 >> ALLISON Buchholtz-AU: Jy kon kry mooi kreatief. 216 00:08:52,246 --> 00:08:55,750 Soos, as jy kan dink van die kleur naam, is dit waarskynlik daar. 217 00:08:55,750 --> 00:08:57,840 As jy regtig wil fyn detail, kan jy gaan blok. 218 00:08:57,840 --> 00:08:58,673 >> TOMAS Reimers: Ja. 219 00:08:58,673 --> 00:08:59,390 So heksadesimale. 220 00:08:59,390 --> 00:09:05,280 As jy ouens onthou dit terug van jou ou PSET, Image herstel, 221 00:09:05,280 --> 00:09:08,300 julle ouens het om te gaan met hierdie blok waardes. 222 00:09:08,300 --> 00:09:15,280 En die soort van te recap wat dit is, blok het drie waardes gestoor in dit. 223 00:09:15,280 --> 00:09:17,250 Dus is dit in groepe van twee inkremente. 224 00:09:17,250 --> 00:09:19,300 Die eerste twee verteenwoordig die rooi waarde. 225 00:09:19,300 --> 00:09:22,420 Die tweede een verteenwoordig die groen waarde. 226 00:09:22,420 --> 00:09:25,020 En die laaste een is blou? 227 00:09:25,020 --> 00:09:30,050 >> So VF gebeur te verteenwoordig 'n heksadesimale 255. 228 00:09:30,050 --> 00:09:35,480 So jy het 255 rooi, 255 groen, en 0 vir blou. 229 00:09:35,480 --> 00:09:37,670 En waardes wissel tussen 0 en 255. 230 00:09:37,670 --> 00:09:38,350 >> GEHOOR: Right. 231 00:09:38,350 --> 00:09:41,472 So in wese, kan ons soek die internet vir enige kleur wat ons wil, 232 00:09:41,472 --> 00:09:43,912 en identifiseer die eintlik bekend kleur spektrum combo, 233 00:09:43,912 --> 00:09:45,130 en dan kan ons dit in? 234 00:09:45,130 --> 00:09:46,380 ALLISON Buchholtz-AU: Presies. 235 00:09:46,380 --> 00:09:52,900 So jy het pretty much volle beheer oor die kleure wat jy wil binne CSS. 236 00:09:52,900 --> 00:09:55,069 Gaan ons praat oor agtergrond beelde later? 237 00:09:55,069 --> 00:09:56,110 Of wil ons dit doen? 238 00:09:56,110 --> 00:09:56,240 >> TOMAS Reimers: Ja. 239 00:09:56,240 --> 00:09:57,010 Absoluut. 240 00:09:57,010 --> 00:10:00,830 So die eerste, net om te wys dat rooi en groen is geel. 241 00:10:00,830 --> 00:10:03,120 En as jy 'n paar help om hierdie, jy 242 00:10:03,120 --> 00:10:05,575 kan Google iets soos "kleur plukker." 243 00:10:05,575 --> 00:10:07,200 ALLISON Buchholtz-AU: O, dit is so goed. 244 00:10:07,200 --> 00:10:09,090 Ek is mal Color Picker. 245 00:10:09,090 --> 00:10:11,360 >> TOMAS Reimers: colorpicker.com is 'n goeie voorbeeld. 246 00:10:11,360 --> 00:10:14,580 En hier, sal jy sien dat jy 'n volle Photoshop-agtige kleur plukker. 247 00:10:14,580 --> 00:10:14,920 >> ALLISON Buchholtz-AU: MM-hm. 248 00:10:14,920 --> 00:10:16,980 Ook, die koel dinge wat jy kleur skemas kan genereer 249 00:10:16,980 --> 00:10:18,896 sodat jy nie het nie, soos, botsende kleure. 250 00:10:18,896 --> 00:10:22,780 TOMAS Reimers: En dan hier is die blok waarde hier. 251 00:10:22,780 --> 00:10:27,800 So kan jy altyd vind aanlyn basies plekke die blok waarde uit te kry. 252 00:10:27,800 --> 00:10:31,667 Dit is nie soort van dat net soos ons sien die kleure van die wêreld in getalle. 253 00:10:31,667 --> 00:10:34,000 Dit is meer as ons gaan aanlyn en vind watter kleur ons wil hê, 254 00:10:34,000 --> 00:10:36,850 en dan neem die nommer neer. 255 00:10:36,850 --> 00:10:39,590 Want dit is net 'n baie maklike manier om dinge te verwys in CS. 256 00:10:39,590 --> 00:10:40,350 >> ALLISON Buchholtz-AU: En dan is daar also-- 257 00:10:40,350 --> 00:10:41,630 Ek vergeet om die presiese naam van die site. 258 00:10:41,630 --> 00:10:43,838 Maar daar is beslis, ek dink, iets van Adobe 259 00:10:43,838 --> 00:10:48,350 wat verwek kleur skemas vir jou, Dit is regtig 'n koel, omdat jy 260 00:10:48,350 --> 00:10:50,580 definitely-- dit soms hard om uit te vind, 261 00:10:50,580 --> 00:10:53,729 O, as ek wil hierdie kleur te gebruik, wat kan 'n nuttige een wees 262 00:10:53,729 --> 00:10:56,395 elders gebruik op my site te, soos, maak dit mooi en samehangende. 263 00:10:56,395 --> 00:11:00,430 264 00:11:00,430 --> 00:11:04,260 >> TOMAS Reimers: Allison se praat oor een deur Adobe genoem Kuler, dink ek. 265 00:11:04,260 --> 00:11:04,885 Dit is K-U-L-E-R. 266 00:11:04,885 --> 00:11:06,259 ALLISON Buchholtz-AU: Ek dink nie so nie. 267 00:11:06,259 --> 00:11:07,610 Ek is redelik seker dit is die een. 268 00:11:07,610 --> 00:11:11,050 >> TOMAS Reimers: My gunsteling het altyd Kleur Skema Designer. 269 00:11:11,050 --> 00:11:13,998 >> ALLISON Buchholtz-AU: Ooh. 270 00:11:13,998 --> 00:11:16,010 >> TOMAS Reimers: Wat is now-- 271 00:11:16,010 --> 00:11:16,860 >> ALLISON Buchholtz-AU: Ag, dit is pragtig. 272 00:11:16,860 --> 00:11:18,818 >> TOMAS Reimers: En jy kan basies sê, soos, 273 00:11:18,818 --> 00:11:21,700 Ek wil drie kleure langs mekaar. 274 00:11:21,700 --> 00:11:25,030 En dan kom ons doen iets mooi. 275 00:11:25,030 --> 00:11:29,210 En dan kan jy 'n voorbeeld kry van wat dit lyk. 276 00:11:29,210 --> 00:11:32,470 En dan as jy hover oor enige van hulle, dit gee jou die blok waarde. 277 00:11:32,470 --> 00:11:35,010 >> So net so 'n goeie manier om te begin dink oor kleur skemas 278 00:11:35,010 --> 00:11:39,570 of watter kleure in 'n webwerf dalk ook saam te gaan. 279 00:11:39,570 --> 00:11:45,655 Want dit kan verbasend wees nie so maklik om af te haal as wat jy dink. 280 00:11:45,655 --> 00:11:48,280 En dan die ander cool ding Ek het nog altyd gevind Oor hierdie webwerf 281 00:11:48,280 --> 00:11:51,480 is as jy getref Voorbeelde, sal dit wys wat 'n voorbeeld webwerf 282 00:11:51,480 --> 00:11:54,800 kan lyk soos die gebruik van daardie kleur skema. 283 00:11:54,800 --> 00:11:56,270 In elk geval. 284 00:11:56,270 --> 00:11:57,863 >> Terug na die werklike CSS. 285 00:11:57,863 --> 00:12:01,112 ALLISON Buchholtz-AU: Maar natuurlik, ons weet hierdie verwysings kan nuttig wees. 286 00:12:01,112 --> 00:12:03,195 TOMAS Reimers: Nee, hulle beslis kan nuttig wees. 287 00:12:03,195 --> 00:12:04,720 So het die tweede reël, Allison? 288 00:12:04,720 --> 00:12:05,844 >> ALLISON Buchholtz-AU: Ja. 289 00:12:05,844 --> 00:12:08,280 Die tweede reël is net ooreenstem met ons font. 290 00:12:08,280 --> 00:12:11,520 So font gewig is net soort of-- so die gewig sou 291 00:12:11,520 --> 00:12:15,220 wees as jy net wil, soos, normale of, soos, dunner fonts, 292 00:12:15,220 --> 00:12:17,251 of in hierdie geval, soos, vet. 293 00:12:17,251 --> 00:12:17,750 Ek vergeet nie. 294 00:12:17,750 --> 00:12:21,557 Wat is die as jy wou it-- is daar 'n dunner een as net, soos, normaal? 295 00:12:21,557 --> 00:12:24,140 TOMAS Reimers: Ek doen dit nie eintlik weet as daar 'n dunner een. 296 00:12:24,140 --> 00:12:24,680 ALLISON Buchholtz-AU: ek vergeet. 297 00:12:24,680 --> 00:12:26,300 So font gewig ons gewoonlik net gebruik vir vet. 298 00:12:26,300 --> 00:12:29,010 As jy wil regtig in dit, ons gaan om jou te wys. 299 00:12:29,010 --> 00:12:34,317 W3Schools het al die verskillende dinge wat jy kan doen vir fonts. 300 00:12:34,317 --> 00:12:36,900 Maar basies, as jy ooit wil niks oor font te verander, 301 00:12:36,900 --> 00:12:39,330 dit is altyd gaan wees, soos, font-iets. 302 00:12:39,330 --> 00:12:43,450 So dit sal wees soos, font-family as jy probeer om die werklike tipe te verander. 303 00:12:43,450 --> 00:12:47,390 Dit sal font-style as jy wees dit wil maak soos lopende, 304 00:12:47,390 --> 00:12:49,710 of kursief, of iets anders. 305 00:12:49,710 --> 00:12:53,570 Of selfs font-kleur, indien ons wou dit te verander. 306 00:12:53,570 --> 00:12:55,621 >> TOMAS Reimers: Yup. 307 00:12:55,621 --> 00:12:56,925 So jy kan dit verander. 308 00:12:56,925 --> 00:12:59,360 En die soort van net om te herhaling nou, sodat jy kan 309 00:12:59,360 --> 00:13:01,400 sien dat ons die selector hier. 310 00:13:01,400 --> 00:13:03,000 Ons het hierdie krullerige draadjies. 311 00:13:03,000 --> 00:13:06,735 En dan het ons reëls afgebaken deur kommapunte. 312 00:13:06,735 --> 00:13:08,100 Maak dit sin maak? 313 00:13:08,100 --> 00:13:09,130 Ja? 314 00:13:09,130 --> 00:13:10,500 Cool. 315 00:13:10,500 --> 00:13:13,200 So as dit is good-- 316 00:13:13,200 --> 00:13:14,424 >> ALLISON Buchholtz-AU: Terug. 317 00:13:14,424 --> 00:13:17,590 TOMAS Reimers: Kom ons praat spesifiek oor watter soort van die keurders wat ons het. 318 00:13:17,590 --> 00:13:19,790 Want nou het ons het soort van net getoon tags. 319 00:13:19,790 --> 00:13:21,696 Maar julle ouens kon sien dit geloofwaardig. 320 00:13:21,696 --> 00:13:23,570 Sê jy het twee paragrawe op 'n bladsy en jy 321 00:13:23,570 --> 00:13:26,087 wil in staat wees om te styl een, maar nie die ander, 322 00:13:26,087 --> 00:13:29,170 jy nie net wil om jouself te beperk te hê verskillende werklike HTML te gebruik 323 00:13:29,170 --> 00:13:33,410 tags aan hulle te gee die verskillende style. 324 00:13:33,410 --> 00:13:35,995 >> So het ons drie basiese tipes keurders. 325 00:13:35,995 --> 00:13:37,120 ALLISON Buchholtz-AU: Ja. 326 00:13:37,120 --> 00:13:39,828 Dus het ons tag, en dit is wat ons het gepraat oor nou. 327 00:13:39,828 --> 00:13:42,430 So dit is soort van soos jou liggaam of p. 328 00:13:42,430 --> 00:13:46,280 En dan het ons klas, wat is wanneer ons dit definieer in ons CSS-lêer, 329 00:13:46,280 --> 00:13:49,907 dit is altyd gaan dot word, wat ook al jy wil die naam van jou klas te wees. 330 00:13:49,907 --> 00:13:51,490 En dit kan toepas om verskeie dinge. 331 00:13:51,490 --> 00:13:54,610 332 00:13:54,610 --> 00:13:57,610 >> Sê jy het vyf paragrawe en twee van die drie van hulle 333 00:13:57,610 --> 00:14:00,580 moet dieselfde styl te word, sou jy 'n klas van toepassing is. 334 00:14:00,580 --> 00:14:03,040 En dit is net die manier waarop ons dit doen. 335 00:14:03,040 --> 00:14:05,600 Ons gee jou 'n voorbeeld van waar dit eintlik toon. 336 00:14:05,600 --> 00:14:11,030 Maar as jy dalk 'n paar tag p, nadat dit, sou jy skryf, 337 00:14:11,030 --> 00:14:14,170 klas gelyk wat klasse jy wil aansoek doen om dit te. 338 00:14:14,170 --> 00:14:19,280 Dus, wat die klas keurders wat ons wil om aansoek te doen om hierdie spesifieke paragraaf, 339 00:14:19,280 --> 00:14:21,300 ons kon net skryf soos hierdie. 340 00:14:21,300 --> 00:14:24,080 Van die kursus, ek dink 'n voorbeeld maak dit baie meer beton. 341 00:14:24,080 --> 00:14:27,270 >> Die ander een wat ons het is id, wat ons aandui 342 00:14:27,270 --> 00:14:29,707 met 'n hash, of pond, of hashtag. 343 00:14:29,707 --> 00:14:30,790 TOMAS Reimers: Octothorpe. 344 00:14:30,790 --> 00:14:32,430 ALLISON Buchholtz-AU: Octothorpe. 345 00:14:32,430 --> 00:14:34,550 Dit werk ook. 346 00:14:34,550 --> 00:14:36,640 En hierdie een moet regtig uniek wees. 347 00:14:36,640 --> 00:14:39,880 Hulle moet net van toepassing op een ding op jou bladsy. 348 00:14:39,880 --> 00:14:43,820 Dus, of dit is 'n spesifieke paragraaf, of 'n item in 'n lys, of wat ook al, 349 00:14:43,820 --> 00:14:45,090 dit moet uniek wees. 350 00:14:45,090 --> 00:14:48,730 En op dieselfde manier dat ons net sê, soos, class = "class1 CLASS2," 351 00:14:48,730 --> 00:14:51,577 dit kan net wees id van alles wat ons het. 352 00:14:51,577 --> 00:14:52,410 TOMAS Reimers: Ja. 353 00:14:52,410 --> 00:14:54,330 So laat ons beslis praat oor voorbeelde hier. 354 00:14:54,330 --> 00:14:58,170 En ek is net gaan om te duik reguit terug in die kode. 355 00:14:58,170 --> 00:15:02,090 So laat ons kyk na ons HTML. 356 00:15:02,090 --> 00:15:03,960 En so het ons nou een paragraaf. 357 00:15:03,960 --> 00:15:05,510 Dit is die teks. 358 00:15:05,510 --> 00:15:09,151 Ek is net gaan om te verander dit. "Dit is die teks 1." 359 00:15:09,151 --> 00:15:11,150 En dan gaan ons 'n "Dit is die teks 2." 360 00:15:11,150 --> 00:15:12,525 >> ALLISON Buchholtz-AU: Tweede een. 361 00:15:12,525 --> 00:15:13,540 TOMAS Reimers: Yup. 362 00:15:13,540 --> 00:15:16,810 So het ons nou '"Dit is die teks 2," reg? 363 00:15:16,810 --> 00:15:21,560 En ons gaan om te sien dat as ons herlaai die bladsy, wat ons gaan om te vind 364 00:15:21,560 --> 00:15:23,067 is ons gaan find-- 365 00:15:23,067 --> 00:15:24,150 ALLISON Buchholtz-AU: Ooh. 366 00:15:24,150 --> 00:15:24,983 TOMAS Reimers: Ja. 367 00:15:24,983 --> 00:15:27,570 Ons gaan vind 'n "Dit is teks 1 "en" Dit is die teks 2. " 368 00:15:27,570 --> 00:15:28,650 >> ALLISON Buchholtz-AU: En uit pragtige geel kleur. 369 00:15:28,650 --> 00:15:31,066 >> TOMAS Reimers: En jy sal sien dat ons selector nou, 370 00:15:31,066 --> 00:15:34,940 wat van toepassing is op p's, of paragrawe, wat beide van hulle, 371 00:15:34,940 --> 00:15:38,700 omdat beide van hulle voldoen aan die voorwaarde dat hulle is albei 'n p tag. 372 00:15:38,700 --> 00:15:40,360 Dit is sinvol. 373 00:15:40,360 --> 00:15:43,340 So die vraag is, wel, wat As ons wou net een kry? 374 00:15:43,340 --> 00:15:46,350 So presies soos Allison sê, Ons het twee ander maniere om dit te doen. 375 00:15:46,350 --> 00:15:47,320 Ek gaan om te begin met id. 376 00:15:47,320 --> 00:15:48,405 >> ALLISON Buchholtz-AU: Kom ons begin met id. 377 00:15:48,405 --> 00:15:50,405 >> TOMAS Reimers: En albei hierdie is eienskappe. 378 00:15:50,405 --> 00:15:53,200 So eienskappe bestaan ​​in HTML. 379 00:15:53,200 --> 00:15:55,600 En wat hulle is, is iets wat jy voeg 380 00:15:55,600 --> 00:15:58,840 binne-in die tag wat skei van die tag naam. 381 00:15:58,840 --> 00:16:01,301 So jy kan het veelvuldige eienskappe. 382 00:16:01,301 --> 00:16:01,800 Ja? 383 00:16:01,800 --> 00:16:03,950 >> ALLISON Buchholtz-AU: Ek was net gaan om te sê, van jou voorbeeld van PSET 7, 384 00:16:03,950 --> 00:16:06,650 Indien enige van julle probeer te bring dinge aan die sentrum, 385 00:16:06,650 --> 00:16:08,550 jy dalk gebruik het "Teks align = sentrum." 386 00:16:08,550 --> 00:16:10,550 En jy is dit waarskynlik opgemerk moet gesentreer het 387 00:16:10,550 --> 00:16:12,650 jou teks of jou navigasie bar. 388 00:16:12,650 --> 00:16:15,499 So dit is net ook 'n kenmerk dat jy vertroud is met al mag wees. 389 00:16:15,499 --> 00:16:18,040 TOMAS Reimers: Daar is 'n klomp van eienskappe wat jy sal sien. 390 00:16:18,040 --> 00:16:18,539 Ja. 391 00:16:18,539 --> 00:16:21,250 Soos goeie verwysing na PSET 7. 392 00:16:21,250 --> 00:16:23,150 Ons het id. 393 00:16:23,150 --> 00:16:25,080 Jy kan ook ' klas, dinge soos hierdie. 394 00:16:25,080 --> 00:16:27,250 'N Enkele tag kan baie eienskappe. 395 00:16:27,250 --> 00:16:33,140 So begin met id, laat se voorgee ons wil 'n id of-- Ek weet nie te hê. 396 00:16:33,140 --> 00:16:35,140 Ons sal dit noem spesiale, want hierdie een, ons is 397 00:16:35,140 --> 00:16:37,867 gaan vet te maak, en onderstreep, en wat ook al. 398 00:16:37,867 --> 00:16:39,950 ALLISON Buchholtz-AU: Dis nou eers super spesiaal. 399 00:16:39,950 --> 00:16:42,360 TOMAS Reimers: So hierdie een, ons het id spesiaal. 400 00:16:42,360 --> 00:16:48,140 So het die manier om dit te kies, dan is in main.css, eerder as 'n p tag, 401 00:16:48,140 --> 00:16:51,500 jy doen #special, OK? 402 00:16:51,500 --> 00:16:55,538 En wat kies die ding met id spesiaal. 403 00:16:55,538 --> 00:16:57,295 Is dit sin maak vir almal? 404 00:16:57,295 --> 00:16:57,920 GEHOOR: Ja. 405 00:16:57,920 --> 00:16:59,110 TOMAS Reimers: Cool. 406 00:16:59,110 --> 00:17:04,440 So nou as ons gaan terug, ons sal see-- Oeps. 407 00:17:04,440 --> 00:17:06,240 Ja. 408 00:17:06,240 --> 00:17:09,460 Ons sal sien dat dit net kies die een met id spesiaal. 409 00:17:09,460 --> 00:17:10,622 Ja? 410 00:17:10,622 --> 00:17:11,900 Klink cool. 411 00:17:11,900 --> 00:17:12,570 Ja. 412 00:17:12,570 --> 00:17:15,456 >> GEHOOR: Kan iets het 'n kenmerk van beide die klas en 'n id? 413 00:17:15,456 --> 00:17:16,359 >> TOMAS Reimers: Ja. 414 00:17:16,359 --> 00:17:16,900 GEHOOR: OK. 415 00:17:16,900 --> 00:17:20,887 En dan wat gebeur as jy dan gee dit 'n paar reëls in CSS dat konflik? 416 00:17:20,887 --> 00:17:21,970 TOMAS Reimers: Absoluut. 417 00:17:21,970 --> 00:17:23,940 Ons gaan beslis om te praat oor dit. 418 00:17:23,940 --> 00:17:31,890 So presies wat jy is om op, kan jy ook 'klasse. 419 00:17:31,890 --> 00:17:36,380 So laat ons voorgee ek het drie paragrawe en ek 420 00:17:36,380 --> 00:17:38,730 wou die eerste om die styl twee, maar nie die derde. 421 00:17:38,730 --> 00:17:42,850 Wel, kan jou eerste idee wees, goed, ek kon net gee die tweede een 'n id. 422 00:17:42,850 --> 00:17:45,590 Maar jy kan nie, want 'n ID, presies soos Allison sê, 423 00:17:45,590 --> 00:17:47,330 moet uniek wees. 424 00:17:47,330 --> 00:17:50,860 >> So in plaas van 'n ID, wat jy kan gebruik, is jy 'n klas gebruik. 425 00:17:50,860 --> 00:17:57,880 En 'n class-- wat dit moontlik maak om te doen is basies sê, 426 00:17:57,880 --> 00:17:59,610 dit behoort as deel van 'n groep. 427 00:17:59,610 --> 00:18:02,410 In hierdie geval, ons groep is 'n spesiale genoem. 428 00:18:02,410 --> 00:18:06,500 En wat gaan ons dan doen is ons gaan say-- eerder as pond, 429 00:18:06,500 --> 00:18:08,070 ons gaan dot te gebruik. 430 00:18:08,070 --> 00:18:08,740 OK? 431 00:18:08,740 --> 00:18:11,950 En sien dat die pond en dot slegs binne die CSS-lêer bestaan ​​nie, 432 00:18:11,950 --> 00:18:12,797 nie binne die HTML. 433 00:18:12,797 --> 00:18:13,880 ALLISON Buchholtz-AU: Ja. 434 00:18:13,880 --> 00:18:15,185 Belangrike onderskeid. 435 00:18:15,185 --> 00:18:17,510 >> TOMAS Reimers: Ek het het soveel stryd, 436 00:18:17,510 --> 00:18:23,990 want ek het die hash in die HTML en dan net gevoel dom vir 'n lang tyd. 437 00:18:23,990 --> 00:18:27,470 Kyk hoe dit kies beide van die kinders met daardie klas? 438 00:18:27,470 --> 00:18:28,210 Cool. 439 00:18:28,210 --> 00:18:29,950 >> Nou, kan dinge het verskeie klasse. 440 00:18:29,950 --> 00:18:32,790 Kom ons sê ek wou die eerste te maak twee het 'n agtergrond van geel 441 00:18:32,790 --> 00:18:36,770 en die tweede twee het 'n lettertipe kleur van blou. 442 00:18:36,770 --> 00:18:37,270 OK. 443 00:18:37,270 --> 00:18:39,735 Ek weet nie regtig hoekom ek wil wil doen, maar ek kan. 444 00:18:39,735 --> 00:18:42,401 >> ALLISON Buchholtz-AU: dalk nie vir jou webwerf aanbeveel nie. 445 00:18:42,401 --> 00:18:43,880 Maar vir ons doeleindes, sal dit doen. 446 00:18:43,880 --> 00:18:46,294 >> TOMAS Reimers: Dit is nie 'n goeie kleur skema. 447 00:18:46,294 --> 00:18:49,210 ALLISON Buchholtz-AU: Wel, geel en blou is my hoërskool kleure. 448 00:18:49,210 --> 00:18:50,947 Ek weet nie, al is. 449 00:18:50,947 --> 00:18:53,530 TOMAS Reimers: Allison se hoë skool het 'n groot kleurskema. 450 00:18:53,530 --> 00:18:54,520 [Gelag] 451 00:18:54,520 --> 00:18:59,120 So dan wat ons kan noem dit ' Kom ons noem this-- sodat ons het 'n spesiale 452 00:18:59,120 --> 00:19:00,030 en ons het Pretty. 453 00:19:00,030 --> 00:19:02,405 Ek stel voor, want dit, jy gebruik veel meer beskrywende name. 454 00:19:02,405 --> 00:19:05,820 ALLISON Buchholtz-AU: Ja, ek wil noem dit, soos, geel of blou. 455 00:19:05,820 --> 00:19:08,314 >> TOMAS Reimers: Ons is nie werklik 'n ware webwerf, 456 00:19:08,314 --> 00:19:09,730 wat is die rede waarom ons nie om dit te doen. 457 00:19:09,730 --> 00:19:11,521 Maar as jy eintlik 'n ware webwerf, jy 458 00:19:11,521 --> 00:19:16,220 mag hê, soos, artikel kop, Artikel inhoud, eerste woord, 459 00:19:16,220 --> 00:19:21,920 dinge soos wat, wat toelaat dat jy baie meer beskrywende. 460 00:19:21,920 --> 00:19:23,550 Dit is regtig net soos veranderlikes. 461 00:19:23,550 --> 00:19:28,390 Hulle moet op 'n manier waar genoem word wat jy kan, like-- ja, as sodanig. 462 00:19:28,390 --> 00:19:29,470 Volmaak. 463 00:19:29,470 --> 00:19:30,480 >> So agtergrond. 464 00:19:30,480 --> 00:19:35,920 En dan gaan ons so die say-- manier om kleur te verander is net "kleur." 465 00:19:35,920 --> 00:19:38,412 En ons gaan dit blou te maak. 466 00:19:38,412 --> 00:19:40,150 Dit is cool. 467 00:19:40,150 --> 00:19:42,640 So nou het ons die eerste twee spesiale. 468 00:19:42,640 --> 00:19:45,972 Volgende een gaan het "class = mooi." 469 00:19:45,972 --> 00:19:49,180 ALLISON Buchholtz-AU: en dan sal jy wil byvoeg "mooi" aan die middelste een. 470 00:19:49,180 --> 00:19:49,971 TOMAS Reimers: Yup. 471 00:19:49,971 --> 00:19:52,970 En dan na die middelste, by te voeg "mooi," wat gebeur 472 00:19:52,970 --> 00:19:56,880 is jy net 'n ruimte. 473 00:19:56,880 --> 00:19:59,800 So die klas kenmerk is 'n ruimte-geskeide lys 474 00:19:59,800 --> 00:20:02,450 van al die klasse wat van toepassing is op daardie etiket. 475 00:20:02,450 --> 00:20:02,959 OK? 476 00:20:02,959 --> 00:20:05,750 Dit is nie soos hierdie een behoort te 'n soort van spesiale klas genoem 477 00:20:05,750 --> 00:20:07,180 "Spesiale, ruimte, mooi." 478 00:20:07,180 --> 00:20:10,870 Dit behoort aan twee classes-- spesiale en mooi. 479 00:20:10,870 --> 00:20:12,492 Ja? 480 00:20:12,492 --> 00:20:14,360 Cool. 481 00:20:14,360 --> 00:20:17,010 >> En dan as ons kyk wat gebeur, ons is 482 00:20:17,010 --> 00:20:21,850 gaan om te sien dat die eerste een het geel agtergrond, swart teks. 483 00:20:21,850 --> 00:20:22,450 Tweede one-- 484 00:20:22,450 --> 00:20:26,160 >> ALLISON Buchholtz-AU: --has vet geel agtergrond met 'n blou teks. 485 00:20:26,160 --> 00:20:29,330 En ons laaste een het net die blou teks wat ons aan hom opgedra. 486 00:20:29,330 --> 00:20:30,870 >> TOMAS Reimers: Cool? 487 00:20:30,870 --> 00:20:32,491 Hoe keurders werk? 488 00:20:32,491 --> 00:20:32,990 Awesome. 489 00:20:32,990 --> 00:20:34,720 >> ALLISON Buchholtz-AU: Het ons wil praat oor die konflik dan nou? 490 00:20:34,720 --> 00:20:35,780 >> TOMAS Reimers: So ja. 491 00:20:35,780 --> 00:20:36,310 Absoluut. 492 00:20:36,310 --> 00:20:38,380 So wat gebeur as jy het 'n konflik, reg? 493 00:20:38,380 --> 00:20:44,740 Kom ons maak die eerste een stel iets like-- 494 00:20:44,740 --> 00:20:47,240 ALLISON Buchholtz-AU: Miskien hierdie een verander die agtergrond? 495 00:20:47,240 --> 00:20:48,090 TOMAS Reimers: Ja. 496 00:20:48,090 --> 00:20:51,699 So ons gaan maak "mooi" verander die agtergrond te salm. 497 00:20:51,699 --> 00:20:54,740 ALLISON Buchholtz-AU: Jy is net met al die groot kleure vandag Tomas. 498 00:20:54,740 --> 00:20:55,573 TOMAS Reimers: Ja. 499 00:20:55,573 --> 00:20:58,200 Omdat ek uitgevind ek kan gebruik salm as 'n ware kleur. 500 00:20:58,200 --> 00:21:00,270 So ons is net gaan om dit te doen nie. 501 00:21:00,270 --> 00:21:01,770 Ek dink ook Sunset is 'n ware kleur. 502 00:21:01,770 --> 00:21:03,103 GEHOOR: Sunset is 'n ware kleur? 503 00:21:03,103 --> 00:21:04,572 ALLISON Buchholtz-AU: Kom ons probeer dit. 504 00:21:04,572 --> 00:21:07,735 TOMAS Reimers: Na hierdie demo net omdat in die geval is dit rommel op, 505 00:21:07,735 --> 00:21:08,943 Ek wil nie te wees debugging. 506 00:21:08,943 --> 00:21:11,580 So ons weet salm is 'n ware kleur. 507 00:21:11,580 --> 00:21:15,626 So enige raaiskote op wat gaan gebeur? 508 00:21:15,626 --> 00:21:17,522 >> ALLISON Buchholtz-AU: Enige idee? 509 00:21:17,522 --> 00:21:20,002 >> GEHOOR: [onhoorbaar]. 510 00:21:20,002 --> 00:21:20,920 >> TOMAS Reimers: Ja. 511 00:21:20,920 --> 00:21:22,150 So jy het dit presies reg. 512 00:21:22,150 --> 00:21:24,930 Eintlik is dit neem om die laaste reël dat dit gegee is. 513 00:21:24,930 --> 00:21:27,860 >> ALLISON Buchholtz-AU: So is dit waar waterval in werking tree. 514 00:21:27,860 --> 00:21:31,080 >> TOMAS Reimers: onthou So hoe ons gehad het dat die waterval style sheets? 515 00:21:31,080 --> 00:21:33,660 So deur daardie, ons soort beteken dat ons 'n klomp van die reëls 516 00:21:33,660 --> 00:21:37,115 wat van toepassing is op die top van mekaar, en hulle kan ook ignoreer mekaar. 517 00:21:37,115 --> 00:21:39,380 >> ALLISON Buchholtz-AU: So wat se aan die onderkant 518 00:21:39,380 --> 00:21:41,540 sal ignoreer net die aan die bokant. 519 00:21:41,540 --> 00:21:45,842 Jy kan reëls wat heeltemal het negeer iets vooraf. 520 00:21:45,842 --> 00:21:48,300 Dit is ook die rede waarom jy wil wees versigtig wanneer jy stilering, 521 00:21:48,300 --> 00:21:51,465 sodat jy nie die skep van reëls wat jy net heeltemal oorheersende. 522 00:21:51,465 --> 00:21:53,340 >> TOMAS Reimers: Of miskien het jy wil reëls te vervang. 523 00:21:53,340 --> 00:21:53,920 >> ALLISON Buchholtz-AU: Of miskien het jy te doen. 524 00:21:53,920 --> 00:21:54,300 Ja. 525 00:21:54,300 --> 00:21:57,175 >> TOMAS Reimers: Verbeel jou jy het 'n klas wat geld vir die meeste dinge, 526 00:21:57,175 --> 00:22:01,220 maar laat ons sê jy wil die te verander agtergrond tot rooi en die skrif 527 00:22:01,220 --> 00:22:03,140 gewig te vet vir die meeste dinge, maar vir een, 528 00:22:03,140 --> 00:22:06,098 jy wil net die agtergrond rooi te wees, maar jy wil al die ander 529 00:22:06,098 --> 00:22:09,990 eienskappe, kan jy iets doen soos "font-weight = normaal," 530 00:22:09,990 --> 00:22:12,760 wat dan ongedaan dat vet verandering. 531 00:22:12,760 --> 00:22:14,480 Ja? 532 00:22:14,480 --> 00:22:17,250 Weereens, die beste manier, ek dink Allison het gesê dit is net die praktyk. 533 00:22:17,250 --> 00:22:18,080 >> ALLISON Buchholtz-AU: Eksperimentering. 534 00:22:18,080 --> 00:22:20,090 >> TOMAS Reimers: Oefen, oefen, praktyk, en eksperimenteer. 535 00:22:20,090 --> 00:22:22,950 Ek weet 'n baie van die mense wat dink CSS is net 'n baie raaiskoot-en-tjek 536 00:22:22,950 --> 00:22:25,580 aan die einde van die dag, waar as jy wil something-- wil doen, 537 00:22:25,580 --> 00:22:27,663 jy het 'n idee nie, maar jy waarskynlik nog nodig 538 00:22:27,663 --> 00:22:31,390 dit uit te probeer om seker te maak jy weet hoe dit lyk. 539 00:22:31,390 --> 00:22:34,482 >> GEHOOR: Wanneer jy aansoek doen klasse, meer as een 540 00:22:34,482 --> 00:22:37,339 dieselfde paragraaf of artikel, beteken dit 541 00:22:37,339 --> 00:22:39,505 saak watter volgorde jy kan tik hulle in die aanhalings? 542 00:22:39,505 --> 00:22:40,992 >> TOMAS Reimers: Nee, glad nie. 543 00:22:40,992 --> 00:22:45,764 >> ALLISON Buchholtz-AU: Wat belangrik is, is die orde binne jou CSS style sheet. 544 00:22:45,764 --> 00:22:47,430 GEHOOR: Kan jy die vraag herhaal? 545 00:22:47,430 --> 00:22:50,680 TOMAS Reimers: Oh. 546 00:22:50,680 --> 00:22:53,990 ALLISON Buchholtz-AU: Binne klas, wanneer jy gee klasse 547 00:22:53,990 --> 00:22:56,964 na iets in die HTML, doen dit saak wat om hulle in? 548 00:22:56,964 --> 00:22:58,130 Dit maak nie saak aan die orde. 549 00:22:58,130 --> 00:23:02,915 Wat belangrik is, is aan die orde van die klas keurders binne jou CSS, 550 00:23:02,915 --> 00:23:04,306 binne jou style sheet. 551 00:23:04,306 --> 00:23:06,982 >> TOMAS Reimers: Sound goed? 552 00:23:06,982 --> 00:23:08,532 >> ALLISON Buchholtz-AU: Lovely. 553 00:23:08,532 --> 00:23:11,539 >> TOMAS Reimers: En dan ons gaan om voort te gaan aan- 554 00:23:11,539 --> 00:23:13,330 ALLISON Buchholtz-AU: Wat doen ons nou? 555 00:23:13,330 --> 00:23:14,245 Ek vergeet nie. 556 00:23:14,245 --> 00:23:16,087 O, ons moet net voorbeelde. 557 00:23:16,087 --> 00:23:17,295 Maar ons het soort van gedoen om daardie. 558 00:23:17,295 --> 00:23:18,990 Ons het voorbeelde gedoen op die vlieg. 559 00:23:18,990 --> 00:23:20,540 >> TOMAS Reimers: Ons kry te kombineer die keurders gou. 560 00:23:20,540 --> 00:23:22,790 >> ALLISON Buchholtz-AU: Ag, kry ons keurders te kombineer. 561 00:23:22,790 --> 00:23:25,260 TOMAS Reimers: So 'n paar voorbeelde is ons 562 00:23:25,260 --> 00:23:29,630 # Dog-- pond, of hashtag, of octothorpe, of wat ook al 563 00:23:29,630 --> 00:23:32,050 jy wil that-- skerp te bel. 564 00:23:32,050 --> 00:23:34,875 >> ALLISON Buchholtz-AU: Skerp hond. 565 00:23:34,875 --> 00:23:36,470 >> TOMAS Reimers: Dan het jy .pets. 566 00:23:36,470 --> 00:23:39,059 567 00:23:39,059 --> 00:23:41,600 Iets het 'n ID van die hond, daar is net een hond op die bladsy. 568 00:23:41,600 --> 00:23:43,870 Iets het 'n id van kat, daar is net een kat. 569 00:23:43,870 --> 00:23:45,665 Daar kan baie troeteldiere op die bladsy. 570 00:23:45,665 --> 00:23:47,570 Dit is hoekom ons gegee het dat die klasse. 571 00:23:47,570 --> 00:23:48,740 Jy het 'n voorbeeld van p. 572 00:23:48,740 --> 00:23:50,490 En dan so een van die laaste voorbeeld, wat 573 00:23:50,490 --> 00:23:53,790 is iets wat ons het nie gepraat oor, is wat gebeur wanneer jy kombineer hulle. 574 00:23:53,790 --> 00:23:54,580 So p.pets. 575 00:23:54,580 --> 00:23:57,510 576 00:23:57,510 --> 00:24:02,950 >> So vir wat, laat ons gaan terug na die kode en stel another-- ja. 577 00:24:02,950 --> 00:24:04,290 So terug hier. 578 00:24:04,290 --> 00:24:04,850 >> ALLISON Buchholtz-AU: Ek voel soos hierdie is really-- 579 00:24:04,850 --> 00:24:08,105 soos net kyk deur voorbeelde is eintlik die manier om dit te leer. 580 00:24:08,105 --> 00:24:09,360 So dit is wat ons doen. 581 00:24:09,360 --> 00:24:14,030 >> TOMAS Reimers: So laat se voorgee ons wil net teks 2, reg om te kies? 582 00:24:14,030 --> 00:24:16,530 Sodat ons kan beslis nie doen met 'n id. 583 00:24:16,530 --> 00:24:19,620 Wel, ons kan dit doen met 'n id, maar dit het nie 'n ID. 584 00:24:19,620 --> 00:24:22,490 Ek kan 'n mens byvoeg, maar laat ons voorgee dat ek nie wil om een ​​te voeg 585 00:24:22,490 --> 00:24:24,910 of dit reeds iets anders. 586 00:24:24,910 --> 00:24:26,516 Ek kan dit nie doen nie met dit. 587 00:24:26,516 --> 00:24:28,870 Die merker is beslis nie uniek nie, reg? 588 00:24:28,870 --> 00:24:30,670 En nie een is die klas. 589 00:24:30,670 --> 00:24:32,314 Maar jy kan hierdie dinge kombineer. 590 00:24:32,314 --> 00:24:35,230 Kom ons sê ons wou iets te doen wat slegs van toepassing op dinge wat 591 00:24:35,230 --> 00:24:39,420 het die klas spesiale en wat die klas mooi. 592 00:24:39,420 --> 00:24:48,150 >> So, wat jy kan doen is in main.css, jy kan sê, laat ons eers verwyder nie. 593 00:24:48,150 --> 00:24:50,240 Jy kan kombineer hierdie. 594 00:24:50,240 --> 00:24:51,430 So jy kan doen .special. 595 00:24:51,430 --> 00:24:52,110 Geen spasie. 596 00:24:52,110 --> 00:24:54,770 Net .special.pretty. 597 00:24:54,770 --> 00:25:00,550 Wat dit beteken, is iets wat beide spesiale en mooi. 598 00:25:00,550 --> 00:25:01,900 Maak dit sin maak? 599 00:25:01,900 --> 00:25:04,190 En as ons hier gaan, wat jy gaan om te sien 600 00:25:04,190 --> 00:25:09,734 is hierdie reël slegs van toepassing op die tweede een, wat beide van hulle. 601 00:25:09,734 --> 00:25:11,400 En jy kan dit doen vir 'n baie van die dinge. 602 00:25:11,400 --> 00:25:13,270 Jy kan say-- laat asof ek wou net 603 00:25:13,270 --> 00:25:18,300 dinge wat die klas mooi te doen en wat ook 'n paragraaf tag. 604 00:25:18,300 --> 00:25:19,920 So p.pretty. 605 00:25:19,920 --> 00:25:23,585 Kom ons maak dat ek ' iets mooi op die etiket liggaam. 606 00:25:23,585 --> 00:25:25,850 OK? 607 00:25:25,850 --> 00:25:28,490 Ek kan hardloop en ek kan sien dat dit net 608 00:25:28,490 --> 00:25:32,720 gaan om aansoek te doen om dinge wat paragrawe met die klas mooi. 609 00:25:32,720 --> 00:25:35,650 En jy kan kombineer hierdie, basies, so veel as wat jy wil. 610 00:25:35,650 --> 00:25:38,580 So kan jy net sit hulle saam. 611 00:25:38,580 --> 00:25:39,604 Maak dit sin maak? 612 00:25:39,604 --> 00:25:41,770 ALLISON Buchholtz-AU: So hierdie soort is meer nuttig 613 00:25:41,770 --> 00:25:45,490 wanneer, was Tomas vroeër gesê, miskien jy het 'n baie ingewikkelde webwerf, 614 00:25:45,490 --> 00:25:48,050 en jy het reeds 'n baie van hierdie reëls geskryf is, 615 00:25:48,050 --> 00:25:51,170 en jy hoef net te kombineer twee van tevore. 616 00:25:51,170 --> 00:25:55,350 Soos in plaas van 'n hele skryf nuwe selector en daar om dit te verander, 617 00:25:55,350 --> 00:25:58,592 jy kan net kombineer hulle waar dit oorvleuel. 618 00:25:58,592 --> 00:26:00,670 >> TOMAS Reimers: Of jy kan soms vind out-- 619 00:26:00,670 --> 00:26:04,290 daar is een klas wat maak font kleur soos blou, 620 00:26:04,290 --> 00:26:06,740 en daar is 'n ander klas wat maak die agtergrond blou. 621 00:26:06,740 --> 00:26:07,840 En dat sal net nie werk nie. 622 00:26:07,840 --> 00:26:10,924 So jy 'n spesiale geval skryf, waar, like-- maar as dit het beide, wat jy 623 00:26:10,924 --> 00:26:13,548 gaan doen, is jy gaan om te maak hierdie een van hierdie skakering van blou 624 00:26:13,548 --> 00:26:15,310 en hierdie een van hierdie ander skakering van blou. 625 00:26:15,310 --> 00:26:15,580 Reg? 626 00:26:15,580 --> 00:26:17,955 >> ALLISON Buchholtz-AU: Goeie vir diegene soorte uitsonderings. 627 00:26:17,955 --> 00:26:21,220 TOMAS Reimers: So te dink oor probleme 628 00:26:21,220 --> 00:26:25,000 wat mag ontstaan ​​wanneer jy kombineer hulle. 629 00:26:25,000 --> 00:26:27,020 Cool. 630 00:26:27,020 --> 00:26:29,692 So terug na ons aanbieding. 631 00:26:29,692 --> 00:26:31,400 ALLISON Buchholtz-AU: Ons is amper daar. 632 00:26:31,400 --> 00:26:34,022 TOMAS Reimers: En dit het gestop verbind. 633 00:26:34,022 --> 00:26:36,494 ALLISON Buchholtz-AU: O, nee. 634 00:26:36,494 --> 00:26:39,125 ALLISON Buchholtz-AU: CS by die kantoor, internet gaan. 635 00:26:39,125 --> 00:26:40,360 O, die ironie. 636 00:26:40,360 --> 00:26:45,620 >> TOMAS Reimers: So gelukkig, kan ons aanbied sonder die internet, dink ek, 637 00:26:45,620 --> 00:26:47,380 want ons het al die skyfies hier. 638 00:26:47,380 --> 00:26:49,304 So laat ons praat oor die verhouding van etikette. 639 00:26:49,304 --> 00:26:50,470 ALLISON Buchholtz-AU: Right. 640 00:26:50,470 --> 00:26:52,660 So net soort van gaan af van wat Tomas gesê, 641 00:26:52,660 --> 00:26:54,180 dit is net 'n ander manier om dit te doen nie. 642 00:26:54,180 --> 00:26:57,840 So ons het 'n paar ouer selector met 'n kind op te gee. 643 00:26:57,840 --> 00:27:02,815 So in hierdie voorbeeld hier, ons het 'n paar liggaam met 'n klas navbar, klas knoppie. 644 00:27:02,815 --> 00:27:03,315 Ag. 645 00:27:03,315 --> 00:27:03,990 >> TOMAS Reimers: Ag, jammer. 646 00:27:03,990 --> 00:27:06,180 >> ALLISON Buchholtz-AU: En basies, wat dit beteken 647 00:27:06,180 --> 00:27:11,070 is kies al die kinders, soos al hierdie vorme van keurders, 648 00:27:11,070 --> 00:27:13,040 binne hierdie ouer selector. 649 00:27:13,040 --> 00:27:16,004 En dit is die enigstes dit ooit gaan om aansoek te doen om. 650 00:27:16,004 --> 00:27:17,755 Ek weet nie of jy het 'n beter manier of-- 651 00:27:17,755 --> 00:27:19,504 TOMAS Reimers: So ek raai die manier om te dink 652 00:27:19,504 --> 00:27:22,440 oor hierdie is onthou voor hoe ons soort van soos sit hulle saam. 653 00:27:22,440 --> 00:27:26,340 En dan beteken dit dat een element wat ooreenstem met al hierdie. 654 00:27:26,340 --> 00:27:29,530 Wat dit sê is, ek wil jy alles aan te pas 655 00:27:29,530 --> 00:27:33,220 binne some-- Ek wil jy 'n keurder te vind. 656 00:27:33,220 --> 00:27:35,670 En dan binne daardie, ek wil jy nuwe dinge aan te pas. 657 00:27:35,670 --> 00:27:36,170 Reg? 658 00:27:36,170 --> 00:27:40,900 So in CSS, dit is al oor die soort van in staat is om hierdie items aan te pas. 659 00:27:40,900 --> 00:27:43,050 En jy kan probeer om aan te pas items in ander items. 660 00:27:43,050 --> 00:27:46,510 >> So laat ons eintlik doen 'n voorbeeld, en ons dink dit sal verduidelik. 661 00:27:46,510 --> 00:27:53,090 So laat ons voorgee ons het 'n spesiale, spesiale mooi, wat ook al. 662 00:27:53,090 --> 00:27:55,690 En dan het ons 'n skakel, OK? 663 00:27:55,690 --> 00:27:59,780 664 00:27:59,780 --> 00:28:02,370 So onthou, 'n is 'n skakel. 665 00:28:02,370 --> 00:28:03,900 Dit gaan nie om oral te gaan. 666 00:28:03,900 --> 00:28:11,500 En ons gaan om dit te gee die klas skakel, dink ek. 667 00:28:11,500 --> 00:28:13,335 Kom ons gee dit die class-- gee my 'n idee. 668 00:28:13,335 --> 00:28:14,460 ALLISON Buchholtz-AU: Cool. 669 00:28:14,460 --> 00:28:16,420 TOMAS Reimers: Coo-- laat gaan dit die klas mooi. 670 00:28:16,420 --> 00:28:16,930 Hoekom nie? 671 00:28:16,930 --> 00:28:17,971 >> ALLISON Buchholtz-AU: OK. 672 00:28:17,971 --> 00:28:23,040 TOMAS Reimers: So nou mooi dinge 673 00:28:23,040 --> 00:28:26,000 gaan die agtergrond te maak blou, agtergrond van die salm. 674 00:28:26,000 --> 00:28:27,969 Dit maak sin. 675 00:28:27,969 --> 00:28:28,760 En as ons dit doen this-- 676 00:28:28,760 --> 00:28:29,620 >> ALLISON Buchholtz-AU: Wil jy teks by te voeg 677 00:28:29,620 --> 00:28:31,078 so die hyperlink toon eintlik nie? 678 00:28:31,078 --> 00:28:35,088 TOMAS Reimers: Dit sou 'n goeie roep wees. 679 00:28:35,088 --> 00:28:37,921 ALLISON Buchholtz-AU: "Want reg nou is ons net gaan kry niks. 680 00:28:37,921 --> 00:28:39,690 TOMAS Reimers: So dit is 'n skakel. 681 00:28:39,690 --> 00:28:42,202 "Dit is 'n skakel." 682 00:28:42,202 --> 00:28:45,820 O ja, en dit gaan nog 'n skakel te wees. 683 00:28:45,820 --> 00:28:47,280 Kom ons gee dit die klas "cool." 684 00:28:47,280 --> 00:28:50,295 Jy is reg. 685 00:28:50,295 --> 00:28:50,795 Cool. 686 00:28:50,795 --> 00:28:53,590 687 00:28:53,590 --> 00:28:56,010 So nou gaan ons hierdie aan te gryp. 688 00:28:56,010 --> 00:28:57,269 Ons gaan een te gooi. 689 00:28:57,269 --> 00:28:59,060 Ons het een in die spesiale tag, en ons het ook 690 00:28:59,060 --> 00:29:01,150 gaan een in die mooi tag te hê. 691 00:29:01,150 --> 00:29:05,449 En nou wat ons gaan doen, is ons gaan maak cool-- 692 00:29:05,449 --> 00:29:06,490 wat doen ons dit wil doen? 693 00:29:06,490 --> 00:29:10,347 694 00:29:10,347 --> 00:29:12,180 ALLISON Buchholtz-AU: Kan ons maak dit groter? 695 00:29:12,180 --> 00:29:13,800 TOMAS Reimers: Kom ons gee dit 'n grens. 696 00:29:13,800 --> 00:29:14,840 ALLISON Buchholtz-AU: Ons kon grens. 697 00:29:14,840 --> 00:29:15,673 TOMAS Reimers: Ja. 698 00:29:15,673 --> 00:29:18,560 So ons gaan om iets te doen soos, grens is-- en ons is 699 00:29:18,560 --> 00:29:20,971 gaan om dit te verduidelik al in 'n tweede. 700 00:29:20,971 --> 00:29:21,470 Vir now-- 701 00:29:21,470 --> 00:29:24,592 >> ALLISON Buchholtz-AU: Om die boks model. 702 00:29:24,592 --> 00:29:27,300 TOMAS Reimers: Maar vir nou, ons is net gaan om dit 'n grens. 703 00:29:27,300 --> 00:29:29,580 So, wat dit beteken, is dat jy gaan hierdie skakels te sien. 704 00:29:29,580 --> 00:29:32,788 En jy gaan om te sien dat hulle hierdie, soos, lelike swart grense, wat 705 00:29:32,788 --> 00:29:33,820 is cool. 706 00:29:33,820 --> 00:29:34,500 >> ALLISON Buchholtz-AU: Ons webwerf is so mooi. 707 00:29:34,500 --> 00:29:35,333 >> TOMAS Reimers: Ja. 708 00:29:35,333 --> 00:29:38,930 Ons webwerf is awesome. 709 00:29:38,930 --> 00:29:41,585 So hierdie twee skakels, en dit verskyn. 710 00:29:41,585 --> 00:29:44,160 Nou laat maak asof ek net wou dit doen 711 00:29:44,160 --> 00:29:50,072 As dit nie binne iets wat 'n agtergrond van die salm. 712 00:29:50,072 --> 00:29:52,280 So onthou dat hierdie een het 'n agtergrond van die salm, 713 00:29:52,280 --> 00:29:54,000 want dit is van die klas mooi. 714 00:29:54,000 --> 00:29:59,777 >> Maar ons wil sê dat slegs afkoel wat in die klas spesiale, nie in die klas 715 00:29:59,777 --> 00:30:02,890 mooi, moet die grens. 716 00:30:02,890 --> 00:30:12,549 Wel, wat jy kan doen is jy kan sê, .special, ruimte, .cool. 717 00:30:12,549 --> 00:30:15,590 En wat dit doen, wanneer jy dink oor dit, is dit basies sê, 718 00:30:15,590 --> 00:30:19,530 OK, vind my alles wat ooreenstem met spesiale. 719 00:30:19,530 --> 00:30:24,104 Dan binne daardie etikette, vind my alles wat cool. 720 00:30:24,104 --> 00:30:27,270 ALLISON Buchholtz-AU: So 'n ander manier wat goed kan wees om te dink oor hierdie, 721 00:30:27,270 --> 00:30:29,810 bring dit terug na C, is net soos die idee van die omvang. 722 00:30:29,810 --> 00:30:34,020 So wanneer jy 'n paar selector, soos dié 723 00:30:34,020 --> 00:30:38,460 dat ons besig is om voor hierdie, jou hele web bladsy, al jou HTML 724 00:30:38,460 --> 00:30:40,180 is binne die bestek van jou, reg? 725 00:30:40,180 --> 00:30:43,090 Maar wanneer ons hierdie ouer-kind verhoudings, 726 00:30:43,090 --> 00:30:47,130 dit is asof jy die vernouing down waar jy soek na 'n spesifieke plek, 727 00:30:47,130 --> 00:30:50,540 asof, soos, ons binne soek 'n spesifieke funksie in plaas 728 00:30:50,540 --> 00:30:52,007 van ons hele lêer. 729 00:30:52,007 --> 00:30:55,090 GEHOOR: So met dit in gedagte, sou dit het saak gemaak as ons het changed-- 730 00:30:55,090 --> 00:30:56,423 ALLISON Buchholtz-AU: Die einde? 731 00:30:56,423 --> 00:30:59,320 GEHOOR: gemeld klas in CSS te .cool, ruimte, .special? 732 00:30:59,320 --> 00:31:01,153 ALLISON Buchholtz-AU: Ja, want dan is dit 733 00:31:01,153 --> 00:31:04,420 sou sê, omvang om dit te alles wat Modern, 734 00:31:04,420 --> 00:31:07,235 en dan kyk wat has-- Ek bedoel, soos in hierdie geval, 735 00:31:07,235 --> 00:31:08,860 Ek dink nie dit sou verander het nie. 736 00:31:08,860 --> 00:31:10,318 >> TOMAS Reimers: As ons sê wat? 737 00:31:10,318 --> 00:31:10,906 Jammer. 738 00:31:10,906 --> 00:31:12,660 >> ALLISON Buchholtz-AU: As ons omvang dit afkoel en dan 739 00:31:12,660 --> 00:31:14,550 kyk vir dinge uit spesiale, dit sou dieselfde wees nie, eintlik. 740 00:31:14,550 --> 00:31:16,260 >> TOMAS Reimers: So sal dit nie wees nie. 741 00:31:16,260 --> 00:31:16,590 >> ALLISON Buchholtz-AU: sou dit nie? 742 00:31:16,590 --> 00:31:17,590 O, oh well. 743 00:31:17,590 --> 00:31:18,090 Ek is verkeerd. 744 00:31:18,090 --> 00:31:21,480 >> TOMAS Reimers: So die rede dit is different-- algemene mistake-- 745 00:31:21,480 --> 00:31:27,140 is dat die reg nou net die skakel het koel, reg? 746 00:31:27,140 --> 00:31:32,176 Ek dink my vraag aan jou ouens is, wat op hierdie bladsy is gekoppel deur .cool? 747 00:31:32,176 --> 00:31:35,984 748 00:31:35,984 --> 00:31:38,340 Daar is twee tags hier, reg? 749 00:31:38,340 --> 00:31:39,770 Wat is hierdie een en hierdie een. 750 00:31:39,770 --> 00:31:40,590 Beide pas cool. 751 00:31:40,590 --> 00:31:42,200 Niks anders nie. 752 00:31:42,200 --> 00:31:46,460 So as jy sê, .cool, ruimte, .special, wat jy gaan om te sê, is, 753 00:31:46,460 --> 00:31:48,824 binne hierdie etikette, wat is spesiaal? 754 00:31:48,824 --> 00:31:49,865 ALLISON Buchholtz-AU: Hm. 755 00:31:49,865 --> 00:31:51,800 Dit is wat it-- reg. 756 00:31:51,800 --> 00:31:52,310 Want dit is soos net iets hier. 757 00:31:52,310 --> 00:31:53,310 >> TOMAS Reimers: So dit kies niks. 758 00:31:53,310 --> 00:31:56,530 >> ALLISON Buchholtz-AU: AANGESIEN met spesiale, ons is binne hierdie tags hier. 759 00:31:56,530 --> 00:31:57,971 >> TOMAS Reimers: Diegene en diegene. 760 00:31:57,971 --> 00:31:58,512 GEHOOR: OK. 761 00:31:58,512 --> 00:31:58,920 So diegene tags uit slash? 762 00:31:58,920 --> 00:31:59,740 >> TOMAS Reimers: Ja. 763 00:31:59,740 --> 00:32:01,150 Maak dit sin maak? 764 00:32:01,150 --> 00:32:03,685 Hoe dit is basies probeer omvang te verfyn. 765 00:32:03,685 --> 00:32:04,810 ALLISON Buchholtz-AU: Ja. 766 00:32:04,810 --> 00:32:06,870 Ek dink dit is waarskynlik die maklikste manier om te dink oor dit. 767 00:32:06,870 --> 00:32:09,270 >> TOMAS Reimers: So ons het gevind dat hierdie, en ons het gevind dat hierdie twee ooreenstem spesiaal. 768 00:32:09,270 --> 00:32:11,400 En dan vra ons binne hierdie ouens, wat is cool? 769 00:32:11,400 --> 00:32:12,941 En binne hierdie een, hierdie een se cool. 770 00:32:12,941 --> 00:32:14,500 Binne hierdie een, niks is cool. 771 00:32:14,500 --> 00:32:16,250 So, dit is die enigste tag wat oorbly. 772 00:32:16,250 --> 00:32:20,112 >> ALLISON Buchholtz-AU: AANGESIEN koel is net binne hierdie 'n tags daar. 773 00:32:20,112 --> 00:32:21,070 TOMAS Reimers: Presies. 774 00:32:21,070 --> 00:32:22,403 En wat is spesiale binne daardie? 775 00:32:22,403 --> 00:32:22,930 Niks nie. 776 00:32:22,930 --> 00:32:25,270 Nou, wat sal ek sê, is As daar was geen ruimte, 777 00:32:25,270 --> 00:32:29,880 jy vra wat is koel en special-- of wat is mooi en spesiale, reg? 778 00:32:29,880 --> 00:32:35,370 As jy sê .special.pretty, dit is dieselfde as .pretty.special. 779 00:32:35,370 --> 00:32:39,220 >> Want wat die verwydering van die ruimte is vra is, wanneer jy sê .special, 780 00:32:39,220 --> 00:32:40,970 jy vra, OK, watter is spesiaal? 781 00:32:40,970 --> 00:32:43,780 En dan van daardie, wat kinders is ook redelik, 782 00:32:43,780 --> 00:32:47,010 wat dieselfde is, grammatikaal, as vra, wat is mooi, 783 00:32:47,010 --> 00:32:49,500 en dan van diegene, wat is ook 'n spesiale? 784 00:32:49,500 --> 00:32:50,000 Reg? 785 00:32:50,000 --> 00:32:53,099 Dit is die verskil van wat is binne wat is. 786 00:32:53,099 --> 00:32:53,640 GEHOOR: OK. 787 00:32:53,640 --> 00:32:54,473 TOMAS Reimers: Ja. 788 00:32:54,473 --> 00:32:56,670 789 00:32:56,670 --> 00:32:58,030 Awesome. 790 00:32:58,030 --> 00:33:00,426 So met dit in gedagte then-- 791 00:33:00,426 --> 00:33:01,800 >> ALLISON Buchholtz-AU: Ek dink ons ​​laaste ding is (in fancy Britse aksent) 792 00:33:01,800 --> 00:33:02,510 die boks model. 793 00:33:02,510 --> 00:33:05,992 >> TOMAS Reimers: Die box-- [lag] Ek hou van die manier Allison sê dat. 794 00:33:05,992 --> 00:33:06,950 So die boks model ding. 795 00:33:06,950 --> 00:33:09,644 >> ALLISON Buchholtz-AU: Net ' 'n boks, sal ek jou boks model wees. 796 00:33:09,644 --> 00:33:11,310 TOMAS Reimers: So laat ons praat oor dat. 797 00:33:11,310 --> 00:33:14,070 So nou het ons het 'n baie van tyd praat oor keurders. 798 00:33:14,070 --> 00:33:16,944 Deur die nou, julle ouens is waarskynlik, soos, meesters van selectors-- jy weet, 799 00:33:16,944 --> 00:33:21,510 hoe om die presiese inhoud kies wat jy wil om te manipuleer op jou skerm. 800 00:33:21,510 --> 00:33:24,740 >> So nou is die vraag, hoe presies kan jy dit manipuleer? 801 00:33:24,740 --> 00:33:27,010 So ek dink die mees basiese manier om te dink oor wat 802 00:33:27,010 --> 00:33:30,294 is, wel, wat presies is 'n element in CSS? 803 00:33:30,294 --> 00:33:32,585 Ons het spandeer baie tyd praat, wat is 'n tag, 804 00:33:32,585 --> 00:33:36,140 of wat is die mees basiese voorstelling van 'n tag? 805 00:33:36,140 --> 00:33:39,870 806 00:33:39,870 --> 00:33:45,170 >> 'N goeie manier om te dink oor dat is, watter vorm is salm? 807 00:33:45,170 --> 00:33:47,295 Watter vorm is, soos die salm-gekleurde agtergrond? 808 00:33:47,295 --> 00:33:47,880 >> GEHOOR: Dit is 'n reghoek. 809 00:33:47,880 --> 00:33:49,040 >> TOMAS Reimers: Dit is 'n reghoek, reg? 810 00:33:49,040 --> 00:33:50,956 >> ALLISON Buchholtz-AU: Was nie 'n truuk vraag. 811 00:33:50,956 --> 00:33:51,870 [Gelag] 812 00:33:51,870 --> 00:33:54,670 >> TOMAS Reimers: Nie probeer om jou te mislei ouens hierdie laat. 813 00:33:54,670 --> 00:33:57,510 So ons het hierdie reghoek. 814 00:33:57,510 --> 00:33:59,140 En die tag is 'n p, reg? 815 00:33:59,140 --> 00:34:02,280 So dit gee ons 'n goeie oortuiging dat die paragraaf 816 00:34:02,280 --> 00:34:07,440 word voorgestel as 'n reghoek, by minste in die gees van die leser, wat 817 00:34:07,440 --> 00:34:08,715 dit is. 818 00:34:08,715 --> 00:34:11,423 >> ALLISON Buchholtz-AU: Ek bedoel, bruisers is tipies reghoekig, 819 00:34:11,423 --> 00:34:13,440 so dit maak sin. 820 00:34:13,440 --> 00:34:18,750 >> TOMAS Reimers: Die idee hier is dat al die tags binne CSS 821 00:34:18,750 --> 00:34:21,790 word voorgestel as 'n reghoek. 822 00:34:21,790 --> 00:34:25,699 En elke reghoek het vier dele volgens CSS, OK? 823 00:34:25,699 --> 00:34:27,830 Jy het die werklike inhoud. 824 00:34:27,830 --> 00:34:29,644 Dit is waar die teks lê. 825 00:34:29,644 --> 00:34:30,470 >> ALLISON Buchholtz-AU: Miskien is jou prentjie. 826 00:34:30,470 --> 00:34:31,303 >> TOMAS Reimers: Ja. 827 00:34:31,303 --> 00:34:33,860 Jy het padding, wat is net 'n soort van wit spasie. 828 00:34:33,860 --> 00:34:35,085 Dan het jy 'n grens. 829 00:34:35,085 --> 00:34:37,710 En dan moet jy marge, wat wit ruimte buite dit. 830 00:34:37,710 --> 00:34:39,460 So wat maak geen sin aan enigiemand, so ons is 831 00:34:39,460 --> 00:34:42,500 gaan om te praat oor wat vir 'n tweede. 832 00:34:42,500 --> 00:34:47,570 So reg hier, wat ons gaan doen is ons gaan 'n paar divs te skep, OK? 833 00:34:47,570 --> 00:34:48,420 Verskoon my terwyl I-- 834 00:34:48,420 --> 00:34:51,506 >> ALLISON Buchholtz-AU: Ek voel ons moet 'n oulike prentjie in te stel. 835 00:34:51,506 --> 00:34:52,520 >> TOMAS Reimers: Ons moet beslis. 836 00:34:52,520 --> 00:34:53,389 >> ALLISON Buchholtz-AU: Ek voel soos almal 837 00:34:53,389 --> 00:34:54,870 kan baat vind by 'n oulike prentjie, is al. 838 00:34:54,870 --> 00:34:56,774 >> TOMAS Reimers: Kan ons almal voordeel trek uit a-- 839 00:34:56,774 --> 00:34:57,648 >> GEHOOR: Ja, seker. 840 00:34:57,648 --> 00:34:58,790 TOMAS Reimers: OK, cool. 841 00:34:58,790 --> 00:35:02,254 So ons moet sit 'n oulike prentjie in iewers. 842 00:35:02,254 --> 00:35:05,295 ALLISON Buchholtz-AU: Ek voel soos 'n oulike bunny kan nou nuttig wees. 843 00:35:05,295 --> 00:35:06,190 TOMAS Reimers: Natuurlik. 844 00:35:06,190 --> 00:35:06,950 ALLISON Buchholtz-AU: Einde van die week. 845 00:35:06,950 --> 00:35:07,390 Iets adorab-- 846 00:35:07,390 --> 00:35:08,520 >> TOMAS Reimers: Hoe bout 'n katjie? 847 00:35:08,520 --> 00:35:09,220 >> ALLISON Buchholtz-AU: 'N katjie werk ook. 848 00:35:09,220 --> 00:35:11,300 >> TOMAS Reimers: Cool, want daar is 'n webwerf vir daardie. 849 00:35:11,300 --> 00:35:12,300 Dit is genoem PlaceKitten. 850 00:35:12,300 --> 00:35:14,719 ALLISON Buchholtz-AU: Dit is 'n groot. 851 00:35:14,719 --> 00:35:15,510 TOMAS Reimers: Ja. 852 00:35:15,510 --> 00:35:18,040 ALLISON Buchholtz-AU: Net vir, soos, plekhouer beelde in jou webwerf. 853 00:35:18,040 --> 00:35:18,914 TOMAS Reimers: MM-hm. 854 00:35:18,914 --> 00:35:21,520 Daar is ook PlacePuppy. 855 00:35:21,520 --> 00:35:22,832 En daar is PlaceBacon. 856 00:35:22,832 --> 00:35:24,340 >> ALLISON Buchholtz-AU: PlaceBacon? 857 00:35:24,340 --> 00:35:25,350 Regtig? 858 00:35:25,350 --> 00:35:28,190 >> TOMAS Reimers: Ag, het ons dit nie doen nie hier toegang tot die internet. 859 00:35:28,190 --> 00:35:29,875 >> ALLISON Buchholtz-AU: [kreun] 860 00:35:29,875 --> 00:35:30,375 Tragies. 861 00:35:30,375 --> 00:35:32,333 TOMAS Reimers: Anders, Ek sou wys julle ouens 862 00:35:32,333 --> 00:35:33,870 hoe beelde om te sit in jou webwerf. 863 00:35:33,870 --> 00:35:36,370 Ons gaan om te probeer om dit te kry werk voordat ons het om te gaan. 864 00:35:36,370 --> 00:35:38,660 Maar vir nou, ons is net gaan om te praat in die kleure dan. 865 00:35:38,660 --> 00:35:39,820 Ons wil foto's van kittens-- te sit 866 00:35:39,820 --> 00:35:40,210 >> ALLISON Buchholtz-AU: Ons het. 867 00:35:40,210 --> 00:35:43,110 >> TOMAS Reimers: gemeld internet se af vir die oomblik dat. 868 00:35:43,110 --> 00:35:47,820 So het ons twee divs, en ons is gaan hulle te gee twee ids. 869 00:35:47,820 --> 00:35:51,380 870 00:35:51,380 --> 00:35:56,760 Ons gaan om dit te noem "Eerste" en "tweede". 871 00:35:56,760 --> 00:36:01,184 So id = "eerste." 872 00:36:01,184 --> 00:36:02,850 En ons gaan hulle twee kleure te gee. 873 00:36:02,850 --> 00:36:08,424 So hoe iets kies ons met 'n ID van "eerste"? 874 00:36:08,424 --> 00:36:09,840 ALLISON Buchholtz-AU: Dot of hash? 875 00:36:09,840 --> 00:36:10,730 GEHOOR: Skerp. 876 00:36:10,730 --> 00:36:12,940 TOMAS Reimers: Sharp, volmaak. 877 00:36:12,940 --> 00:36:14,950 Skerp, hash, ongeag we-- 878 00:36:14,950 --> 00:36:15,680 >> ALLISON Buchholtz-AU: Baie van die dinge om dit te noem. 879 00:36:15,680 --> 00:36:16,430 >> TOMAS Reimers: OK. 880 00:36:16,430 --> 00:36:19,800 Ons gaan om te vestig op hashtag, en dit is wat ons gaan om te gaan met. 881 00:36:19,800 --> 00:36:20,300 OK? 882 00:36:20,300 --> 00:36:20,735 >> ALLISON Buchholtz-AU: hashtag. 883 00:36:20,735 --> 00:36:22,340 >> TOMAS Reimers: So hashtag se eerste. 884 00:36:22,340 --> 00:36:24,506 >> ALLISON Buchholtz-AU: So jy kan tweet die seminar-- 885 00:36:24,506 --> 00:36:27,582 hashtag CSS, hashtag cool. 886 00:36:27,582 --> 00:36:29,040 TOMAS Reimers: hashtag Awesomeness. 887 00:36:29,040 --> 00:36:30,730 ALLISON Buchholtz-AU: Hashtag Awesomeness, ja. 888 00:36:30,730 --> 00:36:31,480 TOMAS Reimers: OK. 889 00:36:31,480 --> 00:36:33,660 Dus het ons "eerste" en "tweede". 890 00:36:33,660 --> 00:36:37,697 So die eerste, ons gaan te hê 'n agtergrond kleur van rooi. 891 00:36:37,697 --> 00:36:39,030 ALLISON Buchholtz-AU: Uh, kolon. 892 00:36:39,030 --> 00:36:40,281 TOMAS Reimers: Yup. 893 00:36:40,281 --> 00:36:42,281 ALLISON Buchholtz-AU: Ek sal jou plek-checker wees. 894 00:36:42,281 --> 00:36:43,960 TOMAS Reimers: Allison se het my. 895 00:36:43,960 --> 00:36:45,830 Agtergrond-kleur van blue-- 896 00:36:45,830 --> 00:36:46,810 >> TOMAS Reimers: Purple! 897 00:36:46,810 --> 00:36:47,726 >> TOMAS Reimers Pers. 898 00:36:47,726 --> 00:36:48,830 ALLISON Buchholtz-AU: Ja. 899 00:36:48,830 --> 00:36:50,630 Pers se my gunsteling kleur, en ons het dit nie gebruik nie. 900 00:36:50,630 --> 00:36:51,546 >> TOMAS Reimers: Violet. 901 00:36:51,546 --> 00:36:53,361 ALLISON Buchholtz-AU: Violet. 902 00:36:53,361 --> 00:36:53,860 Dit werk. 903 00:36:53,860 --> 00:36:56,482 904 00:36:56,482 --> 00:36:59,880 >> TOMAS Reimers: So is ons gaan twee divs te hê. 905 00:36:59,880 --> 00:37:01,654 Hulle gaan heeltemal leeg. 906 00:37:01,654 --> 00:37:03,070 Ons moet waarskynlik sommige teks. 907 00:37:03,070 --> 00:37:05,580 908 00:37:05,580 --> 00:37:09,815 So "eerste" gaan wees "Hello." 909 00:37:09,815 --> 00:37:10,940 En die "tweede" sal say-- 910 00:37:10,940 --> 00:37:11,110 >> ALLISON Buchholtz-AU: Goodbye. 911 00:37:11,110 --> 00:37:12,514 >> GEHOOR: - "wêreld". 912 00:37:12,514 --> 00:37:14,122 Hallo, totsiens. 913 00:37:14,122 --> 00:37:16,580 ALLISON Buchholtz-AU: Ek het gesien hulle in die konsert die ander week. 914 00:37:16,580 --> 00:37:17,705 TOMAS Reimers: Die Beatles? 915 00:37:17,705 --> 00:37:20,242 ALLISON Buchholtz-AU: Vir reals. 916 00:37:20,242 --> 00:37:21,200 Hulle is nie so groot. 917 00:37:21,200 --> 00:37:24,084 918 00:37:24,084 --> 00:37:24,750 Ek hou nie daarvan nie. 919 00:37:24,750 --> 00:37:26,060 >> TOMAS Reimers: Ons het "Hallo" en "totsiens." 920 00:37:26,060 --> 00:37:29,102 En weer, CSS is net awesome, want dit gee erkenning aan ons kleure. 921 00:37:29,102 --> 00:37:30,810 Hoef nie eens bekommerd dat hulle bestaan ​​nie. 922 00:37:30,810 --> 00:37:33,194 Hulle doen. 923 00:37:33,194 --> 00:37:35,130 >> ALLISON Buchholtz-AU: Hulle bestaan ​​nie. 924 00:37:35,130 --> 00:37:39,560 >> TOMAS Reimers: So CSS Ek dink het 255 woorde om te praat oor kleur. 925 00:37:39,560 --> 00:37:42,986 As jy kan dink van 'n kleur buite diegene 255, soos, ek sal beïndruk wees. 926 00:37:42,986 --> 00:37:44,110 ALLISON Buchholtz-AU: Ja. 927 00:37:44,110 --> 00:37:45,560 Ek dink jy ouens kan hê net kom in reg na. 928 00:37:45,560 --> 00:37:47,727 >> TOMAS Reimers: So hier, jy sal sien ons twee bokse 929 00:37:47,727 --> 00:37:49,143 reg op die top van mekaar, reg? 930 00:37:49,143 --> 00:37:50,200 Hallo en totsiens. 931 00:37:50,200 --> 00:37:51,460 >> ALLISON Buchholtz-AU: Daar is geen ruimte in tussen. 932 00:37:51,460 --> 00:37:53,390 Hulle is maar net smooshed reg op die top van mekaar. 933 00:37:53,390 --> 00:37:55,973 >> TOMAS Reimers: So die eerste ding Ek dink ons ​​moet praat oor 934 00:37:55,973 --> 00:38:02,960 is laat say-- ook ja. 935 00:38:02,960 --> 00:38:08,020 So CSS verteenwoordig hulle as 'n soort van bokse. 936 00:38:08,020 --> 00:38:10,100 En as bokse, hulle het inhoud. 937 00:38:10,100 --> 00:38:14,540 En die inhoud nou is 'n soort van Die Hello of die gegroet en dit is dit. 938 00:38:14,540 --> 00:38:15,040 OK? 939 00:38:15,040 --> 00:38:19,790 >> So een van die eerste dinge wat jy kan doen, is jy kan padding voeg. 940 00:38:19,790 --> 00:38:25,610 Padding sê hoeveel ruimte dit moet oorlaat aan 'n kant. 941 00:38:25,610 --> 00:38:29,200 So kom ons sê wat ek wil sê 10 pixels aan elke kant. 942 00:38:29,200 --> 00:38:31,234 En Ek sal dissekteer wat in 'n tweede. 943 00:38:31,234 --> 00:38:33,150 ALLISON Buchholtz-AU: Al hierdie dinge hier 944 00:38:33,150 --> 00:38:36,980 gaan meestal in pixels vir die res van die seminaar. 945 00:38:36,980 --> 00:38:40,980 Jy gaan om te sien dat dit 'n ruimte rondom dit, reg? 946 00:38:40,980 --> 00:38:46,360 So, wat jy nie hier sien nie is daar hierdie onsigbare soort van padding 947 00:38:46,360 --> 00:38:49,600 aan elke kant, wat sê, soos, OK, jy het jou boks van content-- 948 00:38:49,600 --> 00:38:51,680 >> ALLISON Buchholtz-AU: Wil jy net trek die inspekteer element? 949 00:38:51,680 --> 00:38:53,659 >> TOMAS Reimers: Ja, dis 'n goeie idee. 950 00:38:53,659 --> 00:38:56,700 ALLISON Buchholtz-AU: Ook vind ek dat die inspekteer element is 'n goeie manier 951 00:38:56,700 --> 00:39:01,280 om uit te vind of daar iets gaan verkeerd is, iets onverwags gebeur, 952 00:39:01,280 --> 00:39:04,570 inspekteer die etikette en sien wat dit is soos oorskryf is nuttig. 953 00:39:04,570 --> 00:39:05,940 >> TOMAS Reimers: So ek is nie seker As jy ouens kan sien hierdie kleur. 954 00:39:05,940 --> 00:39:06,470 Kan jy? 955 00:39:06,470 --> 00:39:10,120 Jy sal hierdie padding sien op die soort van voordeel. 956 00:39:10,120 --> 00:39:13,410 En dan sien jy die werklike inhoud in blou, reg? 957 00:39:13,410 --> 00:39:16,820 So wat is die baie basiese beginsels van die boks model. 958 00:39:16,820 --> 00:39:17,674 Jy het inhoud. 959 00:39:17,674 --> 00:39:18,590 Dan moet jy padding. 960 00:39:18,590 --> 00:39:20,440 >> GEHOOR: Hoekom doen jy nie net gebruik die boks binne the-- 961 00:39:20,440 --> 00:39:21,606 >> ALLISON Buchholtz-AU: Right. 962 00:39:21,606 --> 00:39:24,745 Want dit is net die keuse van die element nou. 963 00:39:24,745 --> 00:39:26,050 >> TOMAS Reimers: Yup. 964 00:39:26,050 --> 00:39:27,060 Ander dinge. 965 00:39:27,060 --> 00:39:29,780 So laat ons praat oor wat padding opdrag vir 'n tweede. 966 00:39:29,780 --> 00:39:36,380 So in CSS, metings moet 'n eenheid te hê. 967 00:39:36,380 --> 00:39:39,740 So die eerste wat jy het om die bedrag. 968 00:39:39,740 --> 00:39:41,460 So in hierdie geval, het ons gesê 10. 969 00:39:41,460 --> 00:39:44,780 En dan die volgende een ons het gesê is pixels, px. 970 00:39:44,780 --> 00:39:49,160 Ander mense wat jy kan hê is dinge soos sentimeter, duim. 971 00:39:49,160 --> 00:39:51,367 Wat jy kan doen dinge soos wat 10 duim? 972 00:39:51,367 --> 00:39:52,700 En dit gaan belaglik wees. 973 00:39:52,700 --> 00:39:52,990 >> ALLISON Buchholtz-AU: O, seun. 974 00:39:52,990 --> 00:39:53,460 >> GEHOOR: Whoa. 975 00:39:53,460 --> 00:39:54,460 >> TOMAS Allison: Ja. 976 00:39:54,460 --> 00:39:57,840 TOMAS Reimers: So dit is al wat padding. 977 00:39:57,840 --> 00:39:59,255 Ek gaan om terug te gaan na pixels. 978 00:39:59,255 --> 00:40:01,754 >> ALLISON Buchholtz-AU: Pixels is geneig om te wees, soos die standaard. 979 00:40:01,754 --> 00:40:04,589 As jy kyk na 'n baie van die webwerwe, hulle werk meestal in pixels. 980 00:40:04,589 --> 00:40:07,755 TOMAS Reimers: So jy gaan om te sien óf pixels-- die ander mense wat jy sien 981 00:40:07,755 --> 00:40:13,952 is em, wat een em is gelyk aan die hoogte van die font 982 00:40:13,952 --> 00:40:15,160 wat jy tans gebruik. 983 00:40:15,160 --> 00:40:16,201 >> ALLISON Buchholtz-AU: Mm. 984 00:40:16,201 --> 00:40:17,574 985 00:40:17,574 --> 00:40:20,740 TOMAS Reimers: Dit is 'n goeie manier om te sê, soos ek wil soveel ruimte as my font 986 00:40:20,740 --> 00:40:21,514 neem. 987 00:40:21,514 --> 00:40:23,180 ALLISON Buchholtz-AU: Het nie geweet dat. 988 00:40:23,180 --> 00:40:25,747 Jy leer elke dag iets nuuts. 989 00:40:25,747 --> 00:40:27,955 TOMAS Reimers: Daar is 'n baie van metings in CS. 990 00:40:27,955 --> 00:40:29,260 Ek stel voor jy kyk hulle. 991 00:40:29,260 --> 00:40:32,122 Vir al jou gevalle, dink ek pixels behoort voldoende te wees. 992 00:40:32,122 --> 00:40:33,830 En dit is ook wat jy gaan om te sien 993 00:40:33,830 --> 00:40:36,520 in die meerderheid van voorbeelde gedoen online. 994 00:40:36,520 --> 00:40:38,320 So ons sal dit daar laat pixels. 995 00:40:38,320 --> 00:40:42,420 >> Jy kan ook, ek moet so say-- padding stelle al die paddings. 996 00:40:42,420 --> 00:40:49,789 Jy kan ook iets doen, soos "Padding-top" om net set-- 997 00:40:49,789 --> 00:40:52,080 ALLISON Buchholtz-AU: Miskien ons sal ons "hallo" terug te kry. 998 00:40:52,080 --> 00:40:55,480 TOMAS Reimers: --to net het die padding op die top en niks anders nie. 999 00:40:55,480 --> 00:40:59,560 Toe is die vier opdragte is padding-top, padding-bottom, padding-links, 1000 00:40:59,560 --> 00:41:00,310 en padding-regs. 1001 00:41:00,310 --> 00:41:02,470 >> ALLISON Buchholtz-AU: Net soos jy sou verwag vir 'n boks. 1002 00:41:02,470 --> 00:41:03,530 >> TOMAS Reimers: Ja. 1003 00:41:03,530 --> 00:41:05,240 Niks is te gek daar. 1004 00:41:05,240 --> 00:41:08,230 Maak dit sin maak? 1005 00:41:08,230 --> 00:41:11,990 So dit is padding. 1006 00:41:11,990 --> 00:41:14,110 Ek gaan al stel die paddings terug na 10. 1007 00:41:14,110 --> 00:41:17,010 En dan gaan ek aan te beweeg na die grens. 1008 00:41:17,010 --> 00:41:21,130 >> So, wat grens is, is grens is 'n vreemde opdrag. 1009 00:41:21,130 --> 00:41:24,450 Dit neem soort van drie dinge gelyktydig. 1010 00:41:24,450 --> 00:41:28,930 So het die eerste is hoe groot jy dit wil wees as 'n meting. 1011 00:41:28,930 --> 00:41:30,662 Weereens, ek is maar net die gebruik van pixels. 1012 00:41:30,662 --> 00:41:32,620 En die laaste ding wat ek te metings moet voeg 1013 00:41:32,620 --> 00:41:35,270 is die een ding wat nie 'n eenheid nodig is 0. 1014 00:41:35,270 --> 00:41:37,390 Dit is eintlik foutief te gee 0 'n eenheid, 1015 00:41:37,390 --> 00:41:41,940 want 0 0 regoor duim, pixels, sentimeter, wat ook al. 1016 00:41:41,940 --> 00:41:43,960 Dit alles beteken net 0, reg? 1017 00:41:43,960 --> 00:41:46,710 So die eerste wat jy dit gee die meting. 1018 00:41:46,710 --> 00:41:48,650 >> Dan moet jy dit gee die styl. 1019 00:41:48,650 --> 00:41:49,869 So ek gaan om te sê "soliede". 1020 00:41:49,869 --> 00:41:51,410 En ons sal praat oor wat dit beteken. 1021 00:41:51,410 --> 00:41:54,290 En dan laastens, jy gee dit 'n kleur. 1022 00:41:54,290 --> 00:41:56,850 So ek gaan om te sê "swart." 1023 00:41:56,850 --> 00:41:59,637 En dit is al die dinge wat ons het nou gesien voor, behalwe vir styl, 1024 00:41:59,637 --> 00:42:00,720 maar ons sal praat oor dit. 1025 00:42:00,720 --> 00:42:04,120 So julle ouens het gesien metings, en jy het gesien kleure. 1026 00:42:04,120 --> 00:42:10,410 En wat gebeur is dat ons hierdie mooi swart grens rondom dit, reg? 1027 00:42:10,410 --> 00:42:11,620 Julle sien hoe ons dit gedoen het? 1028 00:42:11,620 --> 00:42:12,760 >> GEHOOR: Ja. 1029 00:42:12,760 --> 00:42:14,850 >> TOMAS Reimers: Cool. 1030 00:42:14,850 --> 00:42:17,370 So, wat is dit? 1031 00:42:17,370 --> 00:42:19,160 So die eerste van alles, dit is 'n pixel. 1032 00:42:19,160 --> 00:42:20,880 Dit is self-evident genoeg, reg? 1033 00:42:20,880 --> 00:42:23,254 Soos dit is een pixel dik. 1034 00:42:23,254 --> 00:42:26,170 Of dit sou een pixel wees, maar ek is ingezoomd, so dit is 'n bietjie meer 1035 00:42:26,170 --> 00:42:26,490 as dit. 1036 00:42:26,490 --> 00:42:27,967 >> ALLISON Buchholtz-AU: En ons het hierdie belaglike besluit TV. 1037 00:42:27,967 --> 00:42:29,460 >> TOMAS Reimers: Ja. 1038 00:42:29,460 --> 00:42:33,640 Jy kan dit maak groter, kleiner, wat ook al. 1039 00:42:33,640 --> 00:42:35,630 So hier is 'n twee-pixel grens. 1040 00:42:35,630 --> 00:42:38,810 Jy sal sien dit is twee keer so dik. 1041 00:42:38,810 --> 00:42:40,172 Volgende ding wat jy het, is die kleur. 1042 00:42:40,172 --> 00:42:41,130 Dit is nie interessant. 1043 00:42:41,130 --> 00:42:42,710 Ek gaan nie om te praat oor wat, regtig. 1044 00:42:42,710 --> 00:42:45,110 >> ALLISON Buchholtz-AU: Maar die styl dalk net 'n bietjie interessant. 1045 00:42:45,110 --> 00:42:45,980 >> TOMAS Reimers: Ja. 1046 00:42:45,980 --> 00:42:48,560 So styl, is daar min mense wat ek sien wat algemeen gebruik word. 1047 00:42:48,560 --> 00:42:55,690 Eerste een se soliede, langs 'n mens se stippellyn, en die laaste een se verpletter. 1048 00:42:55,690 --> 00:42:59,290 En hier is gesaai. 1049 00:42:59,290 --> 00:43:02,980 Jy sal sien dat hulle 'n klomp van die punte, reg? 1050 00:43:02,980 --> 00:43:09,030 'N Goeie manier om te soort van 'n mooi grens gaan, aandagstrepe is ook redelik gewild. 1051 00:43:09,030 --> 00:43:11,580 1052 00:43:11,580 --> 00:43:13,600 >> ALLISON Buchholtz-AU: En dan natuurlik, ek is 1053 00:43:13,600 --> 00:43:16,660 seker daar is baie ander style wat jy kan kry. 1054 00:43:16,660 --> 00:43:20,000 En ons het 'n groot versameling van skakels aan die einde vir julle 1055 00:43:20,000 --> 00:43:23,470 soort nagaan en kyk na meer cool CSS. 1056 00:43:23,470 --> 00:43:25,954 >> TOMAS Reimers: En dan die laaste ding, ons is 1057 00:43:25,954 --> 00:43:27,870 gaan om te praat oor die box modelle ware vinnig. 1058 00:43:27,870 --> 00:43:30,070 O ja, en dan die grens, presies soos padding, 1059 00:43:30,070 --> 00:43:33,270 jy het ook dinge soos grens-links, grens-regs, grens-top, 1060 00:43:33,270 --> 00:43:37,590 grens-bodem, wat toelaat dat jy te kry op 'n spesifieke grens. 1061 00:43:37,590 --> 00:43:40,650 So hier is net die grens links-gedefinieerde. 1062 00:43:40,650 --> 00:43:43,060 Doen wat sin maak? 1063 00:43:43,060 --> 00:43:46,170 >> ALLISON Buchholtz-AU: Dit is 'n koel manier om dinge te beklemtoon of voeg 1064 00:43:46,170 --> 00:43:47,545 lyne tussen die verskillende elemente. 1065 00:43:47,545 --> 00:43:48,670 TOMAS Reimers: Absoluut. 1066 00:43:48,670 --> 00:43:50,940 So dit is ons grens. 1067 00:43:50,940 --> 00:43:52,790 En die laaste een se marge. 1068 00:43:52,790 --> 00:43:55,892 Marge se soos padding behalwe dit is nie within-- 1069 00:43:55,892 --> 00:43:57,975 ALLISON Buchholtz-AU: Dis nie om jou element 1070 00:43:57,975 --> 00:44:00,840 maar eintlik rondom die hele boks wat ons het is te sien. 1071 00:44:00,840 --> 00:44:02,770 >> TOMAS Reimers: Ja. 1072 00:44:02,770 --> 00:44:04,090 Allison sê dit perfek. 1073 00:44:04,090 --> 00:44:07,550 Dit is nie, soos, binne-in jou element, dit is om die hele boks. 1074 00:44:07,550 --> 00:44:10,900 Dit beteken dinge soos agtergrond nie van toepassing op dit. 1075 00:44:10,900 --> 00:44:13,550 En dit basies sê, soos ek wil nie iets 1076 00:44:13,550 --> 00:44:15,230 in hierdie baie ruimte vir my. 1077 00:44:15,230 --> 00:44:17,470 Dus, net soos hier het ons 'n marge van 10 pixels. 1078 00:44:17,470 --> 00:44:23,100 So niks binne 10 pixels moet langs my. 1079 00:44:23,100 --> 00:44:26,210 Dit is soort van sy ruimte, maar soort van nie. 1080 00:44:26,210 --> 00:44:29,215 So wat is die baie basiese beginsels van die boks model. 1081 00:44:29,215 --> 00:44:30,090 Maak dit sin maak? 1082 00:44:30,090 --> 00:44:33,830 1083 00:44:33,830 --> 00:44:34,550 Cool, cool. 1084 00:44:34,550 --> 00:44:35,800 ALLISON Buchholtz-AU: Awesome. 1085 00:44:35,800 --> 00:44:37,890 So nou is ek dink ons ​​het net het ons koel hulpbronne 1086 00:44:37,890 --> 00:44:41,220 dat ons sal julle ouens baie vinnig deur. 1087 00:44:41,220 --> 00:44:44,815 En ons sal goed actually--, ons het internet nog? 1088 00:44:44,815 --> 00:44:47,860 >> TOMAS Reimers: Kom ons sien as ek kan oopmaak up-- 1089 00:44:47,860 --> 00:44:50,040 laat my net te sien as ek kan die internet vinnig 1090 00:44:50,040 --> 00:44:53,317 terwyl Allison praat oor enigiets Allison wil om te praat oor. 1091 00:44:53,317 --> 00:44:55,150 ALLISON Buchholtz-AU: So basically-- ek doen nie 1092 00:44:55,150 --> 00:44:57,930 weet wat anders wat ek op hierdie punt kan sê. 1093 00:44:57,930 --> 00:45:01,340 Maar hierdie is 'n paar regtig 'n goeie hulpbronne. 1094 00:45:01,340 --> 00:45:04,629 Dit is mense wat Tomas en ek gebruik 1095 00:45:04,629 --> 00:45:06,420 en dat ons eintlik gebruik te prep vir hierdie. 1096 00:45:06,420 --> 00:45:09,940 W3Schools is een wat julle ouens moet gesien het voordat. 1097 00:45:09,940 --> 00:45:12,440 Ons beveel dit vir 'n Baie van die dinge met CSS. 1098 00:45:12,440 --> 00:45:15,060 Ek weet ek beveel dit aan my artikel al die tyd. 1099 00:45:15,060 --> 00:45:21,050 >> Een van die groot dinge is dat dit kan jy soort van gemors met CSS 1100 00:45:21,050 --> 00:45:23,830 en sien die veranderinge onmiddellik in hierdie, 1101 00:45:23,830 --> 00:45:25,920 soos, dubbel-venster sien dat dit het. 1102 00:45:25,920 --> 00:45:29,980 So jy hoef nie te bekommerd wees oor die opstel van jou eie webblad, 1103 00:45:29,980 --> 00:45:33,090 of die opstel van 'vhost in jou plaaslike toestel en plaaslike gasheer, 1104 00:45:33,090 --> 00:45:34,980 en om al daardie dinge werk. 1105 00:45:34,980 --> 00:45:36,830 Dit is ingebed reg binne die bladsy. 1106 00:45:36,830 --> 00:45:39,042 >> En dit het hierdie klein lesse wat jy kan 1107 00:45:39,042 --> 00:45:40,750 gaan deur te leer meer oor keurders, 1108 00:45:40,750 --> 00:45:44,610 of leer oor te manipuleer jou font, of 'n agtergrond of 'n beeld. 1109 00:45:44,610 --> 00:45:46,990 En jy moet hierdie oombliklike resultate wat jy 1110 00:45:46,990 --> 00:45:49,310 het geen te doen ander prep werk vir. 1111 00:45:49,310 --> 00:45:51,060 So ek is lief vir W3Schools. 1112 00:45:51,060 --> 00:45:51,960 Dit is geweldig. 1113 00:45:51,960 --> 00:45:52,670 Is dit werk? 1114 00:45:52,670 --> 00:45:52,950 >> TOMAS Reimers: Ja. 1115 00:45:52,950 --> 00:45:53,720 Nee, dit is nie. 1116 00:45:53,720 --> 00:45:55,636 Wil jy my te probeer en weer my rekenaar? 1117 00:45:55,636 --> 00:45:56,410 Of wil ons aan- 1118 00:45:56,410 --> 00:46:01,490 >> ALLISON Buchholtz-AU: Ek bedoel, Wel, dit sal ook aanlyn wees. 1119 00:46:01,490 --> 00:46:02,740 Al die skyfies sal aanlyn wees. 1120 00:46:02,740 --> 00:46:05,470 So het ek net raai wat hierdie. 1121 00:46:05,470 --> 00:46:07,880 >> Dit is 'n groot as net soos 'n cheat sheet. 1122 00:46:07,880 --> 00:46:10,690 Dis net al die basiese beveel wat jy het. 1123 00:46:10,690 --> 00:46:13,070 Dit is 'n groot as jy eerste begin jou webwerf. 1124 00:46:13,070 --> 00:46:15,080 Omdat miskien het jy dit nie doen nie wil kry in al 1125 00:46:15,080 --> 00:46:17,355 die werklike nitty gritty ontwerp-swaar dinge. 1126 00:46:17,355 --> 00:46:20,230 Jy moet net om dit te formatteer in 'n manier dat die soort van sin maak en wil 1127 00:46:20,230 --> 00:46:21,490 doen vir die oomblik. 1128 00:46:21,490 --> 00:46:23,580 En as jy regtig wil om te kry in dit, ek weet 1129 00:46:23,580 --> 00:46:27,240 dit is, soos, een van Tomas se gunsteling verwysings. 1130 00:46:27,240 --> 00:46:30,130 Ons is om dit te gebruik om prep, en dit is geweldig. 1131 00:46:30,130 --> 00:46:33,030 Dit is die ontwikkelaar van Mozilla. 1132 00:46:33,030 --> 00:46:36,490 >> TOMAS Reimers: So Mozilla is die mense wat Firefox maak. 1133 00:46:36,490 --> 00:46:40,290 En dit is net hul eie ontwikkelaar verwysing, wat ek dink is awesome. 1134 00:46:40,290 --> 00:46:44,870 En dit het 'n wonderlike lys van hulpbronne. 1135 00:46:44,870 --> 00:46:45,530 Sodat ons have-- 1136 00:46:45,530 --> 00:46:48,060 >> ALLISON Buchholtz-AU: En dan laaste noot is 1137 00:46:48,060 --> 00:46:50,120 wanneer jy probeer om te ontwerp jou webwerf, 1138 00:46:50,120 --> 00:46:53,550 trek inspirasie uit dinge wat jy dink is mooi. 1139 00:46:53,550 --> 00:46:56,340 Inspeksie van die element, inspeksie van die bron-kode 1140 00:46:56,340 --> 00:46:59,370 kan wees super nuttig om te probeer om uit te vind 1141 00:46:59,370 --> 00:47:02,080 hoe om jou eie webwerf te stileer. 1142 00:47:02,080 --> 00:47:04,540 >> Dikwels, ek voel soos die beste manier, behalwe eksperimentering, 1143 00:47:04,540 --> 00:47:06,290 net om te kyk na dinge wat mooi. 1144 00:47:06,290 --> 00:47:09,810 Ek vind dit is regtig moeilik om net soort van ontwerp dinge op jou eie, 1145 00:47:09,810 --> 00:47:11,090 veral in die begin. 1146 00:47:11,090 --> 00:47:14,740 So asseblief kyk na webwerwe wat jy geniet kyk. 1147 00:47:14,740 --> 00:47:16,880 Uit te vind wat maak hulle 'n beroep op jou. 1148 00:47:16,880 --> 00:47:19,170 En dan voel vry om probeer herhaal nie. 1149 00:47:19,170 --> 00:47:20,410 >> TOMAS Reimers: Right. 1150 00:47:20,410 --> 00:47:23,120 Selfs soos webwerwe soos hierdie, kan jy sien 1151 00:47:23,120 --> 00:47:25,460 daar is beslis 'n div aan die bokant. 1152 00:47:25,460 --> 00:47:29,920 En dan moet jy 'n ander div binne hier, wat is CSS Awesomeness. 1153 00:47:29,920 --> 00:47:32,480 En dan moet jy 'n klomp van die skakels hier. 1154 00:47:32,480 --> 00:47:34,770 As jy regtig net inspekteer elemente, kan jy sorteer van 1155 00:47:34,770 --> 00:47:38,520 begin om te sien watter webtuistes doen lyk, en hoe kan ek 1156 00:47:38,520 --> 00:47:40,493 herskep dat as ek wou. 1157 00:47:40,493 --> 00:47:41,890 Maak dit sin maak? 1158 00:47:41,890 --> 00:47:43,670 So het ons net drie minute verlaat. 1159 00:47:43,670 --> 00:47:46,380 So vrae? 1160 00:47:46,380 --> 00:47:47,650 Enige van hulle? 1161 00:47:47,650 --> 00:47:48,350 Ja. 1162 00:47:48,350 --> 00:47:50,780 >> GEHOOR: Vir die kleur reghoek, hoe sou jy 1163 00:47:50,780 --> 00:47:53,499 have-- as jy nie wil hê om dit gaan oor die hele bladsy, kan 1164 00:47:53,499 --> 00:47:56,400 julle het dit gaan oor net die helfte van die bladsy of net die teks? 1165 00:47:56,400 --> 00:47:59,660 >> TOMAS Reimers: Ja, absoluut. 1166 00:47:59,660 --> 00:48:02,780 So laat my sien eintlik. 1167 00:48:02,780 --> 00:48:04,670 Ek het twee idees. 1168 00:48:04,670 --> 00:48:07,265 So die eerste van alles, jy kan ook gebruik Procenten. 1169 00:48:07,265 --> 00:48:08,140 >> GEHOOR: Regtig? 1170 00:48:08,140 --> 00:48:11,260 >> ALLISON Buchholtz-AU: So iets om op te kyk, is relatiewe posisionering. 1171 00:48:11,260 --> 00:48:13,385 Dit is iets wat ons nie tyd om te kry in het nie, 1172 00:48:13,385 --> 00:48:16,392 maar dit is iets wat ek beslis beveel julle ouens uitcheck. 1173 00:48:16,392 --> 00:48:17,580 >> TOMAS Reimers: So Procenten. 1174 00:48:17,580 --> 00:48:21,524 En sien hoe ons dit gedoen het net 50% van die wydte? 1175 00:48:21,524 --> 00:48:24,190 ALLISON Buchholtz-AU: As jy eintlik weet wat die aantal pixels, 1176 00:48:24,190 --> 00:48:25,780 jy kan meer presies te wees dat die pad. 1177 00:48:25,780 --> 00:48:27,200 Jy kan peuter met dit. 1178 00:48:27,200 --> 00:48:27,700 Maar 50%. 1179 00:48:27,700 --> 00:48:31,970 As ons ons leser te verander, Dit sou dit kleiner. 1180 00:48:31,970 --> 00:48:35,250 >> TOMAS Reimers: Wel, dit is basies 50% nou, dink ek. 1181 00:48:35,250 --> 00:48:38,820 Dit is 50%, en dan die marge is bygevoeg om dit. 1182 00:48:38,820 --> 00:48:40,100 CSS het 'n baie eienaardighede. 1183 00:48:40,100 --> 00:48:43,195 So nou is dit 50% van die bladsy breedte. 1184 00:48:43,195 --> 00:48:46,860 Maar onthou dat jy 10 pixels geneem uit elke kant. 1185 00:48:46,860 --> 00:48:49,700 So as jy was om te beweeg wat teen die linkerkant van die leser, 1186 00:48:49,700 --> 00:48:51,550 dan sou dit lyk soos 50%. 1187 00:48:51,550 --> 00:48:53,884 Weereens, soos ek gesê het, CSS kan 'n baie raaiskoot-en-tjek. 1188 00:48:53,884 --> 00:48:56,049 Soos jy dink iets is gaan een manier om op te tree, 1189 00:48:56,049 --> 00:48:57,805 maar dit optree 'n totaal ander manier. 1190 00:48:57,805 --> 00:48:59,420 >> ALLISON Buchholtz-AU: En jy net slimmer, 1191 00:48:59,420 --> 00:49:02,020 en jy net 'n beter intuïsie vir dit as jy beweeg langs. 1192 00:49:02,020 --> 00:49:02,730 >> TOMAS Reimers: En dit erger en erger. 1193 00:49:02,730 --> 00:49:03,496 So dit is eintlik net 'n wedloop. 1194 00:49:03,496 --> 00:49:05,454 >> ALLISON Buchholtz-AU: Dit is super bemoedigend. 1195 00:49:05,454 --> 00:49:07,070 Ons wil hulle CSS te hou. 1196 00:49:07,070 --> 00:49:08,810 >> TOMAS Reimers: CSS is awesome. 1197 00:49:08,810 --> 00:49:10,354 Onthou dat. 1198 00:49:10,354 --> 00:49:11,020 Ander vrae? 1199 00:49:11,020 --> 00:49:14,297 >> ALLISON Buchholtz-AU: Die een ding. 1200 00:49:14,297 --> 00:49:14,880 Enigiets anders? 1201 00:49:14,880 --> 00:49:15,140 Cool. 1202 00:49:15,140 --> 00:49:15,690 >> TOMAS Reimers: Awesome. 1203 00:49:15,690 --> 00:49:18,523 >> ALLISON Buchholtz-AU: Wel, as jy ouens enige vrae later, 1204 00:49:18,523 --> 00:49:20,919 ons is altyd beskikbaar soos gewoonlik. 1205 00:49:20,919 --> 00:49:22,960 Jy sal waarskynlik sien sommige van ons vir finale projekte 1206 00:49:22,960 --> 00:49:24,280 en beslis op die hackathon. 1207 00:49:24,280 --> 00:49:25,200 >> TOMAS Reimers: Absoluut. 1208 00:49:25,200 --> 00:49:25,720 En teen die billike. 1209 00:49:25,720 --> 00:49:26,560 >> ALLISON Buchholtz-AU: En op die beurs. 1210 00:49:26,560 --> 00:49:26,840 Oh. 1211 00:49:26,840 --> 00:49:28,130 >> TOMAS Reimers: Sien uit daarna om sien al jou awesome-- 1212 00:49:28,130 --> 00:49:29,420 >> ALLISON Buchholtz-AU: Ons sal sien al jou ontsagwekkende webwerwe 1213 00:49:29,420 --> 00:49:30,572 dat mooi wees. 1214 00:49:30,572 --> 00:49:32,780 TOMAS Reimers: Jy kan altyd sien, soos die webwerwe 1215 00:49:32,780 --> 00:49:36,234 wat moes, soos, goeie CSS en dan soos dié wat nie probeer om CSS te doen. 1216 00:49:36,234 --> 00:49:39,150 ALLISON Buchholtz-AU: Ook 'n ander ding, een ding om te kyk na 1217 00:49:39,150 --> 00:49:40,445 is Opstarten. 1218 00:49:40,445 --> 00:49:41,805 So Skoenlus is groot. 1219 00:49:41,805 --> 00:49:42,240 >> TOMAS Reimers: Google dat as you-- 1220 00:49:42,240 --> 00:49:43,573 >> ALLISON Buchholtz-AU: Google dit. 1221 00:49:43,573 --> 00:49:44,340 Dit is geweldig. 1222 00:49:44,340 --> 00:49:45,620 Jy sal mal daaroor. 1223 00:49:45,620 --> 00:49:48,000 En nou dat jy 'n basiese begrip van CSS, 1224 00:49:48,000 --> 00:49:50,340 dit sal 'n baie meer sin maak nie. 1225 00:49:50,340 --> 00:49:50,890 Awesome. 1226 00:49:50,890 --> 00:49:51,480 Dankie, ouens. 1227 00:49:51,480 --> 00:49:53,330 >> TOMAS Reimers: Baie dankie. 1228 00:49:53,330 --> 00:49:54,219