1 00:00:00,000 --> 00:00:00,500 2 00:00:00,500 --> 00:00:04,500 >> [REPRODUCCIÓ DE MÚSICA] 3 00:00:04,500 --> 00:00:10,099 4 00:00:10,099 --> 00:00:12,224 ALLISON Buchholtz-AU: Així bàsicament estem només va 5 00:00:12,224 --> 00:00:14,629 per donar-li un resum de CSS, perquè sabem 6 00:00:14,629 --> 00:00:16,420 que no estava cobert en totes les seccions. 7 00:00:16,420 --> 00:00:20,090 I que realment volem per assegurar-se que vostè nois tenen aquesta eina a la seva disposició, 8 00:00:20,090 --> 00:00:24,790 perquè té la capacitat de fer els seus llocs web es veuen molt més bonica. 9 00:00:24,790 --> 00:00:28,660 >> I si vostè està construint un lloc web, a continuació, és probable que desitgi fer-ho bonic. 10 00:00:28,660 --> 00:00:31,372 Vull dir, vostè no ha de, però et suggereixo que. [Rialles] 11 00:00:31,372 --> 00:00:35,430 Si voleu que els usuaris l'utilitzen, és possible que volen que sigui una mica [inaudible]. 12 00:00:35,430 --> 00:00:39,130 Així que anem a tractar de donar-li només algunes eines bàsiques i la comprensió, 13 00:00:39,130 --> 00:00:42,340 de manera que quan vostè surt i ja està la investigació de les coses sobre CSS, 14 00:00:42,340 --> 00:00:45,902 no és completa galimaties, com CSS vegades ser. 15 00:00:45,902 --> 00:00:47,240 >> TOMAS Reimers: Sí. 16 00:00:47,240 --> 00:00:49,930 Allison va dir que prou bé. 17 00:00:49,930 --> 00:00:53,250 Així que suposo que el primer que hem ha de començar amb és el que és CSS? 18 00:00:53,250 --> 00:00:55,750 Així CSS és impressionant. 19 00:00:55,750 --> 00:00:56,250 CSS-- 20 00:00:56,250 --> 00:00:58,320 >> ALLISON Buchholtz-AU: Això és el nom del nostre seminari. 21 00:00:58,320 --> 00:00:58,434 >> TOMAS Reimers: Sí. 22 00:00:58,434 --> 00:01:00,130 És molt important que entén que per llavors. 23 00:01:00,130 --> 00:01:03,090 Si només treus 1 cosa, és que si CSS impressionant. 24 00:01:03,090 --> 00:01:06,180 Dos és CSS significa Cascading Style Sheets. 25 00:01:06,180 --> 00:01:10,380 Així que en el seu nucli, CSS és un full d'estil, és a dir, 26 00:01:10,380 --> 00:01:13,200 que li permet donar estil a una pàgina web. 27 00:01:13,200 --> 00:01:16,609 I llavors el que això significa, és un manera d'afegir estil als seus llocs web. 28 00:01:16,609 --> 00:01:18,900 Així per l'estil, ens referim a tot això no structural-- 29 00:01:18,900 --> 00:01:24,350 així que coses com colors, fons imatges, vores, com, farcit, 30 00:01:24,350 --> 00:01:25,040 marges. 31 00:01:25,040 --> 00:01:27,310 Anem a parlar del que tot el que significa en una mica. 32 00:01:27,310 --> 00:01:30,110 >> Així que hem anat per davant i només obert tant dels alçats en gedit. 33 00:01:30,110 --> 00:01:32,680 Així que això és index.html. 34 00:01:32,680 --> 00:01:34,800 I això és main.css. 35 00:01:34,800 --> 00:01:36,829 Així main.css no té res. 36 00:01:36,829 --> 00:01:38,412 ALLISON Buchholtz-AU: No hi ha un estil fins ara. 37 00:01:38,412 --> 00:01:39,245 TOMAS Reimers: Cap. 38 00:01:39,245 --> 00:01:42,577 I com veuràs, és un lloc molt lleig. 39 00:01:42,577 --> 00:01:44,160 ALLISON Buchholtz-AU: És simplement. 40 00:01:44,160 --> 00:01:45,820 TOMAS Reimers: Sí. 41 00:01:45,820 --> 00:01:49,150 Sí, no és lleig, és només minimalista. 42 00:01:49,150 --> 00:01:53,430 I llavors aquí tenim index.html. 43 00:01:53,430 --> 00:01:55,729 I així, per a un ràpid recapitulació d'HTML, Allison, 44 00:01:55,729 --> 00:01:57,270 només vol parlar de la pàgina? 45 00:01:57,270 --> 00:01:58,395 >> ALLISON Buchholtz-AU: Sí. 46 00:01:58,395 --> 00:02:01,100 Així que, òbviament, tenim la nostra HTML etiqueta, que acaba de noms de fitxers HTML. 47 00:02:01,100 --> 00:02:07,080 Tenim la nostra capçalera aquí, amb CSS Awesomeness, de les quals: si tornes. 48 00:02:07,080 --> 00:02:07,720 On és això? 49 00:02:07,720 --> 00:02:09,136 >> TOMAS Reimers: Oh. 50 00:02:09,136 --> 00:02:10,301 Sí, es pot veure. 51 00:02:10,301 --> 00:02:12,092 ALLISON Buchholtz-AU: I noti la capçalera 52 00:02:12,092 --> 00:02:14,120 és aquesta capçalera pestanya fins aquí. 53 00:02:14,120 --> 00:02:17,130 I després: "Hola, món!" és el text que acabem de 54 00:02:17,130 --> 00:02:19,620 es presenten a la web pàgina, que aquests: tornar. 55 00:02:19,620 --> 00:02:21,290 Enrere. 56 00:02:21,290 --> 00:02:24,287 Que no és més en el nostre cos aquí-- el text sense format. 57 00:02:24,287 --> 00:02:26,120 A més, una cosa és compte, si ens fixem aquí, 58 00:02:26,120 --> 00:02:29,410 Tomas va canviar fins a aquests 2 de la nostra diapositiva. 59 00:02:29,410 --> 00:02:32,035 Així que, mentre vostè té tot tres d'ells, estàs bé. 60 00:02:32,035 --> 00:02:34,044 Poden estar en qualsevol ordre que vulguin. 61 00:02:34,044 --> 00:02:39,368 El més important és que que té cadascuna d'aquestes tres coses. 62 00:02:39,368 --> 00:02:40,340 >> TOMAS Reimers: Cool. 63 00:02:40,340 --> 00:02:41,111 Afegir un tipus doc? 64 00:02:41,111 --> 00:02:42,235 ALLISON Buchholtz-AU: Sí. 65 00:02:42,235 --> 00:02:43,068 TOMAS Reimers: Sí. 66 00:02:43,068 --> 00:02:43,769 Fresc. 67 00:02:43,769 --> 00:02:46,102 ALLISON Buchholtz-AU: Pel que sembla, meus micròfons no m'agrada. 68 00:02:46,102 --> 00:02:49,650 TOMAS Reimers: Oh, doneu-nos un segon just mentre Allison canvia al seu micròfon. 69 00:02:49,650 --> 00:02:50,500 Així que si. 70 00:02:50,500 --> 00:02:52,030 Així que tenim a la nostra pàgina principal. 71 00:02:52,030 --> 00:02:53,890 És una espècie de sense estil. 72 00:02:53,890 --> 00:02:54,780 No tenim molt. 73 00:02:54,780 --> 00:02:57,110 Només tenim bàsicament text. 74 00:02:57,110 --> 00:02:59,470 Tenim el full d'estils. 75 00:02:59,470 --> 00:03:00,220 Tenim el títol. 76 00:03:00,220 --> 00:03:04,020 Així que només nua desossada components fan un lloc web. 77 00:03:04,020 --> 00:03:08,880 >> Així que a partir d'aquí, anem a parlar del que és CSS 78 00:03:08,880 --> 00:03:11,270 i el que sembla i tot això. 79 00:03:11,270 --> 00:03:12,047 Així que per que-- 80 00:03:12,047 --> 00:03:13,755 ALLISON Buchholtz-AU: Tornar a les diapositives. 81 00:03:13,755 --> 00:03:15,200 TOMAS Reimers: Tornar a les diapositives. 82 00:03:15,200 --> 00:03:17,240 I Allison pot prendre el relleu. 83 00:03:17,240 --> 00:03:18,720 >> ALLISON Buchholtz-AU: Woo. 84 00:03:18,720 --> 00:03:19,220 D'acord. 85 00:03:19,220 --> 00:03:22,360 Així que en el seu arxiu CSS, vostè va a tenir 86 00:03:22,360 --> 00:03:25,010 moltes d'aquestes coses diu selectors. 87 00:03:25,010 --> 00:03:27,420 Això només serà el base del seu arxiu CSS. 88 00:03:27,420 --> 00:03:29,480 És només serà munts i munts d'elles. 89 00:03:29,480 --> 00:03:30,780 Així selecció. 90 00:03:30,780 --> 00:03:32,649 Això és només l'anatomia general. 91 00:03:32,649 --> 00:03:35,190 Anem a anar a través de exemples, perquè si mai nois 92 00:03:35,190 --> 00:03:38,400 vist el meu secció, em sento que les coses en abstracte 93 00:03:38,400 --> 00:03:39,400 realment no té sentit. 94 00:03:39,400 --> 00:03:41,110 Sempre ajuda a veure els exemples. 95 00:03:41,110 --> 00:03:42,420 >> Així que tenim una mica de selecció. 96 00:03:42,420 --> 00:03:49,120 Això serà algun identificador de el que volem l'estil per aplicar a. 97 00:03:49,120 --> 00:03:52,220 I després podem tenir qualsevol conjunt de normes i valors. 98 00:03:52,220 --> 00:03:55,680 Així selectors que es poden veure podria ser alguna cosa així com el cos, 99 00:03:55,680 --> 00:04:00,262 o paràgraf amb P, o de capçalera, o el que sigui, 100 00:04:00,262 --> 00:04:02,000 el que vol que les etiquetes HTML que siguin. 101 00:04:02,000 --> 00:04:03,570 >> Així que en aquest cas, tenim cos. 102 00:04:03,570 --> 00:04:06,985 I tenim alguna regla, que això correspon 103 00:04:06,985 --> 00:04:09,610 al que el seu estil s'aplica a. 104 00:04:09,610 --> 00:04:12,720 Així que en aquest cas, tenim color de fons i el pes del text. 105 00:04:12,720 --> 00:04:16,200 Així que això canviarà el fons de res 106 00:04:16,200 --> 00:04:19,640 dins de qualsevol etiqueta del cos del nostre arxiu HTML. 107 00:04:19,640 --> 00:04:22,810 I es va a donar que aquest valor de color blau clar. 108 00:04:22,810 --> 00:04:24,820 >> Així que va a fer que el fons blau clar. 109 00:04:24,820 --> 00:04:28,660 I després res al cos és tindrà un pes negreta. 110 00:04:28,660 --> 00:04:31,142 Així que només va a negreta tot el nostre text. 111 00:04:31,142 --> 00:04:32,970 I això és només un selector. 112 00:04:32,970 --> 00:04:34,680 Però vostè podria tenir molts d'aquests. 113 00:04:34,680 --> 00:04:38,730 I com anem a mostrar més tard, una mica més en com 114 00:04:38,730 --> 00:04:40,709 que les obres i més exemples allà. 115 00:04:40,709 --> 00:04:41,750 Qualsevol cosa que vulguis afegir? 116 00:04:41,750 --> 00:04:42,499 >> TOMAS Reimers: No. 117 00:04:42,499 --> 00:04:43,500 Allison va aconseguir. 118 00:04:43,500 --> 00:04:46,144 Només anem a tallar fins a un exemple aquí al nostre lloc exemple. 119 00:04:46,144 --> 00:04:47,310 Així que aprofitarem aquesta realitat. 120 00:04:47,310 --> 00:04:48,620 És perfecte. 121 00:04:48,620 --> 00:04:54,460 Així que només vaig a copiar i enganxar que la dreta al nostre arxiu main.css. 122 00:04:54,460 --> 00:04:56,530 I jo vaig a guardar-lo. 123 00:04:56,530 --> 00:04:59,190 I després anem a executar-lo. 124 00:04:59,190 --> 00:05:01,600 Així nota banda, una de les la majoria de les coses frustrants 125 00:05:01,600 --> 00:05:04,490 és si vostè no guarda un arxiu, i a continuació, vostè, com, torna a carregar la pàgina, 126 00:05:04,490 --> 00:05:07,450 i igual que, per què no és el canvi succeeixi? 127 00:05:07,450 --> 00:05:07,950 Succeeix. 128 00:05:07,950 --> 00:05:14,230 Així que aquí vam veure que vam fer la nostra pàgina web un fons blau clar 129 00:05:14,230 --> 00:05:16,560 i una mica de text en negreta. 130 00:05:16,560 --> 00:05:20,730 >> També he de dir, si nois tenen preguntes sobre qualsevol cosa 131 00:05:20,730 --> 00:05:23,622 que estem fent, sentim si us plau lliure per aturar-nos i preguntar-nos. 132 00:05:23,622 --> 00:05:25,330 Estem completament disposats per contestar preguntes. 133 00:05:25,330 --> 00:05:27,951 134 00:05:27,951 --> 00:05:31,930 >> ALLISON Buchholtz-AU: Òbviament, amb CSS, tot basa en si mateix. 135 00:05:31,930 --> 00:05:34,107 Així que si una cosa no tenir sentit ara, 136 00:05:34,107 --> 00:05:35,690 no vull que a empantanegar més tard. 137 00:05:35,690 --> 00:05:38,390 138 00:05:38,390 --> 00:05:41,930 >> TOMAS Reimers: Així que anem a tipus de disseccionar això. 139 00:05:41,930 --> 00:05:44,210 Llavors, vols començar amb el selector d'aquí? 140 00:05:44,210 --> 00:05:45,979 >> ALLISON Buchholtz-AU: Sí. 141 00:05:45,979 --> 00:05:48,270 Com deia abans, el cos és només el nostre selector d'aquí. 142 00:05:48,270 --> 00:05:50,950 Així que si ens remuntem a la nostra ah index--. 143 00:05:50,950 --> 00:05:53,245 >> TOMAS Reimers: Què jo només vaig tancar. 144 00:05:53,245 --> 00:05:54,530 Dóna'm un segon. 145 00:05:54,530 --> 00:05:58,286 Així 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 Així que si vostè nota aquí, tenir aquestes etiquetes del cos, no? 148 00:06:02,710 --> 00:06:06,270 Així que el selector només correspon a les etiquetes que els que estem parlant. 149 00:06:06,270 --> 00:06:07,670 Així el cos aquí. 150 00:06:07,670 --> 00:06:10,315 Així que el que estem dient és tot-- podem tornar? 151 00:06:10,315 --> 00:06:12,065 Tant de bo pogués només com tocar la pantalla. 152 00:06:12,065 --> 00:06:14,410 Seria molt més fresc. 153 00:06:14,410 --> 00:06:17,150 >> Així que qualsevol cosa dins dels etiquetes del cos, que vam veure 154 00:06:17,150 --> 00:06:19,637 era només, com el text, i el cos en general 155 00:06:19,637 --> 00:06:20,970 es refereix a, com, el fons. 156 00:06:20,970 --> 00:06:22,720 Si alguna vegada vols canviar el fons, 157 00:06:22,720 --> 00:06:25,090 que serà en un cos de l'etiqueta. 158 00:06:25,090 --> 00:06:27,120 Només té aquestes regles s'apliquen a ells. 159 00:06:27,120 --> 00:06:32,040 >> Així que si haguéssim d'anar a index.html i- en realitat, 160 00:06:32,040 --> 00:06:33,840 podem tenir alguna cosa fora del cos? 161 00:06:33,840 --> 00:06:37,340 Si tinguéssim, com, un peu de pàgina o alguna cosa, no s'aplicaria a aquest. 162 00:06:37,340 --> 00:06:40,900 Però qualsevol cosa dins aquestes etiquetes del cos va 163 00:06:40,900 --> 00:06:44,960 a ser afectats per aquest òrgan selector que hem fet. 164 00:06:44,960 --> 00:06:47,405 Així que si anés a escriure una mica més allà-- 165 00:06:47,405 --> 00:06:49,400 >> TOMAS Reimers: Anem a gestionar això. 166 00:06:49,400 --> 00:06:55,330 Així que si teníem un div-- així que això és només una altra etiqueta que pot tenir. 167 00:06:55,330 --> 00:06:56,350 Vaig a tancar-la. 168 00:06:56,350 --> 00:06:58,280 O farem d'aquest un paràgraf. 169 00:06:58,280 --> 00:07:01,430 Així p significa paràgraf. 170 00:07:01,430 --> 00:07:02,560 I dins d'aquest paràgraf. 171 00:07:02,560 --> 00:07:05,650 I llavors jo dic: "Aquest és el text." 172 00:07:05,650 --> 00:07:06,369 Fresc. 173 00:07:06,369 --> 00:07:09,160 I llavors vaig fer aquesta regla s'aplica a un paràgraf en lloc del cos. 174 00:07:09,160 --> 00:07:12,390 175 00:07:12,390 --> 00:07:17,320 Veuràs com s'aplica només a el paràgraf recentment format, dreta, 176 00:07:17,320 --> 00:07:18,892 No tot l'assumpte. 177 00:07:18,892 --> 00:07:20,090 Té això sentit? 178 00:07:20,090 --> 00:07:21,840 >> ALLISON Buchholtz-AU: Així que això és tot el cos, 179 00:07:21,840 --> 00:07:24,450 però ara el nostre selector només correspon al paràgraf. 180 00:07:24,450 --> 00:07:27,050 Així que només tenim negreta i blau d'aquest paràgraf específic, 181 00:07:27,050 --> 00:07:30,760 perquè aquesta és l'única cosa que està tancat dins de l'etiqueta p. 182 00:07:30,760 --> 00:07:35,349 >> TOMAS Reimers: Té sentit espècie de com les coses encapsular altres coses? 183 00:07:35,349 --> 00:07:38,140 ALLISON Buchholtz-AU: A més, només dir, com una de les millors maneres 184 00:07:38,140 --> 00:07:40,889 per aconseguir realment còmode amb CSS és simplement fer les coses d'aquesta manera, 185 00:07:40,889 --> 00:07:42,050 només provar-ho. 186 00:07:42,050 --> 00:07:46,700 És molt senzill d'escriure alguna cosa fora, va colpejar Actualitzar, i veure què passa. 187 00:07:46,700 --> 00:07:48,940 I com amb la majoria de CS, experimentació pot sovint 188 00:07:48,940 --> 00:07:51,790 conduir a una millor comprensió intuïtiva. 189 00:07:51,790 --> 00:07:54,432 Fins i tot més que nosaltres simplement, com, parlant amb vostè. 190 00:07:54,432 --> 00:07:58,350 >> TOMAS Reimers: Absolutament 100% d'acord en aquest punt. 191 00:07:58,350 --> 00:08:02,430 Així que si ens remuntem a això, anem a començar dissecció exactament el que aquests dos ho fan. 192 00:08:02,430 --> 00:08:04,550 Així que tenim dues normes sobre això. 193 00:08:04,550 --> 00:08:07,420 Així que la primera d'elles és el color de fons. 194 00:08:07,420 --> 00:08:10,590 I veus que hem establert que igual a un valor, de color blau clar. 195 00:08:10,590 --> 00:08:15,009 >> Així que en CSS, CSS és una espècie de molt solt sobre com 196 00:08:15,009 --> 00:08:16,300 se't permet definir el color. 197 00:08:16,300 --> 00:08:17,800 Així es pot definir pel seu nom. 198 00:08:17,800 --> 00:08:20,650 També pot fer alguna cosa com "vermell". 199 00:08:20,650 --> 00:08:25,270 I després, si ens remuntem a això, veuràs que el fons és de color vermell. 200 00:08:25,270 --> 00:08:29,040 També pot obtenir realmente-- crec que pot ser bastant creatiu amb això, 201 00:08:29,040 --> 00:08:29,540 ¿No és així? 202 00:08:29,540 --> 00:08:31,170 >> ALLISON Buchholtz-AU: I pensa que pot utilitzar hexagonal. 203 00:08:31,170 --> 00:08:31,250 No pots? 204 00:08:31,250 --> 00:08:32,083 >> TOMAS Reimers: Sí. 205 00:08:32,083 --> 00:08:32,969 Així que vostè pot utilitzar hexagonal. 206 00:08:32,969 --> 00:08:34,490 Però estic pensant nom-savi. 207 00:08:34,490 --> 00:08:35,385 No hi ha? 208 00:08:35,385 --> 00:08:37,260 ALLISON Buchholtz-AU: Vostè pot fer uns quants. 209 00:08:37,260 --> 00:08:43,350 Més o menys com la majoria dels colors que vostè pot nom-- com, crec que el salmó és un. 210 00:08:43,350 --> 00:08:45,322 >> TOMAS Reimers: Estem salmó intent va. 211 00:08:45,322 --> 00:08:47,530 ALLISON Buchholtz-AU: I crec chartreuse hi és. 212 00:08:47,530 --> 00:08:48,050 TOMAS Reimers: Sí. 213 00:08:48,050 --> 00:08:48,550 Veus? 214 00:08:48,550 --> 00:08:50,080 Pel que pot ser bastant creatiu. 215 00:08:50,080 --> 00:08:52,246 >> ALLISON Buchholtz-AU: Vostè podria ser bastant creatiu. 216 00:08:52,246 --> 00:08:55,750 Igual que, si es pot pensar en el nom del color, és probable que sigui allà. 217 00:08:55,750 --> 00:08:57,840 Si realment vols fina detall, es pot anar hexagonal. 218 00:08:57,840 --> 00:08:58,673 >> TOMAS Reimers: Sí. 219 00:08:58,673 --> 00:08:59,390 Així hexadecimal. 220 00:08:59,390 --> 00:09:05,280 Si vostès recordin això de nou del seu antic PSET, Imatge Recover, 221 00:09:05,280 --> 00:09:08,300 vostès havien de bregar amb aquests valors hex. 222 00:09:08,300 --> 00:09:15,280 I mena de recapitular el que és, hex té tres valors emmagatzemats en ella. 223 00:09:15,280 --> 00:09:17,250 Així que és en grups de dos increments. 224 00:09:17,250 --> 00:09:19,300 Les dues primeres representen el valor de vermell. 225 00:09:19,300 --> 00:09:22,420 El segon representa el valor verd. 226 00:09:22,420 --> 00:09:25,020 I l'últim és blau? 227 00:09:25,020 --> 00:09:30,050 >> Així succeeix FF per representar 1 hexadecimal 255. 228 00:09:30,050 --> 00:09:35,480 Així que tens 255 vermell, 255 verd, i 0 per al blau. 229 00:09:35,480 --> 00:09:37,670 I els valors oscil·len entre 0 i 255. 230 00:09:37,670 --> 00:09:38,350 >> AUDIÈNCIA: Correcte. 231 00:09:38,350 --> 00:09:41,472 Així que, essencialment, podríem buscar l'Internet per a qualsevol color que volem, 232 00:09:41,472 --> 00:09:43,912 i identificar la realitat-coneguda de color combo espectre, 233 00:09:43,912 --> 00:09:45,130 i llavors podríem posar en? 234 00:09:45,130 --> 00:09:46,380 ALLISON Buchholtz-AU: Exactament. 235 00:09:46,380 --> 00:09:52,900 Així que tens més o menys complet control sobre els colors que vulguis dins de CSS. 236 00:09:52,900 --> 00:09:55,069 Anem a parlar de imatges de fons més endavant? 237 00:09:55,069 --> 00:09:56,110 O volem fer això? 238 00:09:56,110 --> 00:09:56,240 >> TOMAS Reimers: Sí. 239 00:09:56,240 --> 00:09:57,010 Absolutament. 240 00:09:57,010 --> 00:10:00,830 Així que primer, només per demostrar que vermell i verd és de color groc. 241 00:10:00,830 --> 00:10:03,120 I si necessites una mica ajuda per trobar això, 242 00:10:03,120 --> 00:10:05,575 pot buscar a Google alguna cosa com "selector de color." 243 00:10:05,575 --> 00:10:07,200 ALLISON Buchholtz-AU: Oh, és tan bo. 244 00:10:07,200 --> 00:10:09,090 M'encanta Selector de color. 245 00:10:09,090 --> 00:10:11,360 >> TOMAS Reimers: colorpicker.com és un bon exemple. 246 00:10:11,360 --> 00:10:14,580 I aquí, podràs veure que tens un selector de color de Photoshop-com completa. 247 00:10:14,580 --> 00:10:14,920 >> ALLISON Buchholtz-AU: Mm-hm. 248 00:10:14,920 --> 00:10:16,980 A més, les coses interessants és que pot generar esquemes de color 249 00:10:16,980 --> 00:10:18,896 de manera que vostè no té, com, xocant colors. 250 00:10:18,896 --> 00:10:22,780 TOMAS Reimers: I llavors aquí hi ha el valor hexadecimal fins aquí. 251 00:10:22,780 --> 00:10:27,800 Així que sempre es pot trobar en línia, bàsicament, llocs per obtenir el valor hexadecimal de. 252 00:10:27,800 --> 00:10:31,667 No és una espècie que s'acaba, com, ens veure els colors del món en nombre. 253 00:10:31,667 --> 00:10:34,000 És més que anem en línia i trobem quin color volem, 254 00:10:34,000 --> 00:10:36,850 i després prendre el nombre. 255 00:10:36,850 --> 00:10:39,590 Perquè és només un molt fàcil manera de Referència coses a CS. 256 00:10:39,590 --> 00:10:40,350 >> ALLISON Buchholtz-AU: I després hi també-- 257 00:10:40,350 --> 00:10:41,630 No recordo el nom exacte del lloc. 258 00:10:41,630 --> 00:10:43,838 Però no hi ha dubte, jo pensar, una mica d'Adobe 259 00:10:43,838 --> 00:10:48,350 que genera esquemes de color per a vostè, que és realment genial, perquè 260 00:10:48,350 --> 00:10:50,580 definitely-- de vegades difícil d'entendre, 261 00:10:50,580 --> 00:10:53,729 oh, si vull usar aquest color, el que podria ser un altre útil 262 00:10:53,729 --> 00:10:56,395 utilitzar en un altre lloc en el meu lloc per, com, que sigui agradable i cohesionada. 263 00:10:56,395 --> 00:11:00,430 264 00:11:00,430 --> 00:11:04,260 >> TOMAS Reimers: Allison està parlant de un per Adobe Kuler flama, crec. 265 00:11:04,260 --> 00:11:04,885 És K-O-L-E-R. 266 00:11:04,885 --> 00:11:06,259 ALLISON Buchholtz-UA: Crec que si. 267 00:11:06,259 --> 00:11:07,610 Estic bastant segur que és l'un. 268 00:11:07,610 --> 00:11:11,050 >> TOMAS Reimers: El meu favorit té sempre ha estat Esquema de color 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: Quin és ara-- 271 00:11:16,010 --> 00:11:16,860 >> ALLISON Buchholtz-AU: Ah, això és bonic. 272 00:11:16,860 --> 00:11:18,818 >> TOMAS Reimers: I Bàsicament es pot dir, com, 273 00:11:18,818 --> 00:11:21,700 Vull tres colors un al costat de l'altre. 274 00:11:21,700 --> 00:11:25,030 I després farem alguna cosa agradable. 275 00:11:25,030 --> 00:11:29,210 I llavors es pot obtenir un exemple del que podria semblar. 276 00:11:29,210 --> 00:11:32,470 I després quan passem el ratolí sobre qualsevol ells, se li dóna el valor hexadecimal. 277 00:11:32,470 --> 00:11:35,010 >> Així que igual que una bona manera de començar pensar en esquemes de color 278 00:11:35,010 --> 00:11:39,570 o quins colors en una pàgina web podria anar bé junts. 279 00:11:39,570 --> 00:11:45,655 A causa de que pot ser sorprenentment no tan fàcil d'aprendre com vostè pensa. 280 00:11:45,655 --> 00:11:48,280 I després l'altra cosa fresca Sempre he trobat sobre aquest lloc 281 00:11:48,280 --> 00:11:51,480 és si es colpeja exemples, que va a mostrar el que un lloc web d'exemple 282 00:11:51,480 --> 00:11:54,800 podria semblar que l'ús de combinació de colors. 283 00:11:54,800 --> 00:11:56,270 De totes maneres. 284 00:11:56,270 --> 00:11:57,863 >> Tornar a la CSS real. 285 00:11:57,863 --> 00:12:01,112 ALLISON Buchholtz-AU: Però òbviament, conèixer aquestes referències poden ser útils. 286 00:12:01,112 --> 00:12:03,195 TOMAS Reimers: No, sens dubte pot ser útil. 287 00:12:03,195 --> 00:12:04,720 Així que la segona regla, Allison? 288 00:12:04,720 --> 00:12:05,844 >> ALLISON Buchholtz-AU: Sí. 289 00:12:05,844 --> 00:12:08,280 La segona regla és només corresponent a la nostra font. 290 00:12:08,280 --> 00:12:11,520 Així que el pes del text és només una mica de-- el que el pes ho faria 291 00:12:11,520 --> 00:12:15,220 estar si vols simplement, com, normal o, igual que, les fonts més primes, 292 00:12:15,220 --> 00:12:17,251 o en aquest cas, igual que, en negreta. 293 00:12:17,251 --> 00:12:17,750 Em oblit. 294 00:12:17,750 --> 00:12:21,557 Què és el si volia it-- hi és un més prim que tot just, com, normal? 295 00:12:21,557 --> 00:12:24,140 TOMAS Reimers: Jo en realitat no saber si hi ha un més prim. 296 00:12:24,140 --> 00:12:24,680 ALLISON Buchholtz-AU: m'oblidi. 297 00:12:24,680 --> 00:12:26,300 Així el pes de la font que normalment només ha d'utilitzar per negreta. 298 00:12:26,300 --> 00:12:29,010 Si vostè vol aconseguir realment en ella, anem a mostrar. 299 00:12:29,010 --> 00:12:34,317 W3Schools té tots els diferents coses que vostè pot fer per les fonts. 300 00:12:34,317 --> 00:12:36,900 Però, bàsicament, si mai vols canviar res de la font, 301 00:12:36,900 --> 00:12:39,330 que sempre serà, com, la font i tants. 302 00:12:39,330 --> 00:12:43,450 Així serà com, font-family si estàs tractant de canviar el tipus real. 303 00:12:43,450 --> 00:12:47,390 Serà d'estil de font si vostè volen que sigui com cursiva, 304 00:12:47,390 --> 00:12:49,710 o cursiva, o el que sigui. 305 00:12:49,710 --> 00:12:53,570 O fins i tot de font-color, si volíem canviar això. 306 00:12:53,570 --> 00:12:55,621 >> TOMAS Reimers: Així és. 307 00:12:55,621 --> 00:12:56,925 Així que vostè pot canviar això. 308 00:12:56,925 --> 00:12:59,360 I espècie de només per recapitular ara, perquè puguis 309 00:12:59,360 --> 00:13:01,400 veiem que tenim el selector cap amunt aquí. 310 00:13:01,400 --> 00:13:03,000 Tenim aquestes claus. 311 00:13:03,000 --> 00:13:06,735 I després tenim regles delimitat per punt i coma. 312 00:13:06,735 --> 00:13:08,100 Té això sentit? 313 00:13:08,100 --> 00:13:09,130 Sí? 314 00:13:09,130 --> 00:13:10,500 Fresc. 315 00:13:10,500 --> 00:13:13,200 Així que si això és good-- 316 00:13:13,200 --> 00:13:14,424 >> ALLISON Buchholtz-AU: Tornar. 317 00:13:14,424 --> 00:13:17,590 TOMAS Reimers: Parlem específicament sobre quin tipus de selectors que tenim. 318 00:13:17,590 --> 00:13:19,790 Perquè ara que hem espècie de només mostra les etiquetes. 319 00:13:19,790 --> 00:13:21,696 Però vostès podrien veure plausible. 320 00:13:21,696 --> 00:13:23,570 Diguem que tens dos paràgrafs en una pàgina i que 321 00:13:23,570 --> 00:13:26,087 vull ser capaç d'estil un però no l'altre, 322 00:13:26,087 --> 00:13:29,170 no només vol de limitar a haver d'utilitzar diferents HTML real 323 00:13:29,170 --> 00:13:33,410 etiquetes per donar-los diferents estils. 324 00:13:33,410 --> 00:13:35,995 >> Així que tenim tres bàsic tipus de selectors. 325 00:13:35,995 --> 00:13:37,120 ALLISON Buchholtz-AU: Sí. 326 00:13:37,120 --> 00:13:39,828 Així que tenim l'etiqueta, que és el que hem estat parlant en aquest moment. 327 00:13:39,828 --> 00:13:42,430 Així que això és alguna cosa així com el seu cos o p. 328 00:13:42,430 --> 00:13:46,280 I després tenim la classe, que és quan el definim en el nostre arxiu CSS, 329 00:13:46,280 --> 00:13:49,907 que sempre serà punt, el que sigui desitja que el nom de la classe que sigui. 330 00:13:49,907 --> 00:13:51,490 I això es pot aplicar a diverses coses. 331 00:13:51,490 --> 00:13:54,610 332 00:13:54,610 --> 00:13:57,610 >> Diguem que vostè té cinc paràgrafs i dos dels tres 333 00:13:57,610 --> 00:14:00,580 necessitar ser el mateix estil, que s'aplicaria una classe a la mateixa. 334 00:14:00,580 --> 00:14:03,040 I això és només la forma en què ho fem. 335 00:14:03,040 --> 00:14:05,600 Nosaltres li donarem un exemple de on aquesta realitat mostra a dalt. 336 00:14:05,600 --> 00:14:11,030 Però si ha de potser alguns d'etiquetes p, després d'ell, vostè escriuria, 337 00:14:11,030 --> 00:14:14,170 classe és igual independentment de les classes que desitja aplicar a la mateixa. 338 00:14:14,170 --> 00:14:19,280 Així que el que els selectors de classe que volem aplicar al present apartat específic, 339 00:14:19,280 --> 00:14:21,300 poguéssim escriure així. 340 00:14:21,300 --> 00:14:24,080 Per descomptat, crec que un exemple farà que sigui molt més concreta. 341 00:14:24,080 --> 00:14:27,270 >> L'altre tenim és id, que denotem 342 00:14:27,270 --> 00:14:29,707 amb un hash, o lliures, o 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 Això funciona, també. 346 00:14:34,550 --> 00:14:36,640 I aquest ha de ser realment única. 347 00:14:36,640 --> 00:14:39,880 Ells només s'han d'aplicar a una cosa a la seva pàgina. 348 00:14:39,880 --> 00:14:43,820 Així que si això és un paràgraf específic, o algun element d'una llista, o el que sigui, 349 00:14:43,820 --> 00:14:45,090 això ha de ser únic. 350 00:14:45,090 --> 00:14:48,730 I de la mateixa manera que acabem de dir, com, class = "Classe2 class1" 351 00:14:48,730 --> 00:14:51,577 això només pot ser Identificació del que tenim. 352 00:14:51,577 --> 00:14:52,410 TOMAS Reimers: Sí. 353 00:14:52,410 --> 00:14:54,330 Així que anem a parlar definitivament sobre exemples aquí. 354 00:14:54,330 --> 00:14:58,170 I jo només vaig a bussejar cap enrere en el codi. 355 00:14:58,170 --> 00:15:02,090 Així que donem una ullada a la nostra HTML. 356 00:15:02,090 --> 00:15:03,960 I pel que en aquest moment tenim un paràgraf. 357 00:15:03,960 --> 00:15:05,510 Aquest és el text. 358 00:15:05,510 --> 00:15:09,151 Jo només vaig a modificar ella. "Aquest és un text 1." 359 00:15:09,151 --> 00:15:11,150 I després anem a tenir una "Això és text 2." 360 00:15:11,150 --> 00:15:12,525 >> ALLISON Buchholtz-AU: Segona un. 361 00:15:12,525 --> 00:15:13,540 TOMAS Reimers: Així és. 362 00:15:13,540 --> 00:15:16,810 Així que ara tenim "Aquest és el text 2", oi? 363 00:15:16,810 --> 00:15:21,560 I anem a veure que si recarreguem la pàgina, el que trobarem 364 00:15:21,560 --> 00:15:23,067 és que anem a 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: Sí. 367 00:15:24,983 --> 00:15:27,570 Anem a trobar una "Això és text 1 "i" Aquest és un text 2. " 368 00:15:27,570 --> 00:15:28,650 >> ALLISON Buchholtz-AU: I color groc fora encantador. 369 00:15:28,650 --> 00:15:31,066 >> TOMAS Reimers: I veuràs que el nostre selector en aquest moment, 370 00:15:31,066 --> 00:15:34,940 que s'aplica a p de, o paràgrafs, afecta a tots dos, 371 00:15:34,940 --> 00:15:38,700 perquè tots dos es troben amb el condició que els dos són una etiqueta pàg. 372 00:15:38,700 --> 00:15:40,360 Això té sentit total. 373 00:15:40,360 --> 00:15:43,340 Així que la pregunta és, bé, el que si volíem només aconseguir un? 374 00:15:43,340 --> 00:15:46,350 Així exactament com Allison estava dient, tenim dues maneres de fer-ho. 375 00:15:46,350 --> 00:15:47,320 Vaig a començar amb id. 376 00:15:47,320 --> 00:15:48,405 >> ALLISON Buchholtz-AU: Anem a començar amb id. 377 00:15:48,405 --> 00:15:50,405 >> TOMAS Reimers: I tots dos d'aquests són atributs. 378 00:15:50,405 --> 00:15:53,200 Així que hi atributs en HTML. 379 00:15:53,200 --> 00:15:55,600 I el que són és cosa que s'agrega 380 00:15:55,600 --> 00:15:58,840 dins de l'etiqueta que és separar del nom de l'etiqueta. 381 00:15:58,840 --> 00:16:01,301 Així que vostè pot tenir diversos atributs. 382 00:16:01,301 --> 00:16:01,800 Sí? 383 00:16:01,800 --> 00:16:03,950 >> ALLISON Buchholtz-AU: Estava a punt dir, del seu exemple de PSET 7, 384 00:16:03,950 --> 00:16:06,650 si algun de vostès tracten d'alinear coses per al centre, 385 00:16:06,650 --> 00:16:08,550 que podria haver utilitzat "Text align = center." 386 00:16:08,550 --> 00:16:10,550 I t'has adonat que probablement hauria d'haver centrat 387 00:16:10,550 --> 00:16:12,650 el seu text oa la barra de navegació. 388 00:16:12,650 --> 00:16:15,499 Així que això és just també un atribut que podria estar familiaritzat. 389 00:16:15,499 --> 00:16:18,040 TOMAS Reimers: Hi ha un munt d'atributs que ja ho veuràs. 390 00:16:18,040 --> 00:16:18,539 Sí. 391 00:16:18,539 --> 00:16:21,250 Com a bona referència per PSET juliol. 392 00:16:21,250 --> 00:16:23,150 Tenim Identificació. 393 00:16:23,150 --> 00:16:25,080 Vostè també pot tenir classe, coses com aquesta. 394 00:16:25,080 --> 00:16:27,250 Una sola etiqueta pot tenir molts atributs. 395 00:16:27,250 --> 00:16:33,140 Així que a partir de la identificació, anem a suposar que vull tenir un id de-- No sé. 396 00:16:33,140 --> 00:16:35,140 L'anomenarem especial, perquè aquest, estem 397 00:16:35,140 --> 00:16:37,867 farà negreta, i subratllat i el que sigui. 398 00:16:37,867 --> 00:16:39,950 ALLISON Buchholtz-AU: És Serà molt especial. 399 00:16:39,950 --> 00:16:42,360 TOMAS Reimers: Així que aquesta un, tenim Identificació especial. 400 00:16:42,360 --> 00:16:48,140 Així que la forma per seleccionar que és, llavors, en main.css, en lloc de tenir una etiqueta p, 401 00:16:48,140 --> 00:16:51,500 fas #special, OK? 402 00:16:51,500 --> 00:16:55,538 I això selecciona el cosa amb id especial. 403 00:16:55,538 --> 00:16:57,295 Té això sentit per a tothom? 404 00:16:57,295 --> 00:16:57,920 AUDIÈNCIA: Sí. 405 00:16:57,920 --> 00:16:59,110 TOMAS Reimers: Cool. 406 00:16:59,110 --> 00:17:04,440 Així que ara si ens remuntem, anem a veure-- crits. 407 00:17:04,440 --> 00:17:06,240 Sí. 408 00:17:06,240 --> 00:17:09,460 Veurem que només selecciona l'un amb id especial. 409 00:17:09,460 --> 00:17:10,622 Sí? 410 00:17:10,622 --> 00:17:11,900 Sona genial. 411 00:17:11,900 --> 00:17:12,570 Sí. 412 00:17:12,570 --> 00:17:15,456 >> AUDIÈNCIA: Pot alguna cosa tenir un atribuir tant de classe i un id? 413 00:17:15,456 --> 00:17:16,359 >> TOMAS Reimers: Sí. 414 00:17:16,359 --> 00:17:16,900 AUDIÈNCIA: OK. 415 00:17:16,900 --> 00:17:20,887 I llavors, què passa si després des que algunes regles CSS en aquest conflicte? 416 00:17:20,887 --> 00:17:21,970 TOMAS Reimers: Per descomptat. 417 00:17:21,970 --> 00:17:23,940 Definitivament anem per parlar d'això. 418 00:17:23,940 --> 00:17:31,890 Així exactament el que estaven fent a, també pot tenir classes. 419 00:17:31,890 --> 00:17:36,380 Així que anem a pretendre que tenia tres paràgrafs i jo 420 00:17:36,380 --> 00:17:38,730 volia donar-li estil al primer dos, però no la tercera. 421 00:17:38,730 --> 00:17:42,850 Bé, la seva primera idea pot ser, bé, només podia donar el segon un id. 422 00:17:42,850 --> 00:17:45,590 Però no es pot, perquè un id, exactament igual que Allison estava dient, 423 00:17:45,590 --> 00:17:47,330 ha de ser únic. 424 00:17:47,330 --> 00:17:50,860 >> Així que en lloc d'un id, el que pot utilitzar és vostè pot utilitzar una classe. 425 00:17:50,860 --> 00:17:57,880 I una class-- el que permet que facis és bàsicament dir, 426 00:17:57,880 --> 00:17:59,610 això pertany com a part d'un grup. 427 00:17:59,610 --> 00:18:02,410 En aquest cas, el nostre grup es diu especial. 428 00:18:02,410 --> 00:18:06,500 I què farem a continuació és anem a dir-- en lloc de lliures, 429 00:18:06,500 --> 00:18:08,070 utilitzarem punts. 430 00:18:08,070 --> 00:18:08,740 D'acord? 431 00:18:08,740 --> 00:18:11,950 I noti que la lliura i el punt només existeixen a l'arxiu CSS, 432 00:18:11,950 --> 00:18:12,797 no dins de l'HTML. 433 00:18:12,797 --> 00:18:13,880 ALLISON Buchholtz-AU: Sí. 434 00:18:13,880 --> 00:18:15,185 Distinció important. 435 00:18:15,185 --> 00:18:17,510 >> TOMAS Reimers: Tinc tenia tanta lluita, 436 00:18:17,510 --> 00:18:23,990 perquè vaig posar el hash en l'HTML i llavors només em vaig sentir estúpida per un llarg temps. 437 00:18:23,990 --> 00:18:27,470 Vegi com es selecciona als dos els que tenen aquesta classe? 438 00:18:27,470 --> 00:18:28,210 Fresc. 439 00:18:28,210 --> 00:18:29,950 >> Ara, les coses poden tenir diverses classes. 440 00:18:29,950 --> 00:18:32,790 Diguem que jo volia fer la primera 2 tenen un fons de color groc 441 00:18:32,790 --> 00:18:36,770 i el segon dos tenen un color de font de color blau. 442 00:18:36,770 --> 00:18:37,270 D'acord. 443 00:18:37,270 --> 00:18:39,735 Jo realment no sé per què jo havia vull fer això, però no puc. 444 00:18:39,735 --> 00:18:42,401 >> ALLISON Buchholtz-AU: No podria recomanat per al seu lloc web. 445 00:18:42,401 --> 00:18:43,880 Però per als nostres propòsits, que va a fer. 446 00:18:43,880 --> 00:18:46,294 >> TOMAS Reimers: No és una bona combinació de colors. 447 00:18:46,294 --> 00:18:49,210 ALLISON Buchholtz-AU: Bé, groc i blau són els meus colors de l'escola secundària. 448 00:18:49,210 --> 00:18:50,947 No sé, però. 449 00:18:50,947 --> 00:18:53,530 TOMAS Reimers: Allison d'alta escola tenia una gran combinació de colors. 450 00:18:53,530 --> 00:18:54,520 [Rialles] 451 00:18:54,520 --> 00:18:59,120 Així que el que podem anomenar a això és Cridem a esto-- així que tenim especial 452 00:18:59,120 --> 00:19:00,030 i tenim Pretty. 453 00:19:00,030 --> 00:19:02,405 Suggereixo, per això, s'utilitza noms molt més descriptius. 454 00:19:02,405 --> 00:19:05,820 ALLISON Buchholtz-AU: Sí, ho faria cridar a això, com, groc o blau. 455 00:19:05,820 --> 00:19:08,314 >> TOMAS Reimers: No som realment fer un lloc web de béns, 456 00:19:08,314 --> 00:19:09,730 és per això que no estem fent això. 457 00:19:09,730 --> 00:19:11,521 Però si realment tenia un lloc web real, 458 00:19:11,521 --> 00:19:16,220 podria tenir, com, capçalera de l'article, el contingut de l'article, la primera paraula, 459 00:19:16,220 --> 00:19:21,920 coses així, que permeten que siguis molt més descriptiu. 460 00:19:21,920 --> 00:19:23,550 Aquests són realment com a variables. 461 00:19:23,550 --> 00:19:28,390 Ells han de ser nomenats d'una manera on vostè pot, com-- sí, com a tal. 462 00:19:28,390 --> 00:19:29,470 Perfecte. 463 00:19:29,470 --> 00:19:30,480 >> Així color de fons. 464 00:19:30,480 --> 00:19:35,920 I després anem a dir-- pel que el manera de canviar el color és només "color". 465 00:19:35,920 --> 00:19:38,412 I farem que sigui blau. 466 00:19:38,412 --> 00:19:40,150 Això és genial. 467 00:19:40,150 --> 00:19:42,640 Així que ara tenim la dos primers tenen especial. 468 00:19:42,640 --> 00:19:45,972 Següent un va a tenir "class = bonica." 469 00:19:45,972 --> 00:19:49,180 ALLISON Buchholtz-AU: I llavors vostè desitjar afegir "bastant" a la del mig. 470 00:19:49,180 --> 00:19:49,971 TOMAS Reimers: Així és. 471 00:19:49,971 --> 00:19:52,970 I després a la del mig, afegir "bonic", el que passa 472 00:19:52,970 --> 00:19:56,880 és només tens un espai. 473 00:19:56,880 --> 00:19:59,800 Així que l'atribut de classe és una llista separada per espais 474 00:19:59,800 --> 00:20:02,450 de totes les classes que s'apliquen a aquesta etiqueta. 475 00:20:02,450 --> 00:20:02,959 D'acord? 476 00:20:02,959 --> 00:20:05,750 No és com aquest pertany algun tipus de classe especial anomenada 477 00:20:05,750 --> 00:20:07,180 "Especial, espai, bastant." 478 00:20:07,180 --> 00:20:10,870 Pertany a dos classes-- especial i bonica. 479 00:20:10,870 --> 00:20:12,492 Sí? 480 00:20:12,492 --> 00:20:14,360 Fresc. 481 00:20:14,360 --> 00:20:17,010 >> I després, si ens fixem en el que passi, estem 482 00:20:17,010 --> 00:20:21,850 veurem que primer té fons groc, text negre. 483 00:20:21,850 --> 00:20:22,450 Segon un-- 484 00:20:22,450 --> 00:20:26,160 >> ALLISON Buchholtz-AU: --Has negreta fons groc amb el text blau. 485 00:20:26,160 --> 00:20:29,330 I el nostre últim només té la text blau que hem assignat a la mateixa. 486 00:20:29,330 --> 00:20:30,870 >> TOMAS Reimers: Cool? 487 00:20:30,870 --> 00:20:32,491 Com funcionen els selectors? 488 00:20:32,491 --> 00:20:32,990 Impressionant. 489 00:20:32,990 --> 00:20:34,720 >> ALLISON Buchholtz-AU: Volem parlar sobre el conflicte ara, doncs? 490 00:20:34,720 --> 00:20:35,780 >> TOMAS Reimers: Així que si. 491 00:20:35,780 --> 00:20:36,310 Absolutament. 492 00:20:36,310 --> 00:20:38,380 Llavors, què passa si vostè tenir un conflicte, no? 493 00:20:38,380 --> 00:20:44,740 Anem a suposar la primera estableix una mica com-- 494 00:20:44,740 --> 00:20:47,240 ALLISON Buchholtz-AU: Potser aquest canvia el fons? 495 00:20:47,240 --> 00:20:48,090 TOMAS Reimers: Sí. 496 00:20:48,090 --> 00:20:51,699 Així que farem "bonica" canviar el fons a salmó. 497 00:20:51,699 --> 00:20:54,740 ALLISON Buchholtz-AU: Estàs a amb tots els grans colors d'avui, Tomas. 498 00:20:54,740 --> 00:20:55,573 TOMAS Reimers: Sí. 499 00:20:55,573 --> 00:20:58,200 Perquè em vaig assabentar del que pugui utilitzar el salmó com un color real. 500 00:20:58,200 --> 00:21:00,270 Així que només farem això. 501 00:21:00,270 --> 00:21:01,770 També crec que la posta de sol és un color real. 502 00:21:01,770 --> 00:21:03,103 AUDIÈNCIA: Posta del sol és un color real? 503 00:21:03,103 --> 00:21:04,572 ALLISON Buchholtz-AU: Anem a intentar-ho. 504 00:21:04,572 --> 00:21:07,735 TOMAS Reimers: Després d'aquesta demostració només perquè en cas que fiqui la pota, 505 00:21:07,735 --> 00:21:08,943 Jo no vull ser la depuració. 506 00:21:08,943 --> 00:21:11,580 Així que sabem que el salmó és un color real. 507 00:21:11,580 --> 00:21:15,626 Pel que qualsevol conjectures sobre el que passarà? 508 00:21:15,626 --> 00:21:17,522 >> ALLISON Buchholtz-AU: Alguna idea? 509 00:21:17,522 --> 00:21:20,002 >> AUDIÈNCIA: [inaudible]. 510 00:21:20,002 --> 00:21:20,920 >> TOMAS Reimers: Sí. 511 00:21:20,920 --> 00:21:22,150 Així que el tens tota la raó. 512 00:21:22,150 --> 00:21:24,930 Bàsicament, es necessita la última regla que se li va donar. 513 00:21:24,930 --> 00:21:27,860 >> ALLISON Buchholtz-AU: Així que això és on en cascada entri en vigor. 514 00:21:27,860 --> 00:21:31,080 >> TOMAS Reimers: Així que recordi com havia de fulls d'estil en cascada? 515 00:21:31,080 --> 00:21:33,660 Així que per això, ens referim tipus de que tenim un munt de regles 516 00:21:33,660 --> 00:21:37,115 que s'apliquen a la part superior de l'altra, i també poden anul·lar entre si. 517 00:21:37,115 --> 00:21:39,380 >> ALLISON Buchholtz-AU: Així el d'en la part inferior 518 00:21:39,380 --> 00:21:41,540 anul·larà tot el que està en la part superior. 519 00:21:41,540 --> 00:21:45,842 Vostè podria tenir regles que completament negar una mica per endavant. 520 00:21:45,842 --> 00:21:48,300 Per això també vols ser compte quan estàs estil, 521 00:21:48,300 --> 00:21:51,465 pel que no crearà regles que estàs completament imperioses. 522 00:21:51,465 --> 00:21:53,340 >> TOMAS Reimers: O potser vostè no desitja sobreescriure regles. 523 00:21:53,340 --> 00:21:53,920 >> ALLISON Buchholtz-AU: O potser vostè ho fa. 524 00:21:53,920 --> 00:21:54,300 Sí. 525 00:21:54,300 --> 00:21:57,175 >> TOMAS Reimers: Imagina que tens un classe que s'aplica a la majoria de les coses, 526 00:21:57,175 --> 00:22:01,220 però diguem que vostè vol canviar la color de fons a vermell i el tipus de lletra 527 00:22:01,220 --> 00:22:03,140 pes en negreta per a la majoria coses, però per la meva part, 528 00:22:03,140 --> 00:22:06,098 només desitja que el color de fons a ser de color vermell, però que desitja dels altres 529 00:22:06,098 --> 00:22:09,990 propietats, que podrien fer alguna cosa com "font-weight = normal" 530 00:22:09,990 --> 00:22:12,760 que després desfer aquest canvi audaç. 531 00:22:12,760 --> 00:22:14,480 Sí? 532 00:22:14,480 --> 00:22:17,250 Una vegada més, la millor manera, crec que Allison va dir que, és només la pràctica. 533 00:22:17,250 --> 00:22:18,080 >> ALLISON Buchholtz-AU: Experimentació. 534 00:22:18,080 --> 00:22:20,090 >> TOMAS Reimers: Pràctica, pràctica, pràctica, i l'experiment. 535 00:22:20,090 --> 00:22:22,950 Conec un munt de gent que pensa CSS és només un munt de conjectures i verificació 536 00:22:22,950 --> 00:22:25,580 al final del dia, on si que vols fer alguna cosa-- com, 537 00:22:25,580 --> 00:22:27,663 vostè té una idea aproximada, però vostè encara necessita probablement 538 00:22:27,663 --> 00:22:31,390 provar per assegurar- vostè sap el que sembla. 539 00:22:31,390 --> 00:22:34,482 >> AUDIÈNCIA: Quan vostè està demanant classes, més d'una 540 00:22:34,482 --> 00:22:37,339 al mateix paràgraf o de la secció, oi 541 00:22:37,339 --> 00:22:39,505 importa quin ordre es pot Escrigui a les cotitzacions? 542 00:22:39,505 --> 00:22:40,992 >> TOMAS Reimers: No, no en absolut. 543 00:22:40,992 --> 00:22:45,764 >> ALLISON Buchholtz-AU: El que importa és l'ordre dins del full d'estils CSS. 544 00:22:45,764 --> 00:22:47,430 AUDIÈNCIA: Podria repetir la pregunta? 545 00:22:47,430 --> 00:22:50,680 TOMAS Reimers: Oh. 546 00:22:50,680 --> 00:22:53,990 ALLISON Buchholtz-AU: Dins classe, quan s'està fent classes 547 00:22:53,990 --> 00:22:56,964 a alguna cosa en l'HTML, fa Importa quin ordre estan en? 548 00:22:56,964 --> 00:22:58,130 No importa l'ordre. 549 00:22:58,130 --> 00:23:02,915 El que importa és l'ordre de la selectors de classe dins de la seva CSS, 550 00:23:02,915 --> 00:23:04,306 dins del seu full d'estils. 551 00:23:04,306 --> 00:23:06,982 >> TOMAS Reimers: Sona bé? 552 00:23:06,982 --> 00:23:08,532 >> ALLISON Buchholtz-AU: Lovely. 553 00:23:08,532 --> 00:23:11,539 >> TOMAS Reimers: I llavors continuarem A-- 554 00:23:11,539 --> 00:23:13,330 ALLISON Buchholtz-AU: Què tenim ara? 555 00:23:13,330 --> 00:23:14,245 Em oblit. 556 00:23:14,245 --> 00:23:16,087 Oh, només tenim exemples. 557 00:23:16,087 --> 00:23:17,295 Però hem tipus de fet aquests. 558 00:23:17,295 --> 00:23:18,990 Hem fet exemples sobre la marxa. 559 00:23:18,990 --> 00:23:20,540 >> TOMAS Reimers: Arribem a combinar els selectors aviat. 560 00:23:20,540 --> 00:23:22,790 >> ALLISON Buchholtz-AU: Oh, aconseguim combinar selectors. 561 00:23:22,790 --> 00:23:25,260 TOMAS Reimers: Així que alguns exemples és que tenim 562 00:23:25,260 --> 00:23:29,630 # Lliura dog-- o hashtag, o octothorpe, o el que sigui 563 00:23:29,630 --> 00:23:32,050 qual voleu trucar que-- agut. 564 00:23:32,050 --> 00:23:34,875 >> ALLISON Buchholtz-AU: Gos de Sharp. 565 00:23:34,875 --> 00:23:36,470 >> TOMAS Reimers: Llavors vostè té .pets. 566 00:23:36,470 --> 00:23:39,059 567 00:23:39,059 --> 00:23:41,600 Alguna cosa té un id de gos, només hi ha un gos a la pàgina. 568 00:23:41,600 --> 00:23:43,870 Alguna cosa té un id de gat, només hi ha un gat. 569 00:23:43,870 --> 00:23:45,665 Hi pot haver molts animals domèstics a la pàgina. 570 00:23:45,665 --> 00:23:47,570 És per això que hem atès que les classes. 571 00:23:47,570 --> 00:23:48,740 Vostè té un exemple de p. 572 00:23:48,740 --> 00:23:50,490 I llavors el que un dels últim exemple, que 573 00:23:50,490 --> 00:23:53,790 és una cosa que no hem parlat, és el que passa quan es combinen. 574 00:23:53,790 --> 00:23:54,580 Així p.pets. 575 00:23:54,580 --> 00:23:57,510 576 00:23:57,510 --> 00:24:02,950 >> Així que per això, anem a tornar a la codi i introduir another-- si. 577 00:24:02,950 --> 00:24:04,290 Així que de tornada aquí. 578 00:24:04,290 --> 00:24:04,850 >> ALLISON Buchholtz-AU: I sentir que això és realmente-- 579 00:24:04,850 --> 00:24:08,105 com mirant a través d'exemples és realment la manera d'aprendre això. 580 00:24:08,105 --> 00:24:09,360 Així que això és el que estem fent. 581 00:24:09,360 --> 00:24:14,030 >> TOMAS Reimers: Així que anem a pretendre que només voleu seleccionar text 2, oi? 582 00:24:14,030 --> 00:24:16,530 Així que definitivament no pot fer això amb un id. 583 00:24:16,530 --> 00:24:19,620 Bé, podríem fer això amb un id, però no té un id. 584 00:24:19,620 --> 00:24:22,490 Podria afegir-ne un, però anem a suposar que jo no vull afegir-ne un 585 00:24:22,490 --> 00:24:24,910 o que ja té una mica més. 586 00:24:24,910 --> 00:24:26,516 Jo no puc fer això amb això. 587 00:24:26,516 --> 00:24:28,870 La variable no és definitivament únic, no? 588 00:24:28,870 --> 00:24:30,670 I tampoc ho és la classe. 589 00:24:30,670 --> 00:24:32,314 Però vostè pot combinar aquestes coses. 590 00:24:32,314 --> 00:24:35,230 Diguem que volíem fer alguna cosa que només s'aplica a les coses que 591 00:24:35,230 --> 00:24:39,420 tenir la classe especial i que tenen la classe bonica. 592 00:24:39,420 --> 00:24:48,150 >> Així que el que pot fer és a main.css, es pot dir, primer anem a eliminar això. 593 00:24:48,150 --> 00:24:50,240 Pot combinar aquests. 594 00:24:50,240 --> 00:24:51,430 Així que vostè pot fer .Special. 595 00:24:51,430 --> 00:24:52,110 No hi ha espai. 596 00:24:52,110 --> 00:24:54,770 Només .special.pretty. 597 00:24:54,770 --> 00:25:00,550 El que això significa és una cosa que és tant especial i bonica. 598 00:25:00,550 --> 00:25:01,900 Té això sentit? 599 00:25:01,900 --> 00:25:04,190 I si anem aquí, el que vas a veure 600 00:25:04,190 --> 00:25:09,734 és aquesta regla només s'aplica a la segon, que té tant d'ells. 601 00:25:09,734 --> 00:25:11,400 I vostè pot fer això per un munt de coses. 602 00:25:11,400 --> 00:25:13,270 Pot dir-- anem pretenc jo només volia 603 00:25:13,270 --> 00:25:18,300 per fer coses que tenen la classe bastant i que són també una etiqueta de paràgraf. 604 00:25:18,300 --> 00:25:19,920 Així p.pretty. 605 00:25:19,920 --> 00:25:23,585 Anem a pretendre que jo tenia una cosa bonica en el cos de l'etiqueta. 606 00:25:23,585 --> 00:25:25,850 D'acord? 607 00:25:25,850 --> 00:25:28,490 Puc executar aquest i jo pot veure que és només 608 00:25:28,490 --> 00:25:32,720 va a aplicar a les coses que són paràgrafs amb la classe bastant. 609 00:25:32,720 --> 00:25:35,650 I pot combinar aquests, bàsicament, com totes les que vulguis. 610 00:25:35,650 --> 00:25:38,580 Així que vostè pot posar-los junts. 611 00:25:38,580 --> 00:25:39,604 Té això sentit? 612 00:25:39,604 --> 00:25:41,770 ALLISON Buchholtz-AU: Així aquest tipus de és més útil 613 00:25:41,770 --> 00:25:45,490 quan, Tomas estava dient abans, potser vostè té un lloc web molt complicat, 614 00:25:45,490 --> 00:25:48,050 i ja té molt d'aquestes normes escrites, 615 00:25:48,050 --> 00:25:51,170 i només ha de combinar dues de davant. 616 00:25:51,170 --> 00:25:55,350 Igual que en lloc d'escriure en el seu conjunt nou selector i canviar allà, 617 00:25:55,350 --> 00:25:58,592 vostè pot combinar ells on se superposen. 618 00:25:58,592 --> 00:26:00,670 >> TOMAS Reimers: O podrien trobar fora-- vegades 619 00:26:00,670 --> 00:26:04,290 hi ha una classe que fa que el color de la font, com el blau, 620 00:26:04,290 --> 00:26:06,740 i hi ha una altra classe que fa que el blau de fons. 621 00:26:06,740 --> 00:26:07,840 I això simplement no funcionarà. 622 00:26:07,840 --> 00:26:10,924 Així s'escriu un cas especial, on, com-- però si té dos, el que estàs 623 00:26:10,924 --> 00:26:13,548 farem és que anem a fer d'aquest un aquest to de blau 624 00:26:13,548 --> 00:26:15,310 i aquesta aquest altre to de blau. 625 00:26:15,310 --> 00:26:15,580 Dret? 626 00:26:15,580 --> 00:26:17,955 >> ALLISON Buchholtz-AU: Bé per a aquest tipus d'excepcions. 627 00:26:17,955 --> 00:26:21,220 TOMAS Reimers: Així que per pensar en problemes 628 00:26:21,220 --> 00:26:25,000 que poden sorgir quan es combinen. 629 00:26:25,000 --> 00:26:27,020 Fresc. 630 00:26:27,020 --> 00:26:29,692 Així que de tornada a la nostra presentació. 631 00:26:29,692 --> 00:26:31,400 ALLISON Buchholtz-AU: Ja gairebé hem arribat. 632 00:26:31,400 --> 00:26:34,022 TOMAS Reimers: I ha deixat de connexió. 633 00:26:34,022 --> 00:26:36,494 ALLISON Buchholtz-AU: Oh, no. 634 00:26:36,494 --> 00:26:39,125 ALLISON Buchholtz-AU: CS en l'oficina, internet es cau. 635 00:26:39,125 --> 00:26:40,360 Oh, la ironia. 636 00:26:40,360 --> 00:26:45,620 >> TOMAS Reimers: Així que, afortunadament, podem present sense internet, suposo, 637 00:26:45,620 --> 00:26:47,380 perquè tenim totes les diapositives aquí. 638 00:26:47,380 --> 00:26:49,304 Així que anem a parlar de la relació de les etiquetes. 639 00:26:49,304 --> 00:26:50,470 ALLISON Buchholtz-AU: Correcte. 640 00:26:50,470 --> 00:26:52,660 Així que només una mica d'anar fora del que va dir Tomàs, 641 00:26:52,660 --> 00:26:54,180 això és només una altra manera de fer-ho. 642 00:26:54,180 --> 00:26:57,840 Així que tenim alguns dels pares selector amb un selector de nen. 643 00:26:57,840 --> 00:27:02,815 Així que en aquest exemple aquí, tenim alguns cos amb una barra de navegació de classe, de botons. 644 00:27:02,815 --> 00:27:03,315 Ah. 645 00:27:03,315 --> 00:27:03,990 >> TOMAS Reimers: Oh, ho sento. 646 00:27:03,990 --> 00:27:06,180 >> ALLISON Buchholtz-AU: I Bàsicament, el que això significa 647 00:27:06,180 --> 00:27:11,070 és seleccionar tots els nens, igual que tots aquests tipus de selectors, 648 00:27:11,070 --> 00:27:13,040 dins d'aquest selector de matriu. 649 00:27:13,040 --> 00:27:16,004 I aquests són els únics el que mai va a aplicar. 650 00:27:16,004 --> 00:27:17,755 No sé si vostè tenir una millor manera de-- 651 00:27:17,755 --> 00:27:19,504 TOMAS Reimers: Així que endevinar la forma de pensar 652 00:27:19,504 --> 00:27:22,440 d'això és recordar abans com quin tipus d'ells com armem. 653 00:27:22,440 --> 00:27:26,340 I llavors això vol dir que un dels elements que coincideix amb tots ells. 654 00:27:26,340 --> 00:27:29,530 El que això vol dir és, jo desitja fer coincidir tot 655 00:27:29,530 --> 00:27:33,220 dins some-- Vull a trobar un selector. 656 00:27:33,220 --> 00:27:35,670 I després dins d'això, vull es pot adaptar amb coses noves. 657 00:27:35,670 --> 00:27:36,170 Dret? 658 00:27:36,170 --> 00:27:40,900 Així que en CSS, tot es tracta d'una mena de ser capaç d'igualar aquests articles. 659 00:27:40,900 --> 00:27:43,050 I vostè pot tractar d'igualar elements dins d'altres articles. 660 00:27:43,050 --> 00:27:46,510 >> Així que anem a fer realitat un exemple, i creiem que va a aclarir. 661 00:27:46,510 --> 00:27:53,090 Així que anem a pretendre que tenim especial, especial bonica, el que sigui. 662 00:27:53,090 --> 00:27:55,690 I després tenim un vincle, d'acord? 663 00:27:55,690 --> 00:27:59,780 664 00:27:59,780 --> 00:28:02,370 Així que recorda, a és un enllaç. 665 00:28:02,370 --> 00:28:03,900 No va a anar enlloc. 666 00:28:03,900 --> 00:28:11,500 I anem a donar-li l'enllaç de classe, suposo. 667 00:28:11,500 --> 00:28:13,335 Anem a donar-li la class-- donar-me una idea. 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- anem anar per la classe bonica. 670 00:28:16,420 --> 00:28:16,930 Per què no? 671 00:28:16,930 --> 00:28:17,971 >> ALLISON Buchholtz-AU: OK. 672 00:28:17,971 --> 00:28:23,040 TOMAS Reimers: Així coses ara boniques 673 00:28:23,040 --> 00:28:26,000 faran el fons blau, color de fons de salmó. 674 00:28:26,000 --> 00:28:27,969 Això té sentit. 675 00:28:27,969 --> 00:28:28,760 I si ho fem esto-- 676 00:28:28,760 --> 00:28:29,620 >> ALLISON Buchholtz-AU: Vols afegir text 677 00:28:29,620 --> 00:28:31,078 per la qual cosa l'hipervincle en realitat apareix? 678 00:28:31,078 --> 00:28:35,088 TOMAS Reimers: Això seria una bona decisió. 679 00:28:35,088 --> 00:28:37,921 ALLISON Buchholtz-AU: Perquè dreta ara només aconseguirem res. 680 00:28:37,921 --> 00:28:39,690 TOMAS Reimers: Així que això és un enllaç. 681 00:28:39,690 --> 00:28:42,202 "Aquest és un enllaç." 682 00:28:42,202 --> 00:28:45,820 Ah, i això va ser un altre enllaç. 683 00:28:45,820 --> 00:28:47,280 Anem a donar-li la classe "cool". 684 00:28:47,280 --> 00:28:50,295 Tens raó. 685 00:28:50,295 --> 00:28:50,795 Fresc. 686 00:28:50,795 --> 00:28:53,590 687 00:28:53,590 --> 00:28:56,010 Així que ara anem a prendre això. 688 00:28:56,010 --> 00:28:57,269 Anem a llançar un. 689 00:28:57,269 --> 00:28:59,060 Tenim un al etiqueta especial, i també 690 00:28:59,060 --> 00:29:01,150 tindran un a la bonica etiqueta. 691 00:29:01,150 --> 00:29:05,449 I ara el que anem a fer és que farem cool-- 692 00:29:05,449 --> 00:29:06,490 Què volem que faci? 693 00:29:06,490 --> 00:29:10,347 694 00:29:10,347 --> 00:29:12,180 ALLISON Buchholtz-AU: Podem fer-lo més gran? 695 00:29:12,180 --> 00:29:13,800 TOMAS Reimers: Anem a donar-li una frontera. 696 00:29:13,800 --> 00:29:14,840 ALLISON Buchholtz-AU: Podríem frontera. 697 00:29:14,840 --> 00:29:15,673 TOMAS Reimers: Sí. 698 00:29:15,673 --> 00:29:18,560 Així que anem a fer alguna cosa com, és-- frontera i estem 699 00:29:18,560 --> 00:29:20,971 va a explicar tot això en un segon. 700 00:29:20,971 --> 00:29:21,470 Per ara-- 701 00:29:21,470 --> 00:29:24,592 >> ALLISON Buchholtz-AU: Per al model de caixa. 702 00:29:24,592 --> 00:29:27,300 TOMAS Reimers: Però per ara, estem només va a donar-li una frontera. 703 00:29:27,300 --> 00:29:29,580 Així que el que això significa és que ets veuran aquests enllaços. 704 00:29:29,580 --> 00:29:32,788 I veuràs que tenen aquests, com, vores negres lletjos, que 705 00:29:32,788 --> 00:29:33,820 és fresc. 706 00:29:33,820 --> 00:29:34,500 >> ALLISON Buchholtz-AU: El nostre lloc web és tan bonica. 707 00:29:34,500 --> 00:29:35,333 >> TOMAS Reimers: Sí. 708 00:29:35,333 --> 00:29:38,930 El nostre lloc web és impressionant. 709 00:29:38,930 --> 00:29:41,585 Així que aquests dos són enllaços, i ells apareixen. 710 00:29:41,585 --> 00:29:44,160 Ara anem a pretendre que només volia fer això 711 00:29:44,160 --> 00:29:50,072 si no fos dins d'alguna cosa que tenia un fons de salmó. 712 00:29:50,072 --> 00:29:52,280 Així que recordi que aquest té un fons de salmó, 713 00:29:52,280 --> 00:29:54,000 perquè és de classe bastant. 714 00:29:54,000 --> 00:29:59,777 >> Però volem dir que només es refreda que són a classe especial, no a classe 715 00:29:59,777 --> 00:30:02,890 bastant, ha de tenir aquesta frontera. 716 00:30:02,890 --> 00:30:12,549 Bé, el que pot fer vostè és pot dir, .Special, espai, .cool. 717 00:30:12,549 --> 00:30:15,590 I el que està fent, quan es pensa al respecte, és que està dient bàsicament, 718 00:30:15,590 --> 00:30:19,530 Bé, em trobarà tot que coincideix especial. 719 00:30:19,530 --> 00:30:24,104 Després, dins d'aquestes etiquetes, trobar mi tot això està bé. 720 00:30:24,104 --> 00:30:27,270 ALLISON Buchholtz-AU: Així que d'una altra manera que podria ser bo per pensar en això, 721 00:30:27,270 --> 00:30:29,810 portar de tornada a C, és igual que la idea del seu abast. 722 00:30:29,810 --> 00:30:34,020 Així que quan vostè té alguna selector, com els que es 723 00:30:34,020 --> 00:30:38,460 que hem estat treballant per abans d'això, la seva pàgina web completa, tots els de la seva HTML 724 00:30:38,460 --> 00:30:40,180 està dins del seu abast, no? 725 00:30:40,180 --> 00:30:43,090 Però quan tenim aquests les relacions entre pares i fills, 726 00:30:43,090 --> 00:30:47,130 és com si vostè està estrenyiment on el que busca és un lloc específic, 727 00:30:47,130 --> 00:30:50,540 com si, igual que, estem buscant dins una funció específica en comptes 728 00:30:50,540 --> 00:30:52,007 de tot el nostre arxiu. 729 00:30:52,007 --> 00:30:55,090 AUDIÈNCIA: Així que amb això en ment, ho faria que hagués importat si tinguéssim transformats, 730 00:30:55,090 --> 00:30:56,423 ALLISON Buchholtz-AU: L'ordre? 731 00:30:56,423 --> 00:30:59,320 AUDIÈNCIA: --la classe en CSS a .cool, espai, .Special? 732 00:30:59,320 --> 00:31:01,153 ALLISON Buchholtz-AU: Sí, perquè llavors això 733 00:31:01,153 --> 00:31:04,420 diria, abast a tot el que té fresc, 734 00:31:04,420 --> 00:31:07,235 i després mirar el has-- Vull dir, com, en aquest cas, 735 00:31:07,235 --> 00:31:08,860 Jo no crec que hagués canviat. 736 00:31:08,860 --> 00:31:10,318 >> TOMAS Reimers: Si ens havia dit què? 737 00:31:10,318 --> 00:31:10,906 Ho sento. 738 00:31:10,906 --> 00:31:12,660 >> ALLISON Buchholtz-AU: Si abast que es refredi i després 739 00:31:12,660 --> 00:31:14,550 buscar coses d'especial, seria el mateix, en realitat. 740 00:31:14,550 --> 00:31:16,260 >> TOMAS Reimers: Així que no seria. 741 00:31:16,260 --> 00:31:16,590 >> ALLISON Buchholtz-AU: No ho faria? 742 00:31:16,590 --> 00:31:17,590 Oh, oh bé. 743 00:31:17,590 --> 00:31:18,090 Estic equivocat. 744 00:31:18,090 --> 00:31:21,480 >> TOMAS Reimers: Així que la raó és diferent-- mistake-- comú 745 00:31:21,480 --> 00:31:27,140 és que en aquest moment només l'enllaç té fred, oi? 746 00:31:27,140 --> 00:31:32,176 Crec que la meva pregunta per a vostès és, el que en aquesta pàgina es correspon amb .cool? 747 00:31:32,176 --> 00:31:35,984 748 00:31:35,984 --> 00:31:38,340 Hi ha dues etiquetes aquí, oi? 749 00:31:38,340 --> 00:31:39,770 Quin és aquest i aquest. 750 00:31:39,770 --> 00:31:40,590 Tots dos coincideixen fresc. 751 00:31:40,590 --> 00:31:42,200 Només ho fa. 752 00:31:42,200 --> 00:31:46,460 Així que si vostè ha dit, .cool, espai, .Special, El que vas a dir és, 753 00:31:46,460 --> 00:31:48,824 dins d'aquestes etiquetes, què té d'especial? 754 00:31:48,824 --> 00:31:49,865 ALLISON Buchholtz-AU: Hm. 755 00:31:49,865 --> 00:31:51,800 Això és el que it-- dreta. 756 00:31:51,800 --> 00:31:52,310 Perquè és com alguna cosa aquí. 757 00:31:52,310 --> 00:31:53,310 >> TOMAS Reimers: Així que selecciona res. 758 00:31:53,310 --> 00:31:56,530 >> ALLISON Buchholtz-AU: Mentre que amb especial, estem dins d'aquestes etiquetes aquí. 759 00:31:56,530 --> 00:31:57,971 >> TOMAS Reimers: Aquells i aquelles. 760 00:31:57,971 --> 00:31:58,512 AUDIÈNCIA: OK. 761 00:31:58,512 --> 00:31:58,920 Així que aquestes etiquetes de la barra diagonal? 762 00:31:58,920 --> 00:31:59,740 >> TOMAS Reimers: Sí. 763 00:31:59,740 --> 00:32:01,150 Té això sentit? 764 00:32:01,150 --> 00:32:03,685 Com és, bàsicament, tractant de reduir el seu abast. 765 00:32:03,685 --> 00:32:04,810 ALLISON Buchholtz-AU: Sí. 766 00:32:04,810 --> 00:32:06,870 Crec que això és probablement la manera més fàcil de pensar-hi. 767 00:32:06,870 --> 00:32:09,270 >> TOMAS Reimers: Així que ens va semblar, i trobem aquest tant va igualar especial. 768 00:32:09,270 --> 00:32:11,400 I llavors el que estem demanant, dins aquests nois, el que és genial? 769 00:32:11,400 --> 00:32:12,941 I dins d'aquesta, fresc d'aquest. 770 00:32:12,941 --> 00:32:14,500 Dins d'aquest, res està bé. 771 00:32:14,500 --> 00:32:16,250 Així que aquesta és l'única etiqueta que queda. 772 00:32:16,250 --> 00:32:20,112 >> ALLISON Buchholtz-AU: Considerant fresc és només dins d'aquestes etiquetes a allà. 773 00:32:20,112 --> 00:32:21,070 TOMAS Reimers: Exactament. 774 00:32:21,070 --> 00:32:22,403 I el que és especial dins d'aquests? 775 00:32:22,403 --> 00:32:22,930 Res. 776 00:32:22,930 --> 00:32:25,270 Ara, què vaig a dir és si no hi havia espai, 777 00:32:25,270 --> 00:32:29,880 vostè està demanant el que és fresc i especial-- o el que és bonic i especial, oi? 778 00:32:29,880 --> 00:32:35,370 Si dius .special.pretty, això és el mateix que .pretty.special. 779 00:32:35,370 --> 00:32:39,220 >> Perquè el que l'eliminació de l'espai és demanant és, quan vostè diu .Special, 780 00:32:39,220 --> 00:32:40,970 vostè està demanant, OK, quines són especials? 781 00:32:40,970 --> 00:32:43,780 I després, pels quals estimats també són bastant, 782 00:32:43,780 --> 00:32:47,010 que és el mateix, gramaticalment, com preguntar, quin és bonica, 783 00:32:47,010 --> 00:32:49,500 i després d'ells, el que també és especial? 784 00:32:49,500 --> 00:32:50,000 Dret? 785 00:32:50,000 --> 00:32:53,099 És la diferència de el que hi ha dins del que és. 786 00:32:53,099 --> 00:32:53,640 AUDIÈNCIA: OK. 787 00:32:53,640 --> 00:32:54,473 TOMAS Reimers: Sí. 788 00:32:54,473 --> 00:32:56,670 789 00:32:56,670 --> 00:32:58,030 Impressionant. 790 00:32:58,030 --> 00:33:00,426 Així que amb això en ment llavors-- 791 00:33:00,426 --> 00:33:01,800 >> ALLISON Buchholtz-UA: Crec que el nostre últim cosa és (en Fantasia BRITISH ACCENT) 792 00:33:01,800 --> 00:33:02,510 el model de caixa. 793 00:33:02,510 --> 00:33:05,992 >> TOMAS Reimers: El box-- [Chuckles] M'encanta la forma Allison diu això. 794 00:33:05,992 --> 00:33:06,950 Així que la cosa model de caixa. 795 00:33:06,950 --> 00:33:09,644 >> ALLISON Buchholtz-AU: Només tenen una caixa, seré el seu model de caixa. 796 00:33:09,644 --> 00:33:11,310 TOMAS Reimers: Així que anem a parlar d'això. 797 00:33:11,310 --> 00:33:14,070 Així que ara que hem passat molt temps parlant de selectors. 798 00:33:14,070 --> 00:33:16,944 Per ara, vostès són probablement, com, mestres de selectors-- saps, 799 00:33:16,944 --> 00:33:21,510 com seleccionar exactament el contingut que que desitja manipular a la pantalla. 800 00:33:21,510 --> 00:33:24,740 >> Així que ara la pregunta és, com exactament es pot manipular? 801 00:33:24,740 --> 00:33:27,010 Així que suposo que el més bàsic manera de pensar en això 802 00:33:27,010 --> 00:33:30,294 és, bé, què és exactament és un element de CSS? 803 00:33:30,294 --> 00:33:32,585 Hem passat molt de temps parlant, el que és una etiqueta, 804 00:33:32,585 --> 00:33:36,140 o el que és el més bàsic representació d'una etiqueta? 805 00:33:36,140 --> 00:33:39,870 806 00:33:39,870 --> 00:33:45,170 >> Una bona manera de pensar és a dir, quina forma és el salmó? 807 00:33:45,170 --> 00:33:47,295 Quina forma té, com, el salmó de color de fons? 808 00:33:47,295 --> 00:33:47,880 >> AUDIÈNCIA: És un rectangle. 809 00:33:47,880 --> 00:33:49,040 >> TOMAS Reimers: És un rectangle, oi? 810 00:33:49,040 --> 00:33:50,956 >> ALLISON Buchholtz-AU: No era una pregunta capciosa. 811 00:33:50,956 --> 00:33:51,870 [Rialles] 812 00:33:51,870 --> 00:33:54,670 >> TOMAS Reimers: No intentar per enganyar a vostès aquesta tarda. 813 00:33:54,670 --> 00:33:57,510 Així que tenim aquest rectangle. 814 00:33:57,510 --> 00:33:59,140 I l'etiqueta és una p, oi? 815 00:33:59,140 --> 00:34:02,280 Així ens dóna bona creença que el paràgraf 816 00:34:02,280 --> 00:34:07,440 es representa com un rectangle, en menys en la ment del navegador, que 817 00:34:07,440 --> 00:34:08,715 que és. 818 00:34:08,715 --> 00:34:11,423 >> ALLISON Buchholtz-AU: Vull dir, navegadors són típicament rectangular, 819 00:34:11,423 --> 00:34:13,440 així que té sentit. 820 00:34:13,440 --> 00:34:18,750 >> TOMAS Reimers: La idea és que totes les etiquetes dins de CSS 821 00:34:18,750 --> 00:34:21,790 es representen com un rectangle. 822 00:34:21,790 --> 00:34:25,699 I cada rectangle té quatre parts d'acord al CSS, OK? 823 00:34:25,699 --> 00:34:27,830 Vostè té el contingut real. 824 00:34:27,830 --> 00:34:29,644 Aquí és on es troba el text. 825 00:34:29,644 --> 00:34:30,470 >> ALLISON Buchholtz-AU: Potser la seva imatge. 826 00:34:30,470 --> 00:34:31,303 >> TOMAS Reimers: Sí. 827 00:34:31,303 --> 00:34:33,860 Vostè ha farcit, que és només una espècie d'espai en blanc. 828 00:34:33,860 --> 00:34:35,085 Llavors vostè té una vora. 829 00:34:35,085 --> 00:34:37,710 I llavors vostè té marge, que és l'espai en blanc fora d'això. 830 00:34:37,710 --> 00:34:39,460 Així que no té sentit a qualsevol persona, pel que estem 831 00:34:39,460 --> 00:34:42,500 anem a parlar d'això per un segon. 832 00:34:42,500 --> 00:34:47,570 Així que aquí, el que farem Som nosaltres els anem a crear alguns divs, OK? 833 00:34:47,570 --> 00:34:48,420 Disculpame mentre jo-- 834 00:34:48,420 --> 00:34:51,506 >> ALLISON Buchholtz-AU: Em sento com hem de posar una foto bonica en. 835 00:34:51,506 --> 00:34:52,520 >> TOMAS Reimers: Definitivament hauria. 836 00:34:52,520 --> 00:34:53,389 >> ALLISON Buchholtz-AU: Sento que tot el món 837 00:34:53,389 --> 00:34:54,870 podrien beneficiar d'una bonica foto, és tot. 838 00:34:54,870 --> 00:34:56,774 >> TOMAS Reimers: Podem tots es beneficien de A-- 839 00:34:56,774 --> 00:34:57,648 >> AUDIÈNCIA: Sí, és clar. 840 00:34:57,648 --> 00:34:58,790 TOMAS Reimers: OK, fresc. 841 00:34:58,790 --> 00:35:02,254 Així que hem de posar un bonic imatge en algun lloc. 842 00:35:02,254 --> 00:35:05,295 ALLISON Buchholtz-AU: Em sento com un conillet valent podria ser útil en aquest moment. 843 00:35:05,295 --> 00:35:06,190 TOMAS Reimers: Segur. 844 00:35:06,190 --> 00:35:06,950 ALLISON Buchholtz-AU: Fi de la setmana. 845 00:35:06,950 --> 00:35:07,390 Si té alguna cosa adorab-- 846 00:35:07,390 --> 00:35:08,520 >> TOMAS Reimers: Com combat un gatet? 847 00:35:08,520 --> 00:35:09,220 >> ALLISON Buchholtz-AU: Un gatet funciona, també. 848 00:35:09,220 --> 00:35:11,300 >> TOMAS Reimers: Cool, perquè hi ha un lloc per això. 849 00:35:11,300 --> 00:35:12,300 Es diu PlaceKitten. 850 00:35:12,300 --> 00:35:14,719 ALLISON Buchholtz-AU: Això és genial. 851 00:35:14,719 --> 00:35:15,510 TOMAS Reimers: Sí. 852 00:35:15,510 --> 00:35:18,040 ALLISON Buchholtz-AU: Només per, com, imatges de marcador de posició al seu lloc web. 853 00:35:18,040 --> 00:35:18,914 TOMAS Reimers: Mm-hm. 854 00:35:18,914 --> 00:35:21,520 També hi ha PlacePuppy. 855 00:35:21,520 --> 00:35:22,832 I hi ha PlaceBacon. 856 00:35:22,832 --> 00:35:24,340 >> ALLISON Buchholtz-AU: PlaceBacon? 857 00:35:24,340 --> 00:35:25,350 ¿De debò? 858 00:35:25,350 --> 00:35:28,190 >> TOMAS Reimers: Oh, no ho fem tenir accés a internet. 859 00:35:28,190 --> 00:35:29,875 >> ALLISON Buchholtz-AU: [gemecs] 860 00:35:29,875 --> 00:35:30,375 Tràgica. 861 00:35:30,375 --> 00:35:32,333 TOMAS Reimers: Altrament, Jo t'havia de mostrar nois 862 00:35:32,333 --> 00:35:33,870 com posar imatges al seu lloc web. 863 00:35:33,870 --> 00:35:36,370 Anem a tractar d'aconseguir aquest treballar abans que hàgim d'anar. 864 00:35:36,370 --> 00:35:38,660 Però per ara, només estem va a parlar en colors llavors. 865 00:35:38,660 --> 00:35:39,820 Volem posar fotos de kittens-- 866 00:35:39,820 --> 00:35:40,210 >> ALLISON Buchholtz-AU: Ho vam fer. 867 00:35:40,210 --> 00:35:43,110 >> TOMAS Reimers: --el d'internet baix de moment ser. 868 00:35:43,110 --> 00:35:47,820 Així que tenim dos divs, i estem els va a donar dos identificadors. 869 00:35:47,820 --> 00:35:51,380 870 00:35:51,380 --> 00:35:56,760 Anem a dir- "Primera" i "segona". 871 00:35:56,760 --> 00:36:01,184 Així que id = "primer". 872 00:36:01,184 --> 00:36:02,850 I anem a donar-los dos colors. 873 00:36:02,850 --> 00:36:08,424 Llavors, com seleccionem alguna cosa amb un id de "primer"? 874 00:36:08,424 --> 00:36:09,840 ALLISON Buchholtz-AU: Dot o haixix? 875 00:36:09,840 --> 00:36:10,730 AUDIÈNCIA: Agut. 876 00:36:10,730 --> 00:36:12,940 TOMAS Reimers: Sharp, perfecte. 877 00:36:12,940 --> 00:36:14,950 Sharp, haixix, el nosaltres-- 878 00:36:14,950 --> 00:36:15,680 >> ALLISON Buchholtz-AU: Hi ha moltes coses que diuen. 879 00:36:15,680 --> 00:36:16,430 >> TOMAS Reimers: OK. 880 00:36:16,430 --> 00:36:19,800 Anem a resoldre el hashtag, i això és el que anirem amb. 881 00:36:19,800 --> 00:36:20,300 D'acord? 882 00:36:20,300 --> 00:36:20,735 >> ALLISON Buchholtz-AU: Hashtag. 883 00:36:20,735 --> 00:36:22,340 >> TOMAS Reimers: Així hashtag del primer. 884 00:36:22,340 --> 00:36:24,506 >> ALLISON Buchholtz-AU: Així pots tuitejar la seminar-- 885 00:36:24,506 --> 00:36:27,582 CSS hashtag, hashtag fresc. 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, si. 888 00:36:30,730 --> 00:36:31,480 TOMAS Reimers: OK. 889 00:36:31,480 --> 00:36:33,660 Així que tenim "primera" i "segona". 890 00:36:33,660 --> 00:36:37,697 Així que primer, tindrem un color de fons de color vermell. 891 00:36:37,697 --> 00:36:39,030 ALLISON Buchholtz-AU: Uh, còlon. 892 00:36:39,030 --> 00:36:40,281 TOMAS Reimers: Així és. 893 00:36:40,281 --> 00:36:42,281 ALLISON Buchholtz-AU: Seré el teu punt ortogràfic. 894 00:36:42,281 --> 00:36:43,960 TOMAS Reimers: Allison em té. 895 00:36:43,960 --> 00:36:45,830 Antecedents color de blue-- 896 00:36:45,830 --> 00:36:46,810 >> TOMAS Reimers: porpra! 897 00:36:46,810 --> 00:36:47,726 >> TOMAS Reimers: Porpra. 898 00:36:47,726 --> 00:36:48,830 ALLISON Buchholtz-AU: Sí. 899 00:36:48,830 --> 00:36:50,630 El meu color favorit de porpra, i no hem utilitzat encara. 900 00:36:50,630 --> 00:36:51,546 >> TOMAS Reimers: Violeta. 901 00:36:51,546 --> 00:36:53,361 ALLISON Buchholtz-AU: Violeta. 902 00:36:53,361 --> 00:36:53,860 Això funciona. 903 00:36:53,860 --> 00:36:56,482 904 00:36:56,482 --> 00:36:59,880 >> TOMAS Reimers: Així que estem va a tenir dos divs. 905 00:36:59,880 --> 00:37:01,654 Ells van a estar totalment buit. 906 00:37:01,654 --> 00:37:03,070 Probablement hauríem de tenir una mica de text. 907 00:37:03,070 --> 00:37:05,580 908 00:37:05,580 --> 00:37:09,815 Així que "primer" serà "HOLA". 909 00:37:09,815 --> 00:37:10,940 I la "segona" es dir-- 910 00:37:10,940 --> 00:37:11,110 >> ALLISON Buchholtz-AU: Adéu. 911 00:37:11,110 --> 00:37:12,514 >> AUDIÈNCIA: - "MÓN". 912 00:37:12,514 --> 00:37:14,122 Hola, adéu. 913 00:37:14,122 --> 00:37:16,580 ALLISON Buchholtz-AU: Vaig veure en concert l'altra setmana. 914 00:37:16,580 --> 00:37:17,705 TOMAS Reimers: The Beatles? 915 00:37:17,705 --> 00:37:20,242 ALLISON Buchholtz-AU: Per reals. 916 00:37:20,242 --> 00:37:21,200 No són tan grans. 917 00:37:21,200 --> 00:37:24,084 918 00:37:24,084 --> 00:37:24,750 No m'agrada. 919 00:37:24,750 --> 00:37:26,060 >> TOMAS Reimers: Disposem "Hola" i "adéu". 920 00:37:26,060 --> 00:37:29,102 I de nou, CSS és simplement impressionant, perquè reconeix els nostres colors. 921 00:37:29,102 --> 00:37:30,810 No necessita ni tan sols es preocupen que ells existeixen. 922 00:37:30,810 --> 00:37:33,194 Ho fan. 923 00:37:33,194 --> 00:37:35,130 >> ALLISON Buchholtz-AU: Ells existeixen. 924 00:37:35,130 --> 00:37:39,560 >> TOMAS Reimers: Així CSS crec que té 255 paraules per parlar de color. 925 00:37:39,560 --> 00:37:42,986 Si vostè pot pensar en un color exterior els 255, igual que, m'haurà impressionat. 926 00:37:42,986 --> 00:37:44,110 ALLISON Buchholtz-AU: Sí. 927 00:37:44,110 --> 00:37:45,560 Crec que vostès poden tenir acaba d'arribar just després. 928 00:37:45,560 --> 00:37:47,727 >> TOMAS Reimers: Així que aquí, vostè veurà que tenim dues caixes 929 00:37:47,727 --> 00:37:49,143 just a sobre d'un a l'altre, no? 930 00:37:49,143 --> 00:37:50,200 Hola i adéu. 931 00:37:50,200 --> 00:37:51,460 >> ALLISON Buchholtz-AU: No hi ha espai en el medi. 932 00:37:51,460 --> 00:37:53,390 Només estan smooshed dret a la part superior de l'altra. 933 00:37:53,390 --> 00:37:55,973 >> TOMAS Reimers: Així que el primer Jo crec que hauríem de parlar 934 00:37:55,973 --> 00:38:02,960 és també anem a dir--, si. 935 00:38:02,960 --> 00:38:08,020 Així CSS els representa com una mena de caixes. 936 00:38:08,020 --> 00:38:10,100 I com caixes, que tenen contingut. 937 00:38:10,100 --> 00:38:14,540 I el contingut ara és una espècie de el HOLA o l'adéu i això és tot. 938 00:38:14,540 --> 00:38:15,040 D'acord? 939 00:38:15,040 --> 00:38:19,790 >> Així que una de les primeres coses que que puc fer és que vostè pot afegir farcit. 940 00:38:19,790 --> 00:38:25,610 Farciment diu quant espai hauria de deixar a cada costat. 941 00:38:25,610 --> 00:38:29,200 Així que diguem que vull dir 10 píxels a cada costat. 942 00:38:29,200 --> 00:38:31,234 I vaig a disseccionar que en un segon. 943 00:38:31,234 --> 00:38:33,150 ALLISON Buchholtz-AU: Totes aquestes coses aquí 944 00:38:33,150 --> 00:38:36,980 seran majoritàriament en píxels per a la resta del seminari. 945 00:38:36,980 --> 00:38:40,980 Vas a veure que té una mica d'espai al seu voltant, oi? 946 00:38:40,980 --> 00:38:46,360 Així que el que no es veu aquí és que hi ha aquest tipus invisible de farciment 947 00:38:46,360 --> 00:38:49,600 en cada costat, el que diu, com, Bé, vostè té el seu quadre de content-- 948 00:38:49,600 --> 00:38:51,680 >> ALLISON Buchholtz-AU: Vostè desitja simplement tiri cap amunt l'element inspeccionar? 949 00:38:51,680 --> 00:38:53,659 >> TOMAS Reimers: Sí, això és una bona idea. 950 00:38:53,659 --> 00:38:56,700 ALLISON Buchholtz-AU: A més, em sembla que l'element d'inspeccionar és una bona manera 951 00:38:56,700 --> 00:39:01,280 esbrinar si alguna cosa està passant malament, alguna cosa inesperada passa, 952 00:39:01,280 --> 00:39:04,570 inspeccionar les etiquetes i veure què és com sobreescriu és útil. 953 00:39:04,570 --> 00:39:05,940 >> TOMAS Reimers: Així que no estic segur si vostès poden veure aquest color. 954 00:39:05,940 --> 00:39:06,470 Es pot? 955 00:39:06,470 --> 00:39:10,120 Veurà aquest farciment sobre el tipus de vora. 956 00:39:10,120 --> 00:39:13,410 I llavors es veu la real contingut en blau, oi? 957 00:39:13,410 --> 00:39:16,820 Així que aquesta és la mateixa conceptes bàsics del model de caixa. 958 00:39:16,820 --> 00:39:17,674 Vostè té contingut. 959 00:39:17,674 --> 00:39:18,590 Llavors vostè té farciment. 960 00:39:18,590 --> 00:39:20,440 >> AUDIÈNCIA: Per què no simplement utilitzar el quadre interior ell-- 961 00:39:20,440 --> 00:39:21,606 >> ALLISON Buchholtz-AU: Correcte. 962 00:39:21,606 --> 00:39:24,745 A causa de que heu seleccionat l'element en aquest moment. 963 00:39:24,745 --> 00:39:26,050 >> TOMAS Reimers: Així és. 964 00:39:26,050 --> 00:39:27,060 Altres coses. 965 00:39:27,060 --> 00:39:29,780 Així que anem a parlar d'això comandament farcit per un segon. 966 00:39:29,780 --> 00:39:36,380 Així que en CSS, mesuraments necessita tenir una unitat. 967 00:39:36,380 --> 00:39:39,740 Així que primer vostè té la quantitat. 968 00:39:39,740 --> 00:39:41,460 Així que en aquest cas, ho hem dit 10. 969 00:39:41,460 --> 00:39:44,780 I després la següent Ho hem dit és el píxel, píxels. 970 00:39:44,780 --> 00:39:49,160 Uns altres que pugui tenir són coses com centímetres, polzades. 971 00:39:49,160 --> 00:39:51,367 Vostè pot fer coses com: el que és de 10 polzades? 972 00:39:51,367 --> 00:39:52,700 I serà ridícul. 973 00:39:52,700 --> 00:39:52,990 >> ALLISON Buchholtz-AU: Oh, noi. 974 00:39:52,990 --> 00:39:53,460 >> AUDIÈNCIA: Whoa. 975 00:39:53,460 --> 00:39:54,460 >> TOMAS I ALLISON: Sí. 976 00:39:54,460 --> 00:39:57,840 TOMAS Reimers: Perquè tot el farciment. 977 00:39:57,840 --> 00:39:59,255 Vaig a tornar a píxels. 978 00:39:59,255 --> 00:40:01,754 >> ALLISON Buchholtz-AU: Píxels tendeixen a ser, igual que, la norma. 979 00:40:01,754 --> 00:40:04,589 Quan ens fixem en un munt de llocs web, que majoritàriament treballen en píxels. 980 00:40:04,589 --> 00:40:07,755 TOMAS Reimers: Així que anem a veure ja sigui pixels-- els altres els que es veuen 981 00:40:07,755 --> 00:40:13,952 és EM, que és una empresa és igual a l'alçada de la font 982 00:40:13,952 --> 00:40:15,160 que vostè està utilitzant actualment. 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: És una bona manera de dir, com, jo ​​vull tant espai com la meva font 986 00:40:20,740 --> 00:40:21,514 és prendre. 987 00:40:21,514 --> 00:40:23,180 ALLISON Buchholtz-AU: No sabia això. 988 00:40:23,180 --> 00:40:25,747 S'aprèn alguna cosa nova cada dia. 989 00:40:25,747 --> 00:40:27,955 TOMAS Reimers: Hi ha una gran quantitat de mesuraments en CS. 990 00:40:27,955 --> 00:40:29,260 Li suggereixo que busqui cap amunt. 991 00:40:29,260 --> 00:40:32,122 Per a tots els seus casos, crec que píxels han de ser suficients. 992 00:40:32,122 --> 00:40:33,830 I són també el que vas a veure 993 00:40:33,830 --> 00:40:36,520 en la majoria dels exemples es fa en línia. 994 00:40:36,520 --> 00:40:38,320 Així que ho deixarem en píxels. 995 00:40:38,320 --> 00:40:42,420 >> També pot, jo hauríem dir-- així establirà el farciment de tots els farcits. 996 00:40:42,420 --> 00:40:49,789 També pot fer alguna cosa com "Padding-top" que només definido-- 997 00:40:49,789 --> 00:40:52,080 ALLISON Buchholtz-AU: Potser ens posarem nostre "HOLA" de nou. 998 00:40:52,080 --> 00:40:55,480 TOMAS Reimers: --to acaba d'establir la encoixinat a la part superior i res més. 999 00:40:55,480 --> 00:40:59,560 Així que els quatre ordres són padding-top, padding-bottom, left-padding, 1000 00:40:59,560 --> 00:41:00,310 i padding-dreta. 1001 00:41:00,310 --> 00:41:02,470 >> ALLISON Buchholtz-AU: Igual que es pot esperar d'una caixa. 1002 00:41:02,470 --> 00:41:03,530 >> TOMAS Reimers: Sí. 1003 00:41:03,530 --> 00:41:05,240 Res massa boig allà. 1004 00:41:05,240 --> 00:41:08,230 Té això sentit? 1005 00:41:08,230 --> 00:41:11,990 Així que aquest és el farciment. 1006 00:41:11,990 --> 00:41:14,110 Jo vaig a posar tot els farcits de nou a 10. 1007 00:41:14,110 --> 00:41:17,010 I després em vaig a passar a la frontera. 1008 00:41:17,010 --> 00:41:21,130 >> Llavors, quina és la frontera és frontera és una ordre estranya. 1009 00:41:21,130 --> 00:41:24,450 Porta una espècie de tres coses alhora. 1010 00:41:24,450 --> 00:41:28,930 Així que el primer és el gran que vull que sigui com un mesurament. 1011 00:41:28,930 --> 00:41:30,662 Una vegada més, només estic fent servir píxels. 1012 00:41:30,662 --> 00:41:32,620 I l'últim que d'agregar als mesuraments 1013 00:41:32,620 --> 00:41:35,270 és l'única cosa que no necessita una unitat és 0. 1014 00:41:35,270 --> 00:41:37,390 En realitat és incorrecte per donar una unitat 0, 1015 00:41:37,390 --> 00:41:41,940 perquè 0 és 0 polzades a través de, píxels, centímetres, el que sigui. 1016 00:41:41,940 --> 00:41:43,960 Tot Només vol dir 0, oi? 1017 00:41:43,960 --> 00:41:46,710 Així que primer li dones el mesurament. 1018 00:41:46,710 --> 00:41:48,650 >> Llavors vostè li dóna l'estil. 1019 00:41:48,650 --> 00:41:49,869 Així que vaig a dir "sòlid". 1020 00:41:49,869 --> 00:41:51,410 I anem a parlar del que això significa. 1021 00:41:51,410 --> 00:41:54,290 I després, finalment, que li donen un color. 1022 00:41:54,290 --> 00:41:56,850 Així que vaig a dir "negre". 1023 00:41:56,850 --> 00:41:59,637 I aquestes són totes coses que hem ara vist abans, excepte per l'estil, 1024 00:41:59,637 --> 00:42:00,720 però ja parlarem d'això. 1025 00:42:00,720 --> 00:42:04,120 Així que vostès han vist els mesuraments, i has vist els colors. 1026 00:42:04,120 --> 00:42:10,410 I el que passa és que aconseguim aquest bonic vora negra al voltant d'ell, oi? 1027 00:42:10,410 --> 00:42:11,620 Vostès veuen com ho vam fer? 1028 00:42:11,620 --> 00:42:12,760 >> AUDIÈNCIA: Sí. 1029 00:42:12,760 --> 00:42:14,850 >> TOMAS Reimers: Cool. 1030 00:42:14,850 --> 00:42:17,370 Llavors, què és això? 1031 00:42:17,370 --> 00:42:19,160 Així que primer de tot, és un píxel. 1032 00:42:19,160 --> 00:42:20,880 Això és evident per si mateix prou, no? 1033 00:42:20,880 --> 00:42:23,254 Igual, que és un píxel de gruix. 1034 00:42:23,254 --> 00:42:26,170 O seria un píxel, però estic el zoom, així que és una mica més 1035 00:42:26,170 --> 00:42:26,490 que això. 1036 00:42:26,490 --> 00:42:27,967 >> ALLISON Buchholtz-AU: I tenim aquesta resolució TV ridícul. 1037 00:42:27,967 --> 00:42:29,460 >> TOMAS Reimers: Sí. 1038 00:42:29,460 --> 00:42:33,640 Pot fer-ho més gran, més petit, el que sigui. 1039 00:42:33,640 --> 00:42:35,630 Així que aquí hi ha una frontera de dos píxels. 1040 00:42:35,630 --> 00:42:38,810 Veuràs que és el doble de gruix. 1041 00:42:38,810 --> 00:42:40,172 El següent que tens és el color. 1042 00:42:40,172 --> 00:42:41,130 Això no és interessant. 1043 00:42:41,130 --> 00:42:42,710 No vaig a parlar sobre això, de veritat. 1044 00:42:42,710 --> 00:42:45,110 >> ALLISON Buchholtz-AU: Però l'estil pot resultar una mica interessant. 1045 00:42:45,110 --> 00:42:45,980 >> TOMAS Reimers: Sí. 1046 00:42:45,980 --> 00:42:48,560 Així estil, hi ha pocs que veig d'ús comú. 1047 00:42:48,560 --> 00:42:55,690 Sòlids, del proper Primer d'un punts i traços del passat d'un. 1048 00:42:55,690 --> 00:42:59,290 I aquí està esquitxada. 1049 00:42:59,290 --> 00:43:02,980 Veuràs que són un munt de punts, no? 1050 00:43:02,980 --> 00:43:09,030 Una bona manera d'aconseguir una espècie de frontera agradable va, guions són també molt populars. 1051 00:43:09,030 --> 00:43:11,580 1052 00:43:11,580 --> 00:43:13,600 >> ALLISON Buchholtz-AU: I després, per descomptat, estic 1053 00:43:13,600 --> 00:43:16,660 Segur que hi ha un munt altra estils que vostè pot aconseguir. 1054 00:43:16,660 --> 00:43:20,000 I tenim un gran conjunt de enllaços al final per a vostès 1055 00:43:20,000 --> 00:43:23,470 al tipus de llegir detingudament i mirar CSS més fresc. 1056 00:43:23,470 --> 00:43:25,954 >> TOMAS Reimers: I llavors l'última cosa, estem 1057 00:43:25,954 --> 00:43:27,870 anem a parlar de la models de caixes molt ràpid. 1058 00:43:27,870 --> 00:43:30,070 Ah, i després frontera, exactament com farciment, 1059 00:43:30,070 --> 00:43:33,270 vostè també té coses com border-left, border-right, border-top, 1060 00:43:33,270 --> 00:43:37,590 border-bottom, que li permetrà per arribar a una frontera específica. 1061 00:43:37,590 --> 00:43:40,650 Així que aquí és només la frontera definida esquerra. 1062 00:43:40,650 --> 00:43:43,060 Això té sentit? 1063 00:43:43,060 --> 00:43:46,170 >> ALLISON Buchholtz-AU: És un lloc fresc manera d'emfatitzar les coses o afegir 1064 00:43:46,170 --> 00:43:47,545 línies entre els diferents elements. 1065 00:43:47,545 --> 00:43:48,670 TOMAS Reimers: Per descomptat. 1066 00:43:48,670 --> 00:43:50,940 Així que aquesta és la nostra frontera. 1067 00:43:50,940 --> 00:43:52,790 I el marge de l'última d'un. 1068 00:43:52,790 --> 00:43:55,892 Com farcit de Marge Excepte que no és within-- 1069 00:43:55,892 --> 00:43:57,975 ALLISON Buchholtz-AU: És no al voltant del seu element 1070 00:43:57,975 --> 00:44:00,840 però en realitat al voltant de tota la quadre que hem estat veient. 1071 00:44:00,840 --> 00:44:02,770 >> TOMAS Reimers: Sí. 1072 00:44:02,770 --> 00:44:04,090 Allison va dir que la perfecció. 1073 00:44:04,090 --> 00:44:07,550 No és, com, dins del seu element, que és al voltant de la caixa sencera. 1074 00:44:07,550 --> 00:44:10,900 Això vol dir coses com fons no s'apliquen a ell. 1075 00:44:10,900 --> 00:44:13,550 I, bàsicament, diu, com, jo ​​no vull res 1076 00:44:13,550 --> 00:44:15,230 en aquest espai per a mi. 1077 00:44:15,230 --> 00:44:17,470 Així com tenim aquí un marge de 10 píxels. 1078 00:44:17,470 --> 00:44:23,100 Així que res d'aquí a 10 píxels ha d'estar al meu costat. 1079 00:44:23,100 --> 00:44:26,210 Això és una cosa de la seva espai, però com que no. 1080 00:44:26,210 --> 00:44:29,215 Així que aquesta és la mateixa conceptes bàsics del model de caixa. 1081 00:44:29,215 --> 00:44:30,090 Té això sentit? 1082 00:44:30,090 --> 00:44:33,830 1083 00:44:33,830 --> 00:44:34,550 Fresc, fresc. 1084 00:44:34,550 --> 00:44:35,800 ALLISON Buchholtz-AU: Awesome. 1085 00:44:35,800 --> 00:44:37,890 Així que ara crec que només Comptem amb recursos frescos 1086 00:44:37,890 --> 00:44:41,220 que et portarem nois a través de molt ràpidament. 1087 00:44:41,220 --> 00:44:44,815 I anem a actually-- bé, tenim internet encara? 1088 00:44:44,815 --> 00:44:47,860 >> TOMAS Reimers: Anem a veure si puc obrir up-- 1089 00:44:47,860 --> 00:44:50,040 m'ho dius a mi veure si puc pot aconseguir Internet ràpidament 1090 00:44:50,040 --> 00:44:53,317 mentre Allison parla de qualsevol cosa Allison vol parlar. 1091 00:44:53,317 --> 00:44:55,150 ALLISON Buchholtz-AU: Així basically-- no ho faig 1092 00:44:55,150 --> 00:44:57,930 sé què més puc dir en aquest moment. 1093 00:44:57,930 --> 00:45:01,340 Però aquestes són algunes molt bons recursos. 1094 00:45:01,340 --> 00:45:04,629 Aquests són els que Preses i he fet servir 1095 00:45:04,629 --> 00:45:06,420 i que en realitat utilitzat per preparar per això. 1096 00:45:06,420 --> 00:45:09,940 W3Schools és un que nois haurien d'haver vist abans. 1097 00:45:09,940 --> 00:45:12,440 El recomanem per a una moltes coses amb CSS. 1098 00:45:12,440 --> 00:45:15,060 Sé el recomano a la meva secció tot el temps. 1099 00:45:15,060 --> 00:45:21,050 >> Una de les grans coses és que que permet a classe d'embolic amb CSS 1100 00:45:21,050 --> 00:45:23,830 i veure els canvis instantàniament en aquest, 1101 00:45:23,830 --> 00:45:25,920 com, doble finestra de vista que té. 1102 00:45:25,920 --> 00:45:29,980 Així que vostè no s'ha de preocupar de la creació de la seva pròpia pàgina web, 1103 00:45:29,980 --> 00:45:33,090 o la creació d'amfitrió virtual en el seu aparell local i host local, 1104 00:45:33,090 --> 00:45:34,980 i aconseguir totes aquestes coses de treball. 1105 00:45:34,980 --> 00:45:36,830 Està incrustat just dins de la pàgina. 1106 00:45:36,830 --> 00:45:39,042 >> I té aquests petits lliçons que pugui 1107 00:45:39,042 --> 00:45:40,750 passar per aprendre més sobre selectors, 1108 00:45:40,750 --> 00:45:44,610 o aprendre sobre la manipulació de la seva font, o un fons o una imatge. 1109 00:45:44,610 --> 00:45:46,990 I vostè té aquests resultats instantanis que 1110 00:45:46,990 --> 00:45:49,310 no han de fer cap un altre treball de preparació per. 1111 00:45:49,310 --> 00:45:51,060 Així que m'encanta W3Schools. 1112 00:45:51,060 --> 00:45:51,960 És fabulós. 1113 00:45:51,960 --> 00:45:52,670 Està funcionant? 1114 00:45:52,670 --> 00:45:52,950 >> TOMAS Reimers: Sí. 1115 00:45:52,950 --> 00:45:53,720 No, no ho és. 1116 00:45:53,720 --> 00:45:55,636 Vols que jo tracti i reinicieu l'ordinador? 1117 00:45:55,636 --> 00:45:56,410 O volem A-- 1118 00:45:56,410 --> 00:46:01,490 >> ALLISON Buchholtz-AU: Vull dir, bo, això també estarà en línia. 1119 00:46:01,490 --> 00:46:02,740 Totes les diapositives estaran en línia. 1120 00:46:02,740 --> 00:46:05,470 Així que només recomano encaridament fer això. 1121 00:46:05,470 --> 00:46:07,880 >> Això és gran com s'acaba com un full de trucs. 1122 00:46:07,880 --> 00:46:10,690 És només tot el bàsic comandes que vostè té. 1123 00:46:10,690 --> 00:46:13,070 És genial quan estàs primer partint del seu lloc web. 1124 00:46:13,070 --> 00:46:15,080 Perquè potser no ho fa vull entrar en tots 1125 00:46:15,080 --> 00:46:17,355 el veritable cor de la qüestió disseny pesat coses. 1126 00:46:17,355 --> 00:46:20,230 Només ha de formatar d'una manera quin tipus de té sentit i la voluntat 1127 00:46:20,230 --> 00:46:21,490 fer de moment. 1128 00:46:21,490 --> 00:46:23,580 I si realment vols per entrar-hi, ho sé 1129 00:46:23,580 --> 00:46:27,240 és a dir, com, un Referències favorites de Tomas. 1130 00:46:27,240 --> 00:46:30,130 Estàvem usant a preparació, i és fabulós. 1131 00:46:30,130 --> 00:46:33,030 És el desenvolupador de Mozilla. 1132 00:46:33,030 --> 00:46:36,490 >> TOMAS Reimers: Així Mozilla són les persones que fan Firefox. 1133 00:46:36,490 --> 00:46:40,290 I és només el seu propi desenvolupador referència, que crec que és impressionant. 1134 00:46:40,290 --> 00:46:44,870 I té una meravellosa llista de recursos. 1135 00:46:44,870 --> 00:46:45,530 Així que tener-- 1136 00:46:45,530 --> 00:46:48,060 >> ALLISON Buchholtz-AU: I després l'última nota és 1137 00:46:48,060 --> 00:46:50,120 quan vostè està tractant de el disseny del seu lloc web, 1138 00:46:50,120 --> 00:46:53,550 inspirar-se en coses que vostè pensa que són bastant. 1139 00:46:53,550 --> 00:46:56,340 Inspecció de l'element, inspeccionar el codi font 1140 00:46:56,340 --> 00:46:59,370 pot ser molt útil per intentar esbrinar 1141 00:46:59,370 --> 00:47:02,080 com l'estil del seu propi lloc web. 1142 00:47:02,080 --> 00:47:04,540 >> Sovint, em sento com el millor manera, a més de l'experimentació, 1143 00:47:04,540 --> 00:47:06,290 és només per mirar coses que són bastant. 1144 00:47:06,290 --> 00:47:09,810 Em sembla que és molt difícil només tipus de dissenyar coses pel seu compte, 1145 00:47:09,810 --> 00:47:11,090 sobretot al principi. 1146 00:47:11,090 --> 00:47:14,740 Si us plau, revisi llocs web que gaudeixi veient. 1147 00:47:14,740 --> 00:47:16,880 Esbrinar el que fa atractius per a vostè. 1148 00:47:16,880 --> 00:47:19,170 I llavors no dubti en intentar reproduir això. 1149 00:47:19,170 --> 00:47:20,410 >> TOMAS Reimers: Correcte. 1150 00:47:20,410 --> 00:47:23,120 Fins i tot com llocs web d'aquesta manera, es pot veure 1151 00:47:23,120 --> 00:47:25,460 definitivament hi ha un div a la part superior. 1152 00:47:25,460 --> 00:47:29,920 I després tens un altre div dins aquí, que és Awesomeness CSS. 1153 00:47:29,920 --> 00:47:32,480 I llavors vostè té un munt d'enllaços aquí. 1154 00:47:32,480 --> 00:47:34,770 Si realment inspeccionar elements, es poden ordenar de 1155 00:47:34,770 --> 00:47:38,520 començar a veure el que fan llocs web veurà així, i com puc 1156 00:47:38,520 --> 00:47:40,493 esbarjo que si volia. 1157 00:47:40,493 --> 00:47:41,890 Té això sentit? 1158 00:47:41,890 --> 00:47:43,670 Així que només disposem de tres minuts per al final. 1159 00:47:43,670 --> 00:47:46,380 Així preguntes? 1160 00:47:46,380 --> 00:47:47,650 Qualsevol d'ells? 1161 00:47:47,650 --> 00:47:48,350 Sí. 1162 00:47:48,350 --> 00:47:50,780 >> AUDIÈNCIA: Per al color rectangle, com 1163 00:47:50,780 --> 00:47:53,499 tener-- si no ho vol va a través de tota la pàgina, podria 1164 00:47:53,499 --> 00:47:56,400 vostè ho ha fet anar a l'altre costat només la meitat de la pàgina o només el text? 1165 00:47:56,400 --> 00:47:59,660 >> TOMAS Reimers: Sí, absolutament. 1166 00:47:59,660 --> 00:48:02,780 Així que anem a veure en realitat. 1167 00:48:02,780 --> 00:48:04,670 Tinc dues idees. 1168 00:48:04,670 --> 00:48:07,265 Així que en primer lloc, vostè també pot utilitzar percentatges. 1169 00:48:07,265 --> 00:48:08,140 >> AUDIÈNCIA: De debò? 1170 00:48:08,140 --> 00:48:11,260 >> ALLISON Buchholtz-AU: Així que alguna cosa per buscar és el posicionament relatiu. 1171 00:48:11,260 --> 00:48:13,385 És una cosa que ens no tenen temps per entrar, 1172 00:48:13,385 --> 00:48:16,392 però és una cosa que definitivament Recomano que vostès li un cop d'ull. 1173 00:48:16,392 --> 00:48:17,580 >> TOMAS Reimers: El per cent menys. 1174 00:48:17,580 --> 00:48:21,524 I veure com ho vam fer 50% de l'amplada? 1175 00:48:21,524 --> 00:48:24,190 ALLISON Buchholtz-AU: Si realment conèixer el nombre de píxels, 1176 00:48:24,190 --> 00:48:25,780 pot ser més precisa d'aquesta manera. 1177 00:48:25,780 --> 00:48:27,200 Vostè pot veure al voltant d'ell. 1178 00:48:27,200 --> 00:48:27,700 Però el 50%. 1179 00:48:27,700 --> 00:48:31,970 Si haguéssim de canviar la mida del nostre navegador, seria fer-lo més petit. 1180 00:48:31,970 --> 00:48:35,250 >> TOMAS Reimers: Bé, és bàsicament al 50% en aquest moment, crec. 1181 00:48:35,250 --> 00:48:38,820 És 50%, i llavors el marge s'ha afegit als això. 1182 00:48:38,820 --> 00:48:40,100 CSS té moltes peculiaritats. 1183 00:48:40,100 --> 00:48:43,195 Així que ara mateix es tracta de 50% de l'amplada de la pàgina. 1184 00:48:43,195 --> 00:48:46,860 Però recordi que vostè té 10 píxels trets de cada costat. 1185 00:48:46,860 --> 00:48:49,700 Així que si anés a demanar que contra la vora esquerra del navegador, 1186 00:48:49,700 --> 00:48:51,550 a continuació, es veuria com un 50%. 1187 00:48:51,550 --> 00:48:53,884 Un cop més, com he dit, CSS pot ser un munt de conjectures i comprovació. 1188 00:48:53,884 --> 00:48:56,049 Igual, vostè pensa que alguna cosa és es comportarà d'una manera, 1189 00:48:56,049 --> 00:48:57,805 però es comporta d'una manera totalment diferent. 1190 00:48:57,805 --> 00:48:59,420 >> ALLISON Buchholtz-AU: I que acaba d'obtenir més intel·ligent, 1191 00:48:59,420 --> 00:49:02,020 i que acaba d'obtenir una millor la intuïció que a mesura que avança. 1192 00:49:02,020 --> 00:49:02,730 >> TOMAS Reimers: I posa pitjor i pitjor. 1193 00:49:02,730 --> 00:49:03,496 Així que és realment només una carrera. 1194 00:49:03,496 --> 00:49:05,454 >> ALLISON Buchholtz-AU: Això és molt encoratjador. 1195 00:49:05,454 --> 00:49:07,070 Volem que els agrada CSS. 1196 00:49:07,070 --> 00:49:08,810 >> TOMAS Reimers: CSS és impressionant. 1197 00:49:08,810 --> 00:49:10,354 Recordeu que. 1198 00:49:10,354 --> 00:49:11,020 Altres preguntes? 1199 00:49:11,020 --> 00:49:14,297 >> ALLISON Buchholtz-AU: L'única cosa. 1200 00:49:14,297 --> 00:49:14,880 Una mica més? 1201 00:49:14,880 --> 00:49:15,140 Fresc. 1202 00:49:15,140 --> 00:49:15,690 >> TOMAS Reimers: Awesome. 1203 00:49:15,690 --> 00:49:18,523 >> ALLISON Buchholtz-AU: Bé, si vostè nois tenen alguna pregunta més endavant, 1204 00:49:18,523 --> 00:49:20,919 estem sempre disponibles com de costum. 1205 00:49:20,919 --> 00:49:22,960 Probablement veurem alguns ens de per a projectes fi de carrera 1206 00:49:22,960 --> 00:49:24,280 i sens dubte en el hackathon. 1207 00:49:24,280 --> 00:49:25,200 >> TOMAS Reimers: Per descomptat. 1208 00:49:25,200 --> 00:49:25,720 I a la fira. 1209 00:49:25,720 --> 00:49:26,560 >> ALLISON Buchholtz-AU: I a la fira. 1210 00:49:26,560 --> 00:49:26,840 Oh. 1211 00:49:26,840 --> 00:49:28,130 >> TOMAS Reimers: Esperem amb interès veure tota la seva awesome-- 1212 00:49:28,130 --> 00:49:29,420 >> ALLISON Buchholtz-AU: Veurem tots els seus llocs web impressionants 1213 00:49:29,420 --> 00:49:30,572 que serà bonic. 1214 00:49:30,572 --> 00:49:32,780 TOMAS Reimers: Sempre es pot veure, com, els llocs web 1215 00:49:32,780 --> 00:49:36,234 que tenia, com, bé CSS i després com els que no tracti de fer-ho CSS. 1216 00:49:36,234 --> 00:49:39,150 ALLISON Buchholtz-AU: També, un altre cosa, una cosa més que mirar 1217 00:49:39,150 --> 00:49:40,445 és Bootstrapping. 1218 00:49:40,445 --> 00:49:41,805 Així Bootstrap és gran. 1219 00:49:41,805 --> 00:49:42,240 >> TOMAS Reimers: Google que si usted-- 1220 00:49:42,240 --> 00:49:43,573 >> ALLISON Buchholtz-AU: Google ell. 1221 00:49:43,573 --> 00:49:44,340 És fabulós. 1222 00:49:44,340 --> 00:49:45,620 Et va encantar. 1223 00:49:45,620 --> 00:49:48,000 I ara que té un coneixement bàsic de CSS, 1224 00:49:48,000 --> 00:49:50,340 que farà molt més sentit. 1225 00:49:50,340 --> 00:49:50,890 Impressionant. 1226 00:49:50,890 --> 00:49:51,480 Gràcies, nois. 1227 00:49:51,480 --> 00:49:53,330 >> TOMAS Reimers: Moltes gràcies. 1228 00:49:53,330 --> 00:49:54,219