1 00:00:00,000 --> 00:00:00,500 2 00:00:00,500 --> 00:00:04,500 >> [CHWARAE CERDDORIAETH] 3 00:00:04,500 --> 00:00:10,099 4 00:00:10,099 --> 00:00:12,224 ALLISON BUCHHOLTZ-PA: Felly rydym yn jyst yn mynd yn y bôn 5 00:00:12,224 --> 00:00:14,629 i roi dirywio i chi o CSS, oherwydd gwyddom 6 00:00:14,629 --> 00:00:16,420 nad oedd yn cynnwys yn yr holl adrannau. 7 00:00:16,420 --> 00:00:20,090 Ac rydym yn wir eisiau gwneud yn siŵr eich bod yn guys yn cael yr offeryn hwn ar gael i chi, 8 00:00:20,090 --> 00:00:24,790 oherwydd ei fod wedi y gallu i wneud eich gwefannau edrych yn llawer prettier. 9 00:00:24,790 --> 00:00:28,660 >> Ac os ydych yn adeiladu gwefan, yna mae'n debyg y byddwch eisiau ei wneud yn 'n bert. 10 00:00:28,660 --> 00:00:31,372 Yr wyf yn golygu, nid oes rhaid i chi, ond byddwn yn awgrymu ei fod. [Chwerthin] 11 00:00:31,372 --> 00:00:35,430 Os ydych am i ddefnyddwyr ei ddefnyddio, byddwch efallai am ei gwneud yn ychydig yn [Anghlywadwy]. 12 00:00:35,430 --> 00:00:39,130 Felly, rydym yn mynd i geisio rhoi i chi yn unig rhai offer a dealltwriaeth sylfaenol, 13 00:00:39,130 --> 00:00:42,340 felly pan fyddwch yn mynd allan ac rydych yn ymchwilio pethau am CSS, 14 00:00:42,340 --> 00:00:45,902 nid yw'n cwblhau gibberish, fel CSS weithiau fod. 15 00:00:45,902 --> 00:00:47,240 >> TOMAS REIMERS: Yeah. 16 00:00:47,240 --> 00:00:49,930 Dywedodd Allison ei fod yn eithaf da. 17 00:00:49,930 --> 00:00:53,250 Felly, yr wyf yn dyfalu y peth cyntaf i ni Dylai ddechrau gyda beth yw CSS? 18 00:00:53,250 --> 00:00:55,750 Felly CSS yn awesome. 19 00:00:55,750 --> 00:00:56,250 CSS-- 20 00:00:56,250 --> 00:00:58,320 >> ALLISON BUCHHOLTZ-PA: Dyna enw ein seminar. 21 00:00:58,320 --> 00:00:58,434 >> TOMAS REIMERS: Yeah. 22 00:00:58,434 --> 00:01:00,130 Mae'n bwysig iawn bod eich bod yn deall bod erbyn hynny. 23 00:01:00,130 --> 00:01:03,090 Os ydych ond yn cymryd i ffwrdd un beth, mae'n yr CSS os awesome. 24 00:01:03,090 --> 00:01:06,180 Mae dau yn CSS yn sefyll am Rhaeadru Taflenni Arddull. 25 00:01:06,180 --> 00:01:10,380 Felly, wrth ei wraidd, CSS yw dalen arddull, sy'n golygu 26 00:01:10,380 --> 00:01:13,200 mae'n eich galluogi i arddull tudalen ar y we. 27 00:01:13,200 --> 00:01:16,609 Ac yna beth mae hynny'n ei olygu, ei fod yn ffordd i ychwanegu at eich arddull gwefannau. 28 00:01:16,609 --> 00:01:18,900 Felly gan arddull, rydym yn golygu popeth nid yw hynny'n structural-- 29 00:01:18,900 --> 00:01:24,350 felly pethau fel lliwiau, cefndir delweddau, borderi, fel, padin, 30 00:01:24,350 --> 00:01:25,040 ymylon. 31 00:01:25,040 --> 00:01:27,310 Byddwn yn siarad am yr hyn i gyd mae hynny'n golygu mewn ychydig. 32 00:01:27,310 --> 00:01:30,110 >> Felly, rydym wedi mynd yn ei flaen yn unig a Agorwyd y ddau o'r rheiny i fyny yn gedit. 33 00:01:30,110 --> 00:01:32,680 Felly mae hyn yn index.html. 34 00:01:32,680 --> 00:01:34,800 Ac mae hyn yn main.css. 35 00:01:34,800 --> 00:01:36,829 Felly main.css wedi unrhyw beth. 36 00:01:36,829 --> 00:01:38,412 ALLISON BUCHHOLTZ-PA: Dim arddull hyd yn hyn. 37 00:01:38,412 --> 00:01:39,245 TOMAS REIMERS: Dim. 38 00:01:39,245 --> 00:01:42,577 Ac fel y gwelwch, mae'n safle 'n sylweddol hyll. 39 00:01:42,577 --> 00:01:44,160 ALLISON BUCHHOLTZ-PA: Dim ond plaen. 40 00:01:44,160 --> 00:01:45,820 TOMAS REIMERS: Yeah. 41 00:01:45,820 --> 00:01:49,150 Yeah, nid yw'n hyll, 'i' jyst finimalaidd. 42 00:01:49,150 --> 00:01:53,430 Ac yna dyma ni wedi index.html. 43 00:01:53,430 --> 00:01:55,729 Ac felly am cyflym ailadrodd o HTML, Allison, 44 00:01:55,729 --> 00:01:57,270 rydych am i ddim ond siarad am y dudalen? 45 00:01:57,270 --> 00:01:58,395 >> ALLISON BUCHHOLTZ-PA: Yeah. 46 00:01:58,395 --> 00:02:01,100 Felly yn amlwg, yr ydym wedi ein HTML tag, a dim ond enwau ffeiliau HTML. 47 00:02:01,100 --> 00:02:07,080 Rydym wedi ein header yma, gyda CSS Awesomeness, ac-- os byddwch yn mynd yn ôl. 48 00:02:07,080 --> 00:02:07,720 Ble yw hynny? 49 00:02:07,720 --> 00:02:09,136 >> TOMAS REIMERS: Oh. 50 00:02:09,136 --> 00:02:10,301 Yeah, gallwch weld. 51 00:02:10,301 --> 00:02:12,092 ALLISON BUCHHOLTZ-PA: Ac yn sylwi ar y pennawd 52 00:02:12,092 --> 00:02:14,120 yw hyn header tab dde i fyny yma. 53 00:02:14,120 --> 00:02:17,130 Ac yna "Helo, byd!" yn y testun sydd gennym yn unig 54 00:02:17,130 --> 00:02:19,620 arddangos ar y we dudalen, sy'n yw-- mynd yn ôl. 55 00:02:19,620 --> 00:02:21,290 Back. 56 00:02:21,290 --> 00:02:24,287 Sydd ychydig yn ein corff Yma-- testun plaen. 57 00:02:24,287 --> 00:02:26,120 Hefyd, mae un peth i sylwi, os edrychwch yma, 58 00:02:26,120 --> 00:02:29,410 Tomas troi i fyny rhain dau o'n sleid. 59 00:02:29,410 --> 00:02:32,035 Felly, cyn belled â bod gennych yr holl tri o'r rhain, rydych yn iawn. 60 00:02:32,035 --> 00:02:34,044 Gallant fod ym mha bynnag drefn y maent am. 61 00:02:34,044 --> 00:02:39,368 Beth sy'n bwysicaf yn unig yw hynny mae gennych bob un o'r rhai tri pheth. 62 00:02:39,368 --> 00:02:40,340 >> TOMAS REIMERS: Cool. 63 00:02:40,340 --> 00:02:41,111 Ychwanegu math doc? 64 00:02:41,111 --> 00:02:42,235 ALLISON BUCHHOLTZ-PA: Yeah. 65 00:02:42,235 --> 00:02:43,068 TOMAS REIMERS: Yeah. 66 00:02:43,068 --> 00:02:43,769 Cool. 67 00:02:43,769 --> 00:02:46,102 ALLISON BUCHHOLTZ-PA: Mae'n debyg, Nid yw fy mics yn hoffi i mi. 68 00:02:46,102 --> 00:02:49,650 TOMAS REIMERS: O, yn rhoi sec i ni yn unig tra Allison switshis allan ei meic. 69 00:02:49,650 --> 00:02:50,500 Felly yeah. 70 00:02:50,500 --> 00:02:52,030 Felly, rydym wedi ein prif dudalen. 71 00:02:52,030 --> 00:02:53,890 Mae'n fath o unstyled. 72 00:02:53,890 --> 00:02:54,780 Nid oes gennym lawer. 73 00:02:54,780 --> 00:02:57,110 Rydym yn unig wedi bôn testun. 74 00:02:57,110 --> 00:02:59,470 Mae gennym y dalen arddull. 75 00:02:59,470 --> 00:03:00,220 Mae gennym y teitl. 76 00:03:00,220 --> 00:03:04,020 Felly, dim ond noeth-esgyrn cydrannau yn gwneud gwefan. 77 00:03:04,020 --> 00:03:08,880 >> Felly oddi yno, gadewch i ni siarad am yr hyn CSS yw 78 00:03:08,880 --> 00:03:11,270 a'r hyn y mae'n edrych fel a hynny i gyd. 79 00:03:11,270 --> 00:03:12,047 Felly, ar gyfer that-- 80 00:03:12,047 --> 00:03:13,755 ALLISON BUCHHOLTZ-PA: Yn ôl i'r sleidiau. 81 00:03:13,755 --> 00:03:15,200 TOMAS REIMERS: Yn ôl at y sleidiau. 82 00:03:15,200 --> 00:03:17,240 A gall Allison gymryd drosodd. 83 00:03:17,240 --> 00:03:18,720 >> ALLISON BUCHHOLTZ-PA: Woo. 84 00:03:18,720 --> 00:03:19,220 OK. 85 00:03:19,220 --> 00:03:22,360 Felly, yn eich ffeil CSS, ydych yn mynd i gael 86 00:03:22,360 --> 00:03:25,010 mae llawer o'r pethau hyn a elwir yn detholwyr. 87 00:03:25,010 --> 00:03:27,420 Bydd hynny yn unig fydd y sail eich ffeil CSS. 88 00:03:27,420 --> 00:03:29,480 Dim ond ei fod yn mynd i fod llawer a llawer o'r rhain. 89 00:03:29,480 --> 00:03:30,780 Felly dewisydd. 90 00:03:30,780 --> 00:03:32,649 Mae hyn yn unig y anatomeg cyffredinol. 91 00:03:32,649 --> 00:03:35,190 Rydym yn mynd i fynd drwy enghreifftiau, oherwydd os nad ydych guys 92 00:03:35,190 --> 00:03:38,400 gwylio fy adran, yr wyf yn teimlo fel bethau yn y haniaethol 93 00:03:38,400 --> 00:03:39,400 peidiwch wir yn gwneud synnwyr. 94 00:03:39,400 --> 00:03:41,110 Mae bob amser yn helpu i weld yr enghreifftiau. 95 00:03:41,110 --> 00:03:42,420 >> Felly, mae gennym rai dewisydd. 96 00:03:42,420 --> 00:03:49,120 Mae hynny'n mynd i fod rhywfaint dynodwr i yr hyn yr ydym am i'r arddull i wneud cais i. 97 00:03:49,120 --> 00:03:52,220 Ac yna gallwn gael unrhyw set o reolau a gwerthoedd. 98 00:03:52,220 --> 00:03:55,680 Felly dewiswyr y gallech weld allai fod yn rhywbeth fel corff, 99 00:03:55,680 --> 00:04:00,262 neu baragraff â P, neu pennawd, neu beth bynnag, 100 00:04:00,262 --> 00:04:02,000 beth bynnag yr ydych am i'ch tagiau HTML i fod. 101 00:04:02,000 --> 00:04:03,570 >> Felly, yn yr achos hwn, rydym wedi corff. 102 00:04:03,570 --> 00:04:06,985 Ac mae gennym rai rheol, y mae hyn yn cyd-fynd 103 00:04:06,985 --> 00:04:09,610 i hyn y mae eich steil yn berthnasol i. 104 00:04:09,610 --> 00:04:12,720 Felly, yn yr achos hwn, rydym wedi lliw cefndir a phwysau ffont. 105 00:04:12,720 --> 00:04:16,200 Felly, mae hyn yn mynd i newid y cefndir o unrhyw beth 106 00:04:16,200 --> 00:04:19,640 o fewn unrhyw tag gorff o'n ffeil HTML. 107 00:04:19,640 --> 00:04:22,810 Ac mae'n mynd i roi mae hwn yn werth glas golau. 108 00:04:22,810 --> 00:04:24,820 >> Felly, mae'n mynd i wneud y glas golau cefndir. 109 00:04:24,820 --> 00:04:28,660 Ac yna unrhyw beth o fewn corff yn mynd i gael bwysau ffont beiddgar. 110 00:04:28,660 --> 00:04:31,142 Felly, 'i' jyst yn mynd i beiddgar ein holl destun. 111 00:04:31,142 --> 00:04:32,970 Ac mae hyn yn unig yw un dewisydd. 112 00:04:32,970 --> 00:04:34,680 Ond gallai fod gennych lawer iawn o'r rhain. 113 00:04:34,680 --> 00:04:38,730 Ac wrth i ni yn mynd i ddangos yn ddiweddarach, ychydig bach mwy i sut 114 00:04:38,730 --> 00:04:40,709 bod gwaith a mwy o enghreifftiau yno. 115 00:04:40,709 --> 00:04:41,750 Unrhyw beth rydych am ei ychwanegu? 116 00:04:41,750 --> 00:04:42,499 >> TOMAS REIMERS: Na 117 00:04:42,499 --> 00:04:43,500 Allison got it. 118 00:04:43,500 --> 00:04:46,144 Rydym yn jyst yn mynd i dorri i fyny yn enghraifft yma ar ein safle esiampl. 119 00:04:46,144 --> 00:04:47,310 Felly, gadewch i ni mewn gwirionedd yn cymryd hyn. 120 00:04:47,310 --> 00:04:48,620 Mae'n berffaith. 121 00:04:48,620 --> 00:04:54,460 Felly, Im 'jyst yn mynd i gopïo a gludo yr hawl honno i mewn i'n ffeil main.css. 122 00:04:54,460 --> 00:04:56,530 Ac yr wyf i'n mynd i'w achub. 123 00:04:56,530 --> 00:04:59,190 Ac yna byddwn yn rhedeg. 124 00:04:59,190 --> 00:05:01,600 Nodyn Felly ochr, un o'r rhan fwyaf o bethau rhwystredig 125 00:05:01,600 --> 00:05:04,490 yw os nad ydych yn cadw ffeil, a yna rydych, fel, ail-lwytho'r dudalen, 126 00:05:04,490 --> 00:05:07,450 ac fel, pam nad yw y newid yn digwydd? 127 00:05:07,450 --> 00:05:07,950 Mae'n digwydd. 128 00:05:07,950 --> 00:05:14,230 Felly dyma gwelsom ein bod yn gwneud ein Gwefan gefndir glas golau 129 00:05:14,230 --> 00:05:16,560 a rhywfaint o destun bolded. 130 00:05:16,560 --> 00:05:20,730 >> Dylwn hefyd grybwyll, os ydych guys gennych gwestiynau am unrhyw beth 131 00:05:20,730 --> 00:05:23,622 rydym yn ei wneud, mae croeso rhad ac am ddim i roi'r gorau i ni a gofynnwch i ni. 132 00:05:23,622 --> 00:05:25,330 Rydym yn gwbl barod i gae cwestiynau. 133 00:05:25,330 --> 00:05:27,951 134 00:05:27,951 --> 00:05:31,930 >> ALLISON BUCHHOLTZ-PA: Yn amlwg, gyda CSS, mae popeth yn adeiladu ar ei hun. 135 00:05:31,930 --> 00:05:34,107 Felly, os nad yw un peth yn gwneud gwneud synnwyr yn awr, yr ydym yn 136 00:05:34,107 --> 00:05:35,690 ddim eisiau bod i gors chi i lawr yn nes ymlaen. 137 00:05:35,690 --> 00:05:38,390 138 00:05:38,390 --> 00:05:41,930 >> TOMAS REIMERS: Felly gadewch i ni math o ddyrannu hwn. 139 00:05:41,930 --> 00:05:44,210 Felly, ydych chi eisiau dechrau gyda'r detholydd yma? 140 00:05:44,210 --> 00:05:45,979 >> ALLISON BUCHHOLTZ-PA: Yeah. 141 00:05:45,979 --> 00:05:48,270 Fel yr oeddwn yn ei ddweud o'r blaen, y corff yn unig yw ein dewisydd yma. 142 00:05:48,270 --> 00:05:50,950 Felly, os ydym yn mynd yn ôl dros at ein AH index--. 143 00:05:50,950 --> 00:05:53,245 >> TOMAS REIMERS: Pa Fi jyst gau. 144 00:05:53,245 --> 00:05:54,530 Rhoi ail mi. 145 00:05:54,530 --> 00:05:58,286 Felly File, Agored, index.html. 146 00:05:58,286 --> 00:05:59,410 ALLISON BUCHHOLTZ-PA: Cool. 147 00:05:59,410 --> 00:06:02,710 Felly, os ydych yn sylwi yma, rydym yn rhaid i tagiau corff hyn, dde? 148 00:06:02,710 --> 00:06:06,270 Felly, y detholydd yn unig yn cyfateb i y tagiau yr ydym yn sôn amdano. 149 00:06:06,270 --> 00:06:07,670 Felly gorff i'r dde yma. 150 00:06:07,670 --> 00:06:10,315 Felly, beth yr ydym yn ei ddweud yw everything-- allwn ni fynd yn ôl? 151 00:06:10,315 --> 00:06:12,065 Yr wyf yn dymuno gallwn jyst fel cyffwrdd y sgrin. 152 00:06:12,065 --> 00:06:14,410 Byddai'n llawer oerach. 153 00:06:14,410 --> 00:06:17,150 >> Felly unrhyw beth o fewn y rhai tagiau corff, a welodd yr ydym 154 00:06:17,150 --> 00:06:19,637 yn unig oedd, fel, y testun, a'r corff yn gyffredinol 155 00:06:19,637 --> 00:06:20,970 yn cyfeirio at, fel, y cefndir. 156 00:06:20,970 --> 00:06:22,720 Os ydych chi erioed wedi eisiau newid y cefndir, 157 00:06:22,720 --> 00:06:25,090 sy'n mynd i fod mewn tag corff. 158 00:06:25,090 --> 00:06:27,120 Dim ond mae gan y rheolau hyn yn berthnasol iddynt. 159 00:06:27,120 --> 00:06:32,040 >> Felly, pe baem yn mynd i index.html ac-- mewn gwirionedd, 160 00:06:32,040 --> 00:06:33,840 gallwn gael rhywbeth y tu allan i'r corff? 161 00:06:33,840 --> 00:06:37,340 Os ydym wedi, fel, yn troedyn neu rhywbeth, ni fyddai'n berthnasol i hyn. 162 00:06:37,340 --> 00:06:40,900 Ond mae unrhyw beth o fewn tagiau corff yma yn mynd 163 00:06:40,900 --> 00:06:44,960 gael eu heffeithio gan y corff hwn detholydd yr ydym wedi gwneud. 164 00:06:44,960 --> 00:06:47,405 Felly, os ydych yn teipio rhywbeth arall there-- 165 00:06:47,405 --> 00:06:49,400 >> TOMAS REIMERS: Gadewch i ni yrru y cartref. 166 00:06:49,400 --> 00:06:55,330 Felly, pe bai gennym div-- felly dyna dim ond tag arall y gallwch ei gael. 167 00:06:55,330 --> 00:06:56,350 Rydw i'n mynd i gau. 168 00:06:56,350 --> 00:06:58,280 Neu gadewch i ni wneud hyn paragraff. 169 00:06:58,280 --> 00:07:01,430 Felly p yn sefyll am paragraff. 170 00:07:01,430 --> 00:07:02,560 Ac o fewn y paragraff hwnnw. 171 00:07:02,560 --> 00:07:05,650 Ac yna yr wyf yn dweud, "Mae hwn yn destun." 172 00:07:05,650 --> 00:07:06,369 Cool. 173 00:07:06,369 --> 00:07:09,160 Ac yna yr wyf yn gwneud y rheol hon yn berthnasol i paragraff yn hytrach na'r corff. 174 00:07:09,160 --> 00:07:12,390 175 00:07:12,390 --> 00:07:17,320 Byddwch yn gweld sut y mae'n berthnasol yn unig i y paragraff sydd newydd ei ffurfio, ar y dde, 176 00:07:17,320 --> 00:07:18,892 Nid yw'r holl beth. 177 00:07:18,892 --> 00:07:20,090 A yw hynny'n gwneud synnwyr? 178 00:07:20,090 --> 00:07:21,840 >> ALLISON BUCHHOLTZ-PA: Felly, mae hyn i gyd yn gorff, 179 00:07:21,840 --> 00:07:24,450 ond erbyn hyn mae ein dewisydd yn unig cyfateb i'r paragraff. 180 00:07:24,450 --> 00:07:27,050 Felly, rydym yn unig wedi beiddgar a glas am y paragraff hwn penodol, 181 00:07:27,050 --> 00:07:30,760 gan mai dyma'r unig beth sy'n cael ei hamgáu o fewn y tag t. 182 00:07:30,760 --> 00:07:35,349 >> TOMAS REIMERS: A yw hynny'n gwneud synnwyr didoli o sut mae pethau'n crynhoi pethau eraill? 183 00:07:35,349 --> 00:07:38,140 ALLISON BUCHHOLTZ-PA: Hefyd, dim ond i ddweud, fel, yn un o'r ffyrdd gorau 184 00:07:38,140 --> 00:07:40,889 i wir yn gyfforddus gyda CSS yw dim ond gwneud pethau fel hyn, 185 00:07:40,889 --> 00:07:42,050 jyst roi cynnig arni. 186 00:07:42,050 --> 00:07:46,700 Mae'n syml iawn i deipio rhywbeth allan, taro Refresh, a gweld beth sy'n digwydd. 187 00:07:46,700 --> 00:07:48,940 Ac fel gyda'r rhan fwyaf CS, Gall arbrofi yn aml 188 00:07:48,940 --> 00:07:51,790 yn arwain at lawer gwell dealltwriaeth reddfol. 189 00:07:51,790 --> 00:07:54,432 Hyd yn oed yn fwy felly na ni yn unig, fel, yn siarad â chi. 190 00:07:54,432 --> 00:07:58,350 >> TOMAS REIMERS: Yn hollol 100% yn cytuno ar y pwynt hwnnw. 191 00:07:58,350 --> 00:08:02,430 Felly, os ydym yn mynd yn ôl at hyn, gadewch i ni ddechrau dyrannu yn union beth dau rhain yn ei wneud. 192 00:08:02,430 --> 00:08:04,550 Felly, mae gennym ddau rheolau ar hyn. 193 00:08:04,550 --> 00:08:07,420 Felly, yr un cyntaf yn lliw cefndir. 194 00:08:07,420 --> 00:08:10,590 A ydych yn gweld ein bod wedi gosod ei cyfartal i werth, glas golau. 195 00:08:10,590 --> 00:08:15,009 >> Felly, yn CSS, CSS yn didoli o llac iawn am sut 196 00:08:15,009 --> 00:08:16,300 yn caniatáu i chi i ddiffinio lliw. 197 00:08:16,300 --> 00:08:17,800 Fel y gallwch eu diffinio yn ôl enw. 198 00:08:17,800 --> 00:08:20,650 Gallwch hefyd wneud rhywbeth fel "coch." 199 00:08:20,650 --> 00:08:25,270 Ac yna os ydym yn mynd yn ôl at hyn, byddwch yn gweld bod y cefndir yn goch. 200 00:08:25,270 --> 00:08:29,040 Gallwch hefyd gael really-- Rwy'n credu eich yn gallu cael 'n bert greadigol â hyn, 201 00:08:29,040 --> 00:08:29,540 Ni allwch chi? 202 00:08:29,540 --> 00:08:31,170 >> ALLISON BUCHHOLTZ-PA: I meddwl y gallwch chi ddefnyddio hecs. 203 00:08:31,170 --> 00:08:31,250 Ni Allwch chi? 204 00:08:31,250 --> 00:08:32,083 >> TOMAS REIMERS: Yeah. 205 00:08:32,083 --> 00:08:32,969 Felly, gallwch ddefnyddio hecs. 206 00:08:32,969 --> 00:08:34,490 Ond dw i'n enw-ddoeth meddwl. 207 00:08:34,490 --> 00:08:35,385 A does? 208 00:08:35,385 --> 00:08:37,260 ALLISON BUCHHOLTZ-PA: Gallwch chi wneud eithaf ychydig. 209 00:08:37,260 --> 00:08:43,350 'N bert lawer fel y rhan fwyaf liwiau sy'n eich Gall name-- fel, yr wyf yn meddwl eog yn un. 210 00:08:43,350 --> 00:08:45,322 >> TOMAS REIMERS: Rydym yn eog ceisiwch gonna. 211 00:08:45,322 --> 00:08:47,530 ALLISON BUCHHOLTZ-PA: I yn meddwl chartreuse yw mewn 'na. 212 00:08:47,530 --> 00:08:48,050 TOMAS REIMERS: Yeah. 213 00:08:48,050 --> 00:08:48,550 Gweler? 214 00:08:48,550 --> 00:08:50,080 Fel y gallwch gael 'n bert greadigol. 215 00:08:50,080 --> 00:08:52,246 >> ALLISON BUCHHOLTZ-PA: Chi Gallai gael 'n bert greadigol. 216 00:08:52,246 --> 00:08:55,750 Fel, os gallwch chi feddwl am y Enw lliw, mae'n fwy na thebyg mewn 'na. 217 00:08:55,750 --> 00:08:57,840 Os ydych wir eisiau iawn fanylion, gallwch fynd hecs. 218 00:08:57,840 --> 00:08:58,673 >> TOMAS REIMERS: Yeah. 219 00:08:58,673 --> 00:08:59,390 Felly hecsadegol. 220 00:08:59,390 --> 00:09:05,280 Os ydych yn guys yn cofio nôl hon gan eich hen PSET, Image Adfer, 221 00:09:05,280 --> 00:09:08,300 oedd gennych guys i ddelio gyda gwerthoedd hecs hyn. 222 00:09:08,300 --> 00:09:15,280 Ac yn fath o ailadrodd yr hyn i hynny yw, Mae hecs tri gwerth ei storio ynddo. 223 00:09:15,280 --> 00:09:17,250 Felly mae'n mewn grwpiau o ddau hicyn. 224 00:09:17,250 --> 00:09:19,300 Mae'r ddau gyntaf yn cynrychioli'r gwerth coch. 225 00:09:19,300 --> 00:09:22,420 Mae'r ail un yn cynrychioli gwerth gwyrdd. 226 00:09:22,420 --> 00:09:25,020 Ac mae'r un olaf yn las? 227 00:09:25,020 --> 00:09:30,050 >> Felly FF fydd yn digwydd i gynrychioli yn hecsadegol 255. 228 00:09:30,050 --> 00:09:35,480 Felly, mae gennych 255 o goch, 255 gwyrdd, a 0 ar gyfer glas. 229 00:09:35,480 --> 00:09:37,670 Ac mae gwerthoedd yn amrywio rhwng 0 a 255. 230 00:09:37,670 --> 00:09:38,350 >> GYNULLEIDFA: Iawn. 231 00:09:38,350 --> 00:09:41,472 Felly y bôn, gallem chwilio rhyngrwyd ar gyfer unrhyw liw yr ydym ei eisiau, 232 00:09:41,472 --> 00:09:43,912 ac adnabod y gwirionedd-hysbys lliw combo sbectrwm, 233 00:09:43,912 --> 00:09:45,130 ac yna gallem ei roi i mewn? 234 00:09:45,130 --> 00:09:46,380 ALLISON BUCHHOLTZ-PA: Yn union. 235 00:09:46,380 --> 00:09:52,900 Felly, rydych wedi 'n bert lawer reolaeth lwyr dros y lliwiau rydych eisiau fewn CSS. 236 00:09:52,900 --> 00:09:55,069 A ydym yn mynd i siarad am delweddau cefndir yn ddiweddarach? 237 00:09:55,069 --> 00:09:56,110 Neu a ydym am wneud hynny? 238 00:09:56,110 --> 00:09:56,240 >> TOMAS REIMERS: Yeah. 239 00:09:56,240 --> 00:09:57,010 Yn hollol. 240 00:09:57,010 --> 00:10:00,830 Felly yn gyntaf, dim ond i ddangos bod coch a gwyrdd yn felyn. 241 00:10:00,830 --> 00:10:03,120 Ac os ydych angen rhywfaint o helpu ddod o hyd hyn, byddwch yn 242 00:10:03,120 --> 00:10:05,575 Gall Google rhywbeth fel "dewisiwr lliw." 243 00:10:05,575 --> 00:10:07,200 ALLISON BUCHHOLTZ-PA: O, mae mor dda. 244 00:10:07,200 --> 00:10:09,090 Rwyf wrth fy modd Lliw Picker. 245 00:10:09,090 --> 00:10:11,360 >> TOMAS REIMERS: colorpicker.com yn enghraifft dda. 246 00:10:11,360 --> 00:10:14,580 Ac yma, byddwch yn gweld eich bod wedi craen casglu lliw Photoshop-debyg llawn. 247 00:10:14,580 --> 00:10:14,920 >> ALLISON BUCHHOLTZ-UA: Mm-EM. 248 00:10:14,920 --> 00:10:16,980 Hefyd, mae'r pethau oer ydych chi Gall gynhyrchu cynlluniau lliw 249 00:10:16,980 --> 00:10:18,896 fel nad oes gennych, fel, gwrthdaro lliwiau. 250 00:10:18,896 --> 00:10:22,780 TOMAS REIMERS: Ac yna dyma y hecs gwerth i fyny yma. 251 00:10:22,780 --> 00:10:27,800 Felly, gallwch chi bob amser yn dod o hyd ar-lein yn y bôn llefydd i gael y gwerth hecs o. 252 00:10:27,800 --> 00:10:31,667 Dyw hi ddim yn didoli o hynny yn union, fel, yr ydym gweld y lliwiau y byd mewn niferoedd. 253 00:10:31,667 --> 00:10:34,000 Mae'n fwy ein bod yn mynd ar-lein a dod o hyd pa liw yr ydym am, 254 00:10:34,000 --> 00:10:36,850 ac yna cymerwch y rhif i lawr. 255 00:10:36,850 --> 00:10:39,590 Oherwydd mai dim ond hawdd iawn ffordd i gyfeirnodi pethau yn CS. 256 00:10:39,590 --> 00:10:40,350 >> ALLISON BUCHHOLTZ-PA: Ac yna mae also-- 257 00:10:40,350 --> 00:10:41,630 Yr wyf yn anghofio yr union enw'r safle. 258 00:10:41,630 --> 00:10:43,838 Ond mae bendant, yr wyf yn yn meddwl, rhywbeth o Adobe 259 00:10:43,838 --> 00:10:48,350 sy'n cynhyrchu cynlluniau lliw ar eich cyfer, sydd yn 'n sylweddol oera, oherwydd eich bod 260 00:10:48,350 --> 00:10:50,580 definitely-- 'i' weithiau galed i chyfrif i maes, 261 00:10:50,580 --> 00:10:53,729 oh, os ydw i eisiau defnyddio lliw hwn, yr hyn a allai fod yn un ddefnyddiol arall 262 00:10:53,729 --> 00:10:56,395 i'w defnyddio mewn mannau eraill ar fy safle i, fel, yn ei gwneud yn braf ac yn gydlynol. 263 00:10:56,395 --> 00:11:00,430 264 00:11:00,430 --> 00:11:04,260 >> TOMAS REIMERS: Allison yn siarad am un gan Adobe o'r enw Kuler, yr wyf yn meddwl. 265 00:11:04,260 --> 00:11:04,885 Mae'n K-U-L-E-R. 266 00:11:04,885 --> 00:11:06,259 ALLISON BUCHHOLTZ-UA: Yr wyf yn credu hynny. 267 00:11:06,259 --> 00:11:07,610 Rwy'n eithaf siwr dyna'r un. 268 00:11:07,610 --> 00:11:11,050 >> TOMAS REIMERS: Fy hoff ganddo bod yn Dylunydd Cynllun Lliw bob amser. 269 00:11:11,050 --> 00:11:13,998 >> ALLISON BUCHHOLTZ-PA: Ooh. 270 00:11:13,998 --> 00:11:16,010 >> TOMAS REIMERS: Pa yn now-- 271 00:11:16,010 --> 00:11:16,860 >> ALLISON BUCHHOLTZ-PA: Ah, mae hyn yn hardd. 272 00:11:16,860 --> 00:11:18,818 >> TOMAS REIMERS: A ydych yn yn y bôn yn gallu ei ddweud, fel, 273 00:11:18,818 --> 00:11:21,700 Rwyf am tri lliw nesaf at ei gilydd. 274 00:11:21,700 --> 00:11:25,030 Ac yna gadewch i ni wneud rhywbeth neis. 275 00:11:25,030 --> 00:11:29,210 Ac yna gallwch gael enghraifft o'r hyn a allai fod yn edrych fel. 276 00:11:29,210 --> 00:11:32,470 Ac yna os ydych yn hofran dros unrhyw un nhw, mae'n rhoi gwerth hecs chi. 277 00:11:32,470 --> 00:11:35,010 >> Felly, yn union fel ffordd dda o ddechrau meddwl am cynlluniau lliw 278 00:11:35,010 --> 00:11:39,570 neu pa liwiau mewn gwefan allai fynd yn dda gyda'i gilydd. 279 00:11:39,570 --> 00:11:45,655 Oherwydd y gall hynny fod yn syndod Nid yw mor hawdd i ddewis wrth i chi feddwl. 280 00:11:45,655 --> 00:11:48,280 Ac yna y peth oer eraill Rwyf bob amser wedi dod o hyd am y wefan hon 281 00:11:48,280 --> 00:11:51,480 yw os byddwch yn taro Enghreifftiau, mae'n chi helpu dangos beth enghraifft wefan 282 00:11:51,480 --> 00:11:54,800 Gallai edrych fel defnyddio'r cynllun lliwiau. 283 00:11:54,800 --> 00:11:56,270 Beth bynnag. 284 00:11:56,270 --> 00:11:57,863 >> Yn ôl i'r CSS gwirioneddol. 285 00:11:57,863 --> 00:12:01,112 ALLISON BUCHHOLTZ-PA: Ond yn amlwg, rydym yn gwybod y gallai cyfeiriadau hyn fod yn ddefnyddiol. 286 00:12:01,112 --> 00:12:03,195 TOMAS REIMERS: Na, maent yn yn bendant fod yn ddefnyddiol. 287 00:12:03,195 --> 00:12:04,720 Felly, yr ail rheol, Allison? 288 00:12:04,720 --> 00:12:05,844 >> ALLISON BUCHHOLTZ-PA: Yeah. 289 00:12:05,844 --> 00:12:08,280 Yr ail reol yn unig sy'n cyfateb i'n ffont. 290 00:12:08,280 --> 00:12:11,520 Felly pwysau ffont yn unig fath o- felly byddai'r pwysau 291 00:12:11,520 --> 00:12:15,220 fod os ydych am gyfiawn, fel, arferol neu, fel, ffontiau deneuach, 292 00:12:15,220 --> 00:12:17,251 neu yn yr achos hwn, fel, beiddgar. 293 00:12:17,251 --> 00:12:17,750 Yr wyf yn anghofio. 294 00:12:17,750 --> 00:12:21,557 Beth yw'r os ydych eisiau iddo-- yno un deneuach na dim ond, fel, normal? 295 00:12:21,557 --> 00:12:24,140 TOMAS REIMERS: Nid wyf yn ei wneud mewn gwirionedd yn gwybod os oes un deneuach. 296 00:12:24,140 --> 00:12:24,680 ALLISON BUCHHOLTZ-UA: Yr wyf yn anghofio. 297 00:12:24,680 --> 00:12:26,300 Pwysau Felly ffont rydym fel arfer dim ond defnyddio ar gyfer print trwm. 298 00:12:26,300 --> 00:12:29,010 Os ydych chi eisiau mynd i mewn i 'n sylweddol hynny, rydym yn mynd i ddangos i chi. 299 00:12:29,010 --> 00:12:34,317 W3Schools Mae gan holl wahanol pethau y gallwch eu gwneud i ffontiau. 300 00:12:34,317 --> 00:12:36,900 Ond yn y bôn, os ydych chi erioed wedi eisiau i newid unrhyw beth am ffont, 301 00:12:36,900 --> 00:12:39,330 mae bob amser yn mynd i fod, fel, font-rhywbeth. 302 00:12:39,330 --> 00:12:43,450 Felly bydd yn cael ei debyg, font-deulu os ydych chi'n ceisio newid y math gwirioneddol. 303 00:12:43,450 --> 00:12:47,390 Bydd yn font-arddull os ydych yn am ei gwneud yn fel rhedol, 304 00:12:47,390 --> 00:12:49,710 neu italig, neu whatnot. 305 00:12:49,710 --> 00:12:53,570 Neu hyd yn oed font-liw, os roeddem eisiau newid hynny. 306 00:12:53,570 --> 00:12:55,621 >> TOMAS REIMERS: Yup. 307 00:12:55,621 --> 00:12:56,925 Fel y gallwch newid hynny. 308 00:12:56,925 --> 00:12:59,360 Ac yn fath o yn unig i ailadrodd yn awr, felly gallwch 309 00:12:59,360 --> 00:13:01,400 gweld bod gennym y detholydd i fyny yma. 310 00:13:01,400 --> 00:13:03,000 Mae gennym bresys cyrliog hyn. 311 00:13:03,000 --> 00:13:06,735 Ac yna mae gennym reolau amffinio gan hanner colon. 312 00:13:06,735 --> 00:13:08,100 A yw hynny'n gwneud synnwyr? 313 00:13:08,100 --> 00:13:09,130 Yeah? 314 00:13:09,130 --> 00:13:10,500 Cool. 315 00:13:10,500 --> 00:13:13,200 Felly, os yw hynny'n good-- 316 00:13:13,200 --> 00:13:14,424 >> ALLISON BUCHHOLTZ-PA: Back. 317 00:13:14,424 --> 00:13:17,590 TOMAS REIMERS: Gadewch i ni siarad yn benodol am yr hyn y math o ddewiswyr sydd gennym. 318 00:13:17,590 --> 00:13:19,790 'Achos ar hyn o bryd rydym wedi math o ychydig ddangosir tagiau. 319 00:13:19,790 --> 00:13:21,696 Ond fe allech chi guys yn ei weld gredadwy. 320 00:13:21,696 --> 00:13:23,570 Dywedwch fod gennych ddau baragraff ar dudalen a'ch 321 00:13:23,570 --> 00:13:26,087 am fod yn gallu i arddull un ond nid y llall, 322 00:13:26,087 --> 00:13:29,170 nad ydych eisiau i gyfyngu eich hun i gael i ddefnyddio gwahanol HTML gwirioneddol 323 00:13:29,170 --> 00:13:33,410 tagiau i roi arddulliau gwahanol iddynt. 324 00:13:33,410 --> 00:13:35,995 >> Felly mae gennym dri sylfaenol mathau o ddetholwyr. 325 00:13:35,995 --> 00:13:37,120 ALLISON BUCHHOLTZ-PA: Yeah. 326 00:13:37,120 --> 00:13:39,828 Felly mae gennym tag, sef yr hyn rydym wedi bod yn siarad am ar hyn o bryd. 327 00:13:39,828 --> 00:13:42,430 Felly dyna fath o fel eich corff neu t. 328 00:13:42,430 --> 00:13:46,280 Ac yna mae gennym ddosbarth, sef pan fyddwn yn ei ddiffinio yn ein ffeil CSS, 329 00:13:46,280 --> 00:13:49,907 mae bob amser yn mynd i gael ei dot, beth bynnag ydych am enw eich dosbarth i fod. 330 00:13:49,907 --> 00:13:51,490 A gall hyn fod yn berthnasol i bethau lluosog. 331 00:13:51,490 --> 00:13:54,610 332 00:13:54,610 --> 00:13:57,610 >> Dywedwch fod gennych bum baragraffau a dau o'r tri ohonynt 333 00:13:57,610 --> 00:14:00,580 Mae angen styled yr un fath, byddech yn gwneud cais i ddosbarth iddo. 334 00:14:00,580 --> 00:14:03,040 Ac mae hyn yn dim ond y ffordd yr ydym yn ei wneud. 335 00:14:03,040 --> 00:14:05,600 Byddwn yn rhoi enghraifft o chi lle mae hyn mewn gwirionedd yn dangos i fyny. 336 00:14:05,600 --> 00:14:11,030 Ond os oedd gennych efallai rhywfaint o tag p, ar ôl iddo, byddech yn ysgrifennu, 337 00:14:11,030 --> 00:14:14,170 dosbarth yn dychwelyd beth bynnag dosbarthiadau ydych am wneud cais iddo. 338 00:14:14,170 --> 00:14:19,280 Felly, beth bynnag detholwyr dosbarth yr ydym am i wneud cais i'r paragraff hwn penodol, 339 00:14:19,280 --> 00:14:21,300 gallem jyst ysgrifennu fel hyn. 340 00:14:21,300 --> 00:14:24,080 Wrth gwrs, yr wyf yn meddwl yn enghraifft yn ei gwneud yn llawer mwy cadarn. 341 00:14:24,080 --> 00:14:27,270 >> Yr un arall sydd gennym yw id, yr ydym yn dynodi 342 00:14:27,270 --> 00:14:29,707 gyda hash, neu punt, neu hashtag. 343 00:14:29,707 --> 00:14:30,790 TOMAS REIMERS: Octothorpe. 344 00:14:30,790 --> 00:14:32,430 ALLISON BUCHHOLTZ-PA: Octothorpe. 345 00:14:32,430 --> 00:14:34,550 Sy'n gweithio, hefyd. 346 00:14:34,550 --> 00:14:36,640 A dylai hyn yn un 'n sylweddol yn unigryw. 347 00:14:36,640 --> 00:14:39,880 Dylent yn berthnasol i un peth ar eich tudalen. 348 00:14:39,880 --> 00:14:43,820 Felly, a yw hynny'n paragraff penodol, neu ryw eitem mewn rhestr, neu beth bynnag, 349 00:14:43,820 --> 00:14:45,090 dylai hyn fod yn unigryw. 350 00:14:45,090 --> 00:14:48,730 Ac yn yr un modd yr ydym newydd yn dweud, fel, class = "class2 Dosbarth 1," 351 00:14:48,730 --> 00:14:51,577 Gall hyn yn unig fod id o beth bynnag sydd gennym. 352 00:14:51,577 --> 00:14:52,410 TOMAS REIMERS: Yeah. 353 00:14:52,410 --> 00:14:54,330 Felly, gadewch i ni yn bendant yn siarad am enghreifftiau yma. 354 00:14:54,330 --> 00:14:58,170 Ac Im 'jyst yn mynd i ddeifio yn syth yn ôl i mewn i'r cod. 355 00:14:58,170 --> 00:15:02,090 Felly, gadewch i ni edrych ar ein HTML. 356 00:15:02,090 --> 00:15:03,960 Ac felly rydym ar hyn o bryd gennym un paragraff. 357 00:15:03,960 --> 00:15:05,510 Mae hyn yn destun. 358 00:15:05,510 --> 00:15:09,151 Im 'jyst yn mynd i addasu hynny. "Mae hyn yn destun 1." 359 00:15:09,151 --> 00:15:11,150 Ac yna rydym yn mynd i cael "Mae hyn yn destun 2." 360 00:15:11,150 --> 00:15:12,525 >> ALLISON BUCHHOLTZ-PA: Ail un. 361 00:15:12,525 --> 00:15:13,540 TOMAS REIMERS: Yup. 362 00:15:13,540 --> 00:15:16,810 Felly mae gennym bellach "Mae hyn yn destun 2," yn iawn? 363 00:15:16,810 --> 00:15:21,560 Ac rydym yn mynd i weld bod os ydym yn ail-lwytho y dudalen, yr hyn yr ydym yn mynd i ddod o hyd i 364 00:15:21,560 --> 00:15:23,067 yw ein bod yn gonna find-- 365 00:15:23,067 --> 00:15:24,150 ALLISON BUCHHOLTZ-PA: Ooh. 366 00:15:24,150 --> 00:15:24,983 TOMAS REIMERS: Yeah. 367 00:15:24,983 --> 00:15:27,570 Rydym yn mynd i ddod o hyd i "Mae hyn yn destun 1, "ac" Mae hwn yn destun 2. " 368 00:15:27,570 --> 00:15:28,650 >> ALLISON BUCHHOLTZ-PA: A lliw melyn allan hyfryd. 369 00:15:28,650 --> 00:15:31,066 >> TOMAS REIMERS: A byddwch yn gweld bod ein detholydd ar hyn o bryd, 370 00:15:31,066 --> 00:15:34,940 sy'n berthnasol i p, neu'r paragraffau, yn effeithio ar ddau ohonynt, 371 00:15:34,940 --> 00:15:38,700 gan fod y ddau ohonynt yn cwrdd â'r amod eu bod eu bod yn ddau dag t. 372 00:15:38,700 --> 00:15:40,360 Mae hynny'n gwneud cyfanswm o synnwyr. 373 00:15:40,360 --> 00:15:43,340 Felly, y cwestiwn yw, yn dda, beth os ydym eisiau dim ond cael un? 374 00:15:43,340 --> 00:15:46,350 Felly, yn union fel Allison yn ei ddweud, mae gennym ddwy ffordd arall i wneud hynny. 375 00:15:46,350 --> 00:15:47,320 Dwi'n mynd i ddechrau id. 376 00:15:47,320 --> 00:15:48,405 >> ALLISON BUCHHOLTZ-PA: Gadewch i ni ddechrau gyda id. 377 00:15:48,405 --> 00:15:50,405 >> TOMAS REIMERS: A ddau o'r rhain yn rhinweddau. 378 00:15:50,405 --> 00:15:53,200 Felly priodoleddau yn bodoli mewn HTML. 379 00:15:53,200 --> 00:15:55,600 A'r hyn y maent yn ei rhywbeth yr ydych yn ychwanegu 380 00:15:55,600 --> 00:15:58,840 y tu mewn i'r tag sydd yn ar wahân i'r enw tag. 381 00:15:58,840 --> 00:16:01,301 Felly, gallwch gael priodoleddau lluosog. 382 00:16:01,301 --> 00:16:01,800 Yeah? 383 00:16:01,800 --> 00:16:03,950 >> ALLISON BUCHHOLTZ-UA: Roeddwn i'n jyst yn mynd i ddweud, o'ch enghraifft o PSET 7, 384 00:16:03,950 --> 00:16:06,650 os unrhyw un ohonoch yn ceisio alinio pethau i'r ganolfan, 385 00:16:06,650 --> 00:16:08,550 efallai y byddwch wedi defnyddio "Testun yn alinio = ganolfan." 386 00:16:08,550 --> 00:16:10,550 A ydych yn sylwi ei fod yn ôl pob tebyg Dylai fod wedi canolbwyntio 387 00:16:10,550 --> 00:16:12,650 eich testun neu eich bar llywio. 388 00:16:12,650 --> 00:16:15,499 Felly dyna dim ond hefyd yn nodwedd y gallech fod yn gyfarwydd â. 389 00:16:15,499 --> 00:16:18,040 TOMAS REIMERS: Mae 'na griw o briodoleddau y byddwch yn gweld. 390 00:16:18,040 --> 00:16:18,539 Yeah. 391 00:16:18,539 --> 00:16:21,250 Fel cyfeirio'n dda at PSET 7. 392 00:16:21,250 --> 00:16:23,150 Rydym wedi id. 393 00:16:23,150 --> 00:16:25,080 Gallwch hefyd gael dosbarth, pethau fel hyn. 394 00:16:25,080 --> 00:16:27,250 Gall tag sengl yn cael llawer o briodoleddau. 395 00:16:27,250 --> 00:16:33,140 Felly gan ddechrau gyda id, gadewch i ni rydym yn esgus yn awyddus i gael id o- Nid wyf yn gwybod. 396 00:16:33,140 --> 00:16:35,140 Byddwn yn ei alw'n arbennig, gan fod hyn yn un, rydym yn 397 00:16:35,140 --> 00:16:37,867 mynd i wneud beiddgar, ac tanlinellu, a beth bynnag. 398 00:16:37,867 --> 00:16:39,950 ALLISON BUCHHOLTZ-PA: Mae'n gonna fod yn super arbennig. 399 00:16:39,950 --> 00:16:42,360 TOMAS REIMERS: Felly hon un, mae gennym id arbennig. 400 00:16:42,360 --> 00:16:48,140 Felly, y ffordd i ddewis hynny, felly, yw yn main.css, yn hytrach na chael tag p, 401 00:16:48,140 --> 00:16:51,500 chi ei wneud #special, OK? 402 00:16:51,500 --> 00:16:55,538 A bod yn dewis y peth gyda id arbennig. 403 00:16:55,538 --> 00:16:57,295 A yw hyn yn gwneud synnwyr i bawb? 404 00:16:57,295 --> 00:16:57,920 GYNULLEIDFA: Yeah. 405 00:16:57,920 --> 00:16:59,110 TOMAS REIMERS: Cool. 406 00:16:59,110 --> 00:17:04,440 Felly nawr os ydym yn mynd yn ôl, byddwn yn see-- whoops. 407 00:17:04,440 --> 00:17:06,240 Yeah. 408 00:17:06,240 --> 00:17:09,460 Byddwn yn gweld ei fod dim ond yn dewis yr un gyda id arbennig. 409 00:17:09,460 --> 00:17:10,622 Yeah? 410 00:17:10,622 --> 00:17:11,900 Swnio'n oer. 411 00:17:11,900 --> 00:17:12,570 Ydw. 412 00:17:12,570 --> 00:17:15,456 >> GYNULLEIDFA: A all rhywbeth gael priodoli y ddau ddosbarth a id? 413 00:17:15,456 --> 00:17:16,359 >> TOMAS REIMERS: Ie. 414 00:17:16,359 --> 00:17:16,900 GYNULLEIDFA: OK. 415 00:17:16,900 --> 00:17:20,887 Ac yna beth sy'n digwydd os ydych wedyn yn rhoi mae rhai rheolau yn CSS hwnnw gwrthdaro? 416 00:17:20,887 --> 00:17:21,970 TOMAS REIMERS: Yn hollol. 417 00:17:21,970 --> 00:17:23,940 Rydym yn mynd yn bendant i siarad am hynny. 418 00:17:23,940 --> 00:17:31,890 Felly, yn union beth rydych yn ei gael ar, gallwch hefyd gael dosbarthiadau. 419 00:17:31,890 --> 00:17:36,380 Felly, gadewch i esgus fy mod wedi cael tri paragraffau ac yr wyf yn 420 00:17:36,380 --> 00:17:38,730 yn awyddus i arddull y cyntaf dau ond nid yw'r trydydd. 421 00:17:38,730 --> 00:17:42,850 Wel, efallai y bydd eich syniad yn gyntaf fod, yn dda, yr wyf yn Gallai dim ond rhoi id yr ail un. 422 00:17:42,850 --> 00:17:45,590 Ond nid ydych yn gallu, oherwydd bod id, yn union fel roedd Allison yn dweud, 423 00:17:45,590 --> 00:17:47,330 rhaid iddo fod yn unigryw. 424 00:17:47,330 --> 00:17:50,860 >> Felly, yn lle id, yr hyn yr ydych yn gallu defnyddio yn gallwch ddefnyddio dosbarth. 425 00:17:50,860 --> 00:17:57,880 A class-- yr hyn y mae'n caniatáu i chi ei wneud yn y bôn yn dweud, 426 00:17:57,880 --> 00:17:59,610 mae hyn yn perthyn fel rhan o grŵp. 427 00:17:59,610 --> 00:18:02,410 Yn yr achos hwn, mae ein grŵp yn cael ei alw'n Arbennig. 428 00:18:02,410 --> 00:18:06,500 A beth ydym yn mynd i wneud wedyn yw rydym yn mynd i say-- yn hytrach na bunt, 429 00:18:06,500 --> 00:18:08,070 rydyn ni'n mynd i ddefnyddio dot. 430 00:18:08,070 --> 00:18:08,740 OK? 431 00:18:08,740 --> 00:18:11,950 Ac yn sylwi bod y bunt a'r dot ond yn bodoli o fewn y ffeil CSS, 432 00:18:11,950 --> 00:18:12,797 Nid yw o fewn y HTML. 433 00:18:12,797 --> 00:18:13,880 ALLISON BUCHHOLTZ-PA: Ie. 434 00:18:13,880 --> 00:18:15,185 Gwahaniaeth pwysig. 435 00:18:15,185 --> 00:18:17,510 >> TOMAS REIMERS: Mae gen i Roedd cymaint o frwydr, 436 00:18:17,510 --> 00:18:23,990 oherwydd fy mod yn rhoi'r hash yn y HTML a yna dim ond yn teimlo'n dwp am amser hir. 437 00:18:23,990 --> 00:18:27,470 Dewch i weld sut y mae'n dewis ddau y rhai sydd â'r dosbarth hwnnw? 438 00:18:27,470 --> 00:18:28,210 Cool. 439 00:18:28,210 --> 00:18:29,950 >> Yn awr, gall pethau gael dosbarthiadau lluosog. 440 00:18:29,950 --> 00:18:32,790 Lets 'ddeud fy mod am wneud y cyntaf dau gefndir o melyn 441 00:18:32,790 --> 00:18:36,770 a'r ail dau wedi lliw ffont o las. 442 00:18:36,770 --> 00:18:37,270 OK. 443 00:18:37,270 --> 00:18:39,735 Dwi ddim yn gwybod pam byddwn i'n am wneud hynny, ond gallaf. 444 00:18:39,735 --> 00:18:42,401 >> ALLISON BUCHHOLTZ-PA: Ni allai'r ei argymell ar gyfer eich gwefan. 445 00:18:42,401 --> 00:18:43,880 Ond ar gyfer ein dibenion, bydd yn ei wneud. 446 00:18:43,880 --> 00:18:46,294 >> TOMAS REIMERS: Nid yw'n cynllun lliw da. 447 00:18:46,294 --> 00:18:49,210 ALLISON BUCHHOLTZ-PA: Wel, melyn a glas yw fy lliwiau ysgol uwchradd. 448 00:18:49,210 --> 00:18:50,947 Nid wyf yn gwybod, er. 449 00:18:50,947 --> 00:18:53,530 TOMAS REIMERS: Allison yn uchel Roedd gan yr ysgol gynllun lliw gwych. 450 00:18:53,530 --> 00:18:54,520 [Chwerthin] 451 00:18:54,520 --> 00:18:59,120 Felly, yna yr hyn y gallwn ei alw hyn yn Gadewch i ni alw this-- felly mae gennym Arbennig 452 00:18:59,120 --> 00:19:00,030 ac mae gennym Pretty. 453 00:19:00,030 --> 00:19:02,405 Awgrymaf, ar gyfer hyn, byddwch yn defnyddio enwau llawer mwy disgrifiadol. 454 00:19:02,405 --> 00:19:05,820 ALLISON BUCHHOLTZ-PA: Yeah, yr wyf byddai yn galw hyn, fel, melyn neu las. 455 00:19:05,820 --> 00:19:08,314 >> TOMAS REIMERS: Nid ydym yn wir yn gwneud gwefan go iawn, 456 00:19:08,314 --> 00:19:09,730 a dyna pam nad ydym yn gwneud hynny. 457 00:19:09,730 --> 00:19:11,521 Ond os ydych mewn gwirionedd Roedd gan wefan go iawn, chi 458 00:19:11,521 --> 00:19:16,220 Efallai y bydd rhaid, fel, pennawd erthygl, cynnwys erthygl, gair cyntaf, 459 00:19:16,220 --> 00:19:21,920 pethau fel hynny, sy'n caniatáu i chi fod yn llawer mwy disgrifiadol. 460 00:19:21,920 --> 00:19:23,550 Mae'r rhain yn wir yn union fel newidynnau. 461 00:19:23,550 --> 00:19:28,390 Dylid eu henwi mewn ffordd lle gallwch, like-- ie, fel y cyfryw. 462 00:19:28,390 --> 00:19:29,470 Perffaith. 463 00:19:29,470 --> 00:19:30,480 >> Felly lliw cefndir. 464 00:19:30,480 --> 00:19:35,920 Ac yna rydym yn mynd i say-- felly mae'r ffordd i newid lliw yn unig yw "lliw." 465 00:19:35,920 --> 00:19:38,412 Ac rydym yn mynd i'w wneud yn las. 466 00:19:38,412 --> 00:19:40,150 Mae hynny'n cŵl. 467 00:19:40,150 --> 00:19:42,640 Felly, yn awr mae gennym y cyntaf dau wedi arbennig. 468 00:19:42,640 --> 00:19:45,972 Un Nesaf yn mynd i wedi "class = 'n bert." 469 00:19:45,972 --> 00:19:49,180 ALLISON BUCHHOLTZ-PA: Ac yna wnewch chi helpu am ychwanegu "eithaf" i'r un canol. 470 00:19:49,180 --> 00:19:49,971 TOMAS REIMERS: Yup. 471 00:19:49,971 --> 00:19:52,970 Ac yna i'r un canol, i ychwanegu "n bert," beth sy'n digwydd 472 00:19:52,970 --> 00:19:56,880 yw 'ch jyst cael gofod. 473 00:19:56,880 --> 00:19:59,800 Felly y priodoledd dosbarth yn rhestr wahanu gofod- 474 00:19:59,800 --> 00:20:02,450 yr holl ddosbarthiadau sy'n gymwys i'r tag. 475 00:20:02,450 --> 00:20:02,959 OK? 476 00:20:02,959 --> 00:20:05,750 Dyw hi ddim fel hon yn perthyn i rhyw fath o ddosbarth arbennig o'r enw 477 00:20:05,750 --> 00:20:07,180 "Arbennig, gofod, 'n bert." 478 00:20:07,180 --> 00:20:10,870 Mae'n perthyn i ddau classes-- arbennig a 'n bert. 479 00:20:10,870 --> 00:20:12,492 Ie? 480 00:20:12,492 --> 00:20:14,360 Cool. 481 00:20:14,360 --> 00:20:17,010 >> Ac yna os edrychwn ar yr hyn sy'n digwydd, rydym yn 482 00:20:17,010 --> 00:20:21,850 mynd i weld bod un cyntaf wedi Cefndir melyn, testun du. 483 00:20:21,850 --> 00:20:22,450 Ail one-- 484 00:20:22,450 --> 00:20:26,160 >> ALLISON BUCHHOLTZ-PA: --has beiddgar Cefndir melyn gyda thestun glas. 485 00:20:26,160 --> 00:20:29,330 Ac mae ein un olaf yn unig y mae'r testun glas yr ydym yn neilltuo i iddo. 486 00:20:29,330 --> 00:20:30,870 >> TOMAS REIMERS: Cool? 487 00:20:30,870 --> 00:20:32,491 Sut mae dewiswyr yn gweithio? 488 00:20:32,491 --> 00:20:32,990 Awesome. 489 00:20:32,990 --> 00:20:34,720 >> ALLISON BUCHHOLTZ-PA: A ydym eisiau siarad am y gwrthdaro nawr te? 490 00:20:34,720 --> 00:20:35,780 >> TOMAS REIMERS: Felly yeah. 491 00:20:35,780 --> 00:20:36,310 Yn hollol. 492 00:20:36,310 --> 00:20:38,380 Felly beth sy'n digwydd os ydych yn fod â gwrthdaro, dde? 493 00:20:38,380 --> 00:20:44,740 Gadewch i esgus yr un cyntaf yn sefydlu rhywbeth like-- 494 00:20:44,740 --> 00:20:47,240 ALLISON BUCHHOLTZ-PA: Efallai yr un yma yn newid y cefndir? 495 00:20:47,240 --> 00:20:48,090 TOMAS REIMERS: Yeah. 496 00:20:48,090 --> 00:20:51,699 Felly, rydym yn mynd i wneud "eithaf" newid y cefndir i'r eog. 497 00:20:51,699 --> 00:20:54,740 ALLISON BUCHHOLTZ-PA: Rydych yn unig gyda holl liwiau gwych heddiw, Tomas. 498 00:20:54,740 --> 00:20:55,573 TOMAS REIMERS: Yeah. 499 00:20:55,573 --> 00:20:58,200 Gan fy mod yn dod o hyd allan y gallaf defnyddio eog fel lliw go iawn. 500 00:20:58,200 --> 00:21:00,270 Felly, rydym yn unig yn mynd i wneud hynny. 501 00:21:00,270 --> 00:21:01,770 Rwyf hefyd yn meddwl Sunset yn liw go iawn. 502 00:21:01,770 --> 00:21:03,103 GYNULLEIDFA: Sunset 'na lliw go iawn? 503 00:21:03,103 --> 00:21:04,572 ALLISON BUCHHOLTZ-PA: Gadewch i ni roi cynnig arni. 504 00:21:04,572 --> 00:21:07,735 TOMAS REIMERS: Ar ôl demo hwn dim ond oherwydd rhag ofn ei fod gwneud cawl, 505 00:21:07,735 --> 00:21:08,943 Dydw i ddim eisiau bod yn debugging. 506 00:21:08,943 --> 00:21:11,580 Felly, rydym yn gwybod eog 'na lliw go iawn. 507 00:21:11,580 --> 00:21:15,626 Felly unrhyw ddyfalu ar beth sy'n mynd i ddigwydd? 508 00:21:15,626 --> 00:21:17,522 >> ALLISON BUCHHOLTZ-PA: Unrhyw syniad? 509 00:21:17,522 --> 00:21:20,002 >> GYNULLEIDFA: [Anghlywadwy]. 510 00:21:20,002 --> 00:21:20,920 >> TOMAS REIMERS: Yeah. 511 00:21:20,920 --> 00:21:22,150 Felly, rydych wedi ei gael yn union gywir. 512 00:21:22,150 --> 00:21:24,930 Yn y bôn, mae'n cymryd y rheol diwethaf y cafodd ei roi. 513 00:21:24,930 --> 00:21:27,860 >> ALLISON BUCHHOLTZ-PA: Felly mae hyn yn ble daw rhaeadru i rym. 514 00:21:27,860 --> 00:21:31,080 >> TOMAS REIMERS: Felly cofiwch sut rydym Roedd gan fod rhaeadru dalennau arddull? 515 00:21:31,080 --> 00:21:33,660 Felly gan hynny, rydym yn fath o yn ei olygu bod gennym griw o reolau 516 00:21:33,660 --> 00:21:37,115 sy'n berthnasol ar ben ei gilydd, a gallant hefyd ddiystyru ei gilydd. 517 00:21:37,115 --> 00:21:39,380 >> ALLISON BUCHHOLTZ-PA: Felly beth bynnag yn y gwaelod 518 00:21:39,380 --> 00:21:41,540 Bydd gwrthwneud beth bynnag sydd ar y brig. 519 00:21:41,540 --> 00:21:45,842 Gallech gael rheolau sy'n gwbl negyddu rhywbeth ymlaen llaw. 520 00:21:45,842 --> 00:21:48,300 Dyna hefyd pam eich bod eisiau bod yn ofalus pan fyddwch chi steilio, 521 00:21:48,300 --> 00:21:51,465 felly nid ydych yn creu rheolau sy'n ydych ond yn gyfan gwbl gor-redol. 522 00:21:51,465 --> 00:21:53,340 >> TOMAS REIMERS: Neu efallai eich bod ddim eisiau trosysgrifo rheolau. 523 00:21:53,340 --> 00:21:53,920 >> ALLISON BUCHHOLTZ-PA: Neu efallai eich bod yn ei wneud. 524 00:21:53,920 --> 00:21:54,300 Ydw. 525 00:21:54,300 --> 00:21:57,175 >> TOMAS REIMERS: Esgus gennych ddosbarth sy'n berthnasol i'r rhan fwyaf o bethau, 526 00:21:57,175 --> 00:22:01,220 ond gadewch i ni ddweud eich bod am newid y lliw cefndir i goch a'r ffont 527 00:22:01,220 --> 00:22:03,140 pwysau i beiddgar gyfer y rhan fwyaf pethau, ond ar gyfer un, 528 00:22:03,140 --> 00:22:06,098 dim ond am i'r lliw cefndir i fod yn goch, ond eich bod am yr holl arall 529 00:22:06,098 --> 00:22:09,990 eiddo, gallech wneud rhywbeth fel "font-pwysau = normal," 530 00:22:09,990 --> 00:22:12,760 sydd wedyn byddai'n dadwneud bod newid beiddgar. 531 00:22:12,760 --> 00:22:14,480 Yeah? 532 00:22:14,480 --> 00:22:17,250 Unwaith eto, y ffordd orau, rwy'n credu Dywedodd Allison iddo, dim ond ymarfer. 533 00:22:17,250 --> 00:22:18,080 >> ALLISON BUCHHOLTZ-PA: Arbrofi. 534 00:22:18,080 --> 00:22:20,090 >> TOMAS REIMERS: Ymarfer, ymarfer, ymarfer, ac arbrofi. 535 00:22:20,090 --> 00:22:22,950 Rwy'n gwybod llawer o bobl yn meddwl CSS yn unig yw llawer o ddyfalu-a-wiriad 536 00:22:22,950 --> 00:22:25,580 ar ddiwedd y dydd, lle os rydych am ei wneud something-- fel, 537 00:22:25,580 --> 00:22:27,663 mae gennych syniad bras, ond byddwch yn dal yn ôl pob tebyg angen 538 00:22:27,663 --> 00:22:31,390 i roi cynnig arni i wneud yn siŵr eich bod yn gwybod sut mae'n edrych. 539 00:22:31,390 --> 00:22:34,482 >> GYNULLEIDFA: Pan fyddwch yn gwneud cais dosbarthiadau, yn fwy nag un 540 00:22:34,482 --> 00:22:37,339 at yr un paragraff neu adran, a yw'n 541 00:22:37,339 --> 00:22:39,505 waeth pa drefn y gallwch teipio i mewn i'r dyfyniadau? 542 00:22:39,505 --> 00:22:40,992 >> TOMAS REIMERS: Na, dim o gwbl. 543 00:22:40,992 --> 00:22:45,764 >> ALLISON BUCHHOLTZ-PA: Yr hyn sy'n bwysig yw y drefn o fewn eich dalen arddull CSS. 544 00:22:45,764 --> 00:22:47,430 GYNULLEIDFA: A allech chi ailadrodd y cwestiwn? 545 00:22:47,430 --> 00:22:50,680 TOMAS REIMERS: Oh. 546 00:22:50,680 --> 00:22:53,990 ALLISON BUCHHOLTZ-PA: O fewn dosbarth, pan fyddwch yn rhoi dosbarthiadau 547 00:22:53,990 --> 00:22:56,964 i rywbeth yn y HTML, yn ei wneud ots pa drefn maen nhw i mewn? 548 00:22:56,964 --> 00:22:58,130 Nid yw o bwys y gorchymyn. 549 00:22:58,130 --> 00:23:02,915 Beth sy'n bwysig yw trefn y detholwyr dosbarth o fewn eich CSS, 550 00:23:02,915 --> 00:23:04,306 o fewn eich dalen arddull. 551 00:23:04,306 --> 00:23:06,982 >> TOMAS REIMERS: Da Sain? 552 00:23:06,982 --> 00:23:08,532 >> ALLISON BUCHHOLTZ-PA: Lovely. 553 00:23:08,532 --> 00:23:11,539 >> TOMAS REIMERS: Ac yna rydym yn mynd i barhau i-- 554 00:23:11,539 --> 00:23:13,330 ALLISON BUCHHOLTZ-PA: Beth sydd gennym ni nesaf? 555 00:23:13,330 --> 00:23:14,245 Yr wyf yn anghofio. 556 00:23:14,245 --> 00:23:16,087 O, rydym yn unig rhaid i enghreifftiau. 557 00:23:16,087 --> 00:23:17,295 Ond rydym wedi fath o wneud hynny. 558 00:23:17,295 --> 00:23:18,990 Rydym wedi gwneud enghreifftiau ar y hedfan. 559 00:23:18,990 --> 00:23:20,540 >> TOMAS REIMERS: Rydym yn cael i cyfuno y detholwyr yn fuan. 560 00:23:20,540 --> 00:23:22,790 >> ALLISON BUCHHOLTZ-PA: O, rydym yn cael i gyfuno detholwyr. 561 00:23:22,790 --> 00:23:25,260 TOMAS REIMERS: Felly mae rhai enghreifftiau yw gennym 562 00:23:25,260 --> 00:23:29,630 # Bunt dog--, neu hashtag, neu octothorpe, neu beth bynnag 563 00:23:29,630 --> 00:23:32,050 yr ydych am ei alw that-- miniog. 564 00:23:32,050 --> 00:23:34,875 >> ALLISON BUCHHOLTZ-PA: ci Sharp. 565 00:23:34,875 --> 00:23:36,470 >> TOMAS REIMERS: Yna mae gennych .pets. 566 00:23:36,470 --> 00:23:39,059 567 00:23:39,059 --> 00:23:41,600 Rhywbeth Mae gan id o gi, dim ond un ci ar y dudalen. 568 00:23:41,600 --> 00:23:43,870 Rhywbeth Mae gan id o cath, dim ond un gath. 569 00:23:43,870 --> 00:23:45,665 Efallai y bydd llawer o anifeiliaid anwes ar y dudalen. 570 00:23:45,665 --> 00:23:47,570 Dyna pam rydym yn rhoi y dosbarthiadau. 571 00:23:47,570 --> 00:23:48,740 Mae gennych enghraifft o t. 572 00:23:48,740 --> 00:23:50,490 Ac yna felly un o'r enghraifft olaf, a oedd yn 573 00:23:50,490 --> 00:23:53,790 yn rhywbeth nad ydym wedi siarad amdano, yw'r hyn sy'n digwydd pan fyddwch yn eu cyfuno. 574 00:23:53,790 --> 00:23:54,580 Felly p.pets. 575 00:23:54,580 --> 00:23:57,510 576 00:23:57,510 --> 00:24:02,950 >> Felly, ar gyfer hynny, gadewch i ni fynd yn ôl at y cod a chyflwyno another-- yeah. 577 00:24:02,950 --> 00:24:04,290 Felly, yn ôl yma. 578 00:24:04,290 --> 00:24:04,850 >> ALLISON BUCHHOLTZ-PA: I teimlo fel hyn yn really-- 579 00:24:04,850 --> 00:24:08,105 fel jyst yn edrych drwy enghreifftiau sydd mewn gwirionedd yn ffordd i ddysgu hyn. 580 00:24:08,105 --> 00:24:09,360 Felly dyna beth rydym yn ei wneud. 581 00:24:09,360 --> 00:24:14,030 >> TOMAS REIMERS: Felly gadewch i ni rydym yn esgus Dim ond eisiau i ddewis testun 2, dde? 582 00:24:14,030 --> 00:24:16,530 Felly rydym nid yn bendant yn gallu gwneud hynny gydag id. 583 00:24:16,530 --> 00:24:19,620 Wel, gallem wneud hynny gyda id, ond nid oes rhaid iddo yn id. 584 00:24:19,620 --> 00:24:22,490 Gallwn ychwanegu un, ond gadewch i esgus nad oeddwn am ychwanegu un 585 00:24:22,490 --> 00:24:24,910 neu mae ganddo rywbeth arall yn barod. 586 00:24:24,910 --> 00:24:26,516 Ni allaf wneud hynny gyda hynny. 587 00:24:26,516 --> 00:24:28,870 Nid yw'r tag yn bendant yn unigryw, dde? 588 00:24:28,870 --> 00:24:30,670 Ac nid yw y dosbarth. 589 00:24:30,670 --> 00:24:32,314 Ond gallwch gyfuno pethau hyn. 590 00:24:32,314 --> 00:24:35,230 Lets 'ddeud ein bod am wneud rhywbeth sydd ond yn berthnasol i bethau sy'n 591 00:24:35,230 --> 00:24:39,420 yn cael y arbennig dosbarth ac sydd â'r dosbarth 'n bert. 592 00:24:39,420 --> 00:24:48,150 >> Felly, beth y gallwch ei wneud yw mewn main.css, gallwch ddweud, gadewch i gyntaf i ddileu hyn. 593 00:24:48,150 --> 00:24:50,240 Gallwch gyfuno hyn. 594 00:24:50,240 --> 00:24:51,430 Felly, gallwch chi ei wneud .special. 595 00:24:51,430 --> 00:24:52,110 Dim gofod. 596 00:24:52,110 --> 00:24:54,770 Dim ond .special.pretty. 597 00:24:54,770 --> 00:25:00,550 Beth mae hynny'n ei olygu yn rhywbeth sydd yn arbennig a 'n bert. 598 00:25:00,550 --> 00:25:01,900 A yw hynny'n gwneud synnwyr? 599 00:25:01,900 --> 00:25:04,190 Ac os ydym yn mynd yma, beth ydych yn mynd i weld 600 00:25:04,190 --> 00:25:09,734 yw'r rheol hon yn berthnasol yn unig i'r ail un, sydd wedi ddau o'r rheiny. 601 00:25:09,734 --> 00:25:11,400 A allwch chi wneud hynny am lawer o bethau. 602 00:25:11,400 --> 00:25:13,270 Gallwch say-- gadewch i ni esgus fy mod yn unig eisiau 603 00:25:13,270 --> 00:25:18,300 i wneud pethau sy'n cael y dosbarth 'n bert ac sydd hefyd yn tag paragraff. 604 00:25:18,300 --> 00:25:19,920 Felly p.pretty. 605 00:25:19,920 --> 00:25:23,585 Gadewch i esgus fy mod wedi cael rhywbeth 'n bert ar y corff tag. 606 00:25:23,585 --> 00:25:25,850 OK? 607 00:25:25,850 --> 00:25:28,490 Gallaf redeg hyn ac yr wyf yn gallu gweld ei fod yn unig 608 00:25:28,490 --> 00:25:32,720 mynd i wneud cais i bethau sydd yn paragraffau gyda'r dosbarth 'n bert. 609 00:25:32,720 --> 00:25:35,650 A gallwch gyfuno hyn, yn y bôn, gan fod llawer ag y dymunwch. 610 00:25:35,650 --> 00:25:38,580 Felly, gallwch eu rhoi at ei gilydd. 611 00:25:38,580 --> 00:25:39,604 A yw hynny'n gwneud synnwyr? 612 00:25:39,604 --> 00:25:41,770 ALLISON BUCHHOLTZ-PA: Felly Mae'r math hwn o fwy defnyddiol 613 00:25:41,770 --> 00:25:45,490 pryd, Tomas ei ddweud yn gynharach, efallai oes gennych wefan cymhleth iawn, 614 00:25:45,490 --> 00:25:48,050 ac yr ydych eisoes gennych lawer rheolau hyn ysgrifenedig, 615 00:25:48,050 --> 00:25:51,170 ac ch jyst angen i ni cyfuno dau o o'r blaen. 616 00:25:51,170 --> 00:25:55,350 Fel yn lle ysgrifennu cyfan dewisydd newydd a newidiol yno, 617 00:25:55,350 --> 00:25:58,592 gallwch gyfuno yn eu lle mae'n gorgyffwrdd. 618 00:25:58,592 --> 00:26:00,670 >> TOMAS REIMERS: Neu chi Gallai ddod o hyd out-- weithiau 619 00:26:00,670 --> 00:26:04,290 mae un dosbarth sy'n yn gwneud lliw ffont yn hoffi glas, 620 00:26:04,290 --> 00:26:06,740 ac mae dosbarth arall sydd yn gwneud y glas cefndir. 621 00:26:06,740 --> 00:26:07,840 Ac na fydd yn unig yn gweithio. 622 00:26:07,840 --> 00:26:10,924 Felly, byddwch yn ysgrifennu achos arbennig, ble, like-- ond os oes ganddo ddau, yr hyn yr ydych chi'n 623 00:26:10,924 --> 00:26:13,548 mynd i'w wneud yw eich bod yn mynd i yn gwneud hyn yn un cysgod yma o las 624 00:26:13,548 --> 00:26:15,310 ac mae hyn yn un yma cysgod arall o las. 625 00:26:15,310 --> 00:26:15,580 Iawn? 626 00:26:15,580 --> 00:26:17,955 >> ALLISON BUCHHOLTZ-PA: Da ar gyfer y mathau hynny o eithriadau. 627 00:26:17,955 --> 00:26:21,220 TOMAS REIMERS: Felly, er mwyn meddwl am broblemau 628 00:26:21,220 --> 00:26:25,000 a allai godi pan fyddwch yn eu cyfuno. 629 00:26:25,000 --> 00:26:27,020 Cool. 630 00:26:27,020 --> 00:26:29,692 Felly, yn ôl at ein cyflwyniad. 631 00:26:29,692 --> 00:26:31,400 ALLISON BUCHHOLTZ-PA: Rydym yn bron yno. 632 00:26:31,400 --> 00:26:34,022 TOMAS REIMERS: Ac mae'n wedi rhoi'r gorau i gysylltu. 633 00:26:34,022 --> 00:26:36,494 ALLISON BUCHHOLTZ-PA: O, na. 634 00:26:36,494 --> 00:26:39,125 ALLISON BUCHHOLTZ-PA: CS yn y swyddfa, y rhyngrwyd yn mynd i lawr. 635 00:26:39,125 --> 00:26:40,360 O, yr eironi. 636 00:26:40,360 --> 00:26:45,620 >> TOMAS REIMERS: Felly yn ffodus, gallwn cyflwyno heb y rhyngrwyd, mae'n debyg, 637 00:26:45,620 --> 00:26:47,380 gan fod gennym yr holl sleidiau yma. 638 00:26:47,380 --> 00:26:49,304 Felly, gadewch i ni siarad am y perthynas o dagiau. 639 00:26:49,304 --> 00:26:50,470 ALLISON BUCHHOLTZ-PA: Iawn. 640 00:26:50,470 --> 00:26:52,660 Felly unig fath o fynd i ffwrdd o'r hyn a ddywedodd Tomas, 641 00:26:52,660 --> 00:26:54,180 mae hyn yn unig ffordd arall i wneud hynny. 642 00:26:54,180 --> 00:26:57,840 Felly, mae gennym rai rhiant detholydd gyda detholydd phlentyn. 643 00:26:57,840 --> 00:27:02,815 Felly, yn yr enghraifft hon yma, mae gennym rai corff gyda navbar dosbarth, botwm dosbarth. 644 00:27:02,815 --> 00:27:03,315 Ah. 645 00:27:03,315 --> 00:27:03,990 >> TOMAS REIMERS: O, sori. 646 00:27:03,990 --> 00:27:06,180 >> ALLISON BUCHHOLTZ-PA: A yn y bôn, beth mae hyn yn ei olygu 647 00:27:06,180 --> 00:27:11,070 yn dewis pob un o'r plant, fel pob un o'r mathau hyn o ddetholwyr, 648 00:27:11,070 --> 00:27:13,040 o fewn y rhiant dewisydd. 649 00:27:13,040 --> 00:27:16,004 A'r rhai yw'r unig rai byth yn mynd i wneud cais i. 650 00:27:16,004 --> 00:27:17,755 Nid wyf yn gwybod os ydych yn gael ffordd well o- 651 00:27:17,755 --> 00:27:19,504 TOMAS REIMERS: Felly yr wyf yn dyfalu y ffordd i feddwl 652 00:27:19,504 --> 00:27:22,440 am hyn yw cofio cyn sut rydym yn fath o hoffi eu rhoi at ei gilydd. 653 00:27:22,440 --> 00:27:26,340 Ac yna mae hynny'n golygu un elfen sy'n cyfateb pob un o'r rhain. 654 00:27:26,340 --> 00:27:29,530 Beth mae hyn yn ei ddweud yw, yr wyf yn am i chi i gyd-fynd popeth 655 00:27:29,530 --> 00:27:33,220 o fewn some-- Rwyf am chi i ddod o hyd i dewisydd. 656 00:27:33,220 --> 00:27:35,670 Ac yna o fewn hynny, yr wyf am chi i gyd-fynd pethau newydd. 657 00:27:35,670 --> 00:27:36,170 Iawn? 658 00:27:36,170 --> 00:27:40,900 Felly, yn CSS, mae'n ymwneud math o y gallu i gyd-fynd eitemau hyn. 659 00:27:40,900 --> 00:27:43,050 A gallwch geisio cyfateb eitemau o fewn eitemau eraill. 660 00:27:43,050 --> 00:27:46,510 >> Felly, gadewch i ni ei wneud mewn gwirionedd enghraifft, ac yr ydym yn meddwl y bydd hynny egluro. 661 00:27:46,510 --> 00:27:53,090 Felly, gadewch i esgus gennym arbennig, arbennig 'n bert, beth bynnag. 662 00:27:53,090 --> 00:27:55,690 Ac yna mae gennym gyswllt, OK? 663 00:27:55,690 --> 00:27:59,780 664 00:27:59,780 --> 00:28:02,370 Felly cofiwch, mae cysylltiad. 665 00:28:02,370 --> 00:28:03,900 Dyw hi ddim yn mynd i fynd i unrhyw le. 666 00:28:03,900 --> 00:28:11,500 Ac rydym yn mynd i roi iddo y cyswllt dosbarth, yr wyf yn dyfalu. 667 00:28:11,500 --> 00:28:13,335 Gadewch i ni roi y class-- rhoi syniad i mi. 668 00:28:13,335 --> 00:28:14,460 ALLISON BUCHHOLTZ-PA: Cool. 669 00:28:14,460 --> 00:28:16,420 TOMAS REIMERS: Coo-- gadewch i ni mynd iddo y dosbarth 'n bert. 670 00:28:16,420 --> 00:28:16,930 Pam ddim? 671 00:28:16,930 --> 00:28:17,971 >> ALLISON BUCHHOLTZ-PA: OK. 672 00:28:17,971 --> 00:28:23,040 TOMAS REIMERS: Felly pethau ar hyn o bryd 'n bert 673 00:28:23,040 --> 00:28:26,000 yn mynd i wneud y cefndir glas, lliw cefndir o eogiaid. 674 00:28:26,000 --> 00:28:27,969 Mae hynny'n gwneud synnwyr. 675 00:28:27,969 --> 00:28:28,760 Ac os ydym yn ei wneud this-- 676 00:28:28,760 --> 00:28:29,620 >> ALLISON BUCHHOLTZ-PA: Ydych chi eisiau ychwanegu testun 677 00:28:29,620 --> 00:28:31,078 felly yr hyperddolen mewn gwirionedd yn dangos i fyny? 678 00:28:31,078 --> 00:28:35,088 TOMAS REIMERS: Bod fyddai galwad da. 679 00:28:35,088 --> 00:28:37,921 ALLISON BUCHHOLTZ-PA: 'iawn Achos yn awr rydym yn unig gonna cael dim byd. 680 00:28:37,921 --> 00:28:39,690 TOMAS REIMERS: Felly mae hwn yn ddolen. 681 00:28:39,690 --> 00:28:42,202 "Mae hwn yn gyswllt." 682 00:28:42,202 --> 00:28:45,820 O, ac mae hyn yn mynd i fod yn ddolen gyswllt arall. 683 00:28:45,820 --> 00:28:47,280 Gadewch i ni roi y dosbarth "cool." 684 00:28:47,280 --> 00:28:50,295 Rydych chi'n iawn. 685 00:28:50,295 --> 00:28:50,795 Cool. 686 00:28:50,795 --> 00:28:53,590 687 00:28:53,590 --> 00:28:56,010 Felly, ar hyn o bryd rydym yn mynd i chrafangia hyn. 688 00:28:56,010 --> 00:28:57,269 Rydym yn mynd i daflu un. 689 00:28:57,269 --> 00:28:59,060 Mae gennym un yn y tag arbennig, ac rydym hefyd yn 690 00:28:59,060 --> 00:29:01,150 yn mynd i gael un yn y tag 'n bert. 691 00:29:01,150 --> 00:29:05,449 Ac yn hyn o bryd beth yr ydym yn mynd i wneud yw ein bod yn mynd i wneud cool-- 692 00:29:05,449 --> 00:29:06,490 beth ydym am iddo ei wneud? 693 00:29:06,490 --> 00:29:10,347 694 00:29:10,347 --> 00:29:12,180 ALLISON BUCHHOLTZ-PA: Allwn ni wneud yn fwy? 695 00:29:12,180 --> 00:29:13,800 TOMAS REIMERS: Gadewch i ni roi cynnig ffin. 696 00:29:13,800 --> 00:29:14,840 ALLISON BUCHHOLTZ-PA: Gallem ffinio. 697 00:29:14,840 --> 00:29:15,673 TOMAS REIMERS: Yeah. 698 00:29:15,673 --> 00:29:18,560 Felly, rydym yn mynd i wneud rhywbeth fel, yw-- y ffin ac rydym yn 699 00:29:18,560 --> 00:29:20,971 mynd i esbonio hyn i gyd mewn eiliad. 700 00:29:20,971 --> 00:29:21,470 Ar gyfer now-- 701 00:29:21,470 --> 00:29:24,592 >> ALLISON BUCHHOLTZ-PA: I'r model bocs. 702 00:29:24,592 --> 00:29:27,300 TOMAS REIMERS: Ond am nawr, rydym yn jyst yn mynd i roi cynnig ffin. 703 00:29:27,300 --> 00:29:29,580 Felly beth mae hynny'n ei olygu yw eich bod yn mynd i weld y cysylltiadau hyn. 704 00:29:29,580 --> 00:29:32,788 Ac ydych chi'n mynd i weld bod ganddynt hyn, fel, borderi duon hyll, a oedd yn 705 00:29:32,788 --> 00:29:33,820 yn cŵl. 706 00:29:33,820 --> 00:29:34,500 >> ALLISON BUCHHOLTZ-PA: Mae ein gwefan mor bert. 707 00:29:34,500 --> 00:29:35,333 >> TOMAS REIMERS: Yeah. 708 00:29:35,333 --> 00:29:38,930 Mae ein gwefan yn awesome. 709 00:29:38,930 --> 00:29:41,585 Felly dau rhain yn gysylltiadau, ac maent yn ymddangos. 710 00:29:41,585 --> 00:29:44,160 Nawr, gadewch i esgus i mi Dim ond eisiau gwneud hyn 711 00:29:44,160 --> 00:29:50,072 os nad oedd o fewn rywbeth a oedd â chefndir o eog. 712 00:29:50,072 --> 00:29:52,280 Felly cofiwch fod yr un yma Mae gan gefndir o eog, 713 00:29:52,280 --> 00:29:54,000 oherwydd ei fod o ddosbarth 'n bert. 714 00:29:54,000 --> 00:29:59,777 >> Ond rydym yn awyddus i ddweud mai dim ond oeri sydd yn y dosbarth arbennig, nid yn y dosbarth 715 00:29:59,777 --> 00:30:02,890 'n bert, dylai gael y ffin. 716 00:30:02,890 --> 00:30:12,549 Wel, beth y gallwch ei wneud yw i chi gallu dweud, .special, gofod, .cool. 717 00:30:12,549 --> 00:30:15,590 A beth mae hynny'n ei wneud, pan fyddwch yn meddwl am y peth, a yw'n ei ddweud yn y bôn, 718 00:30:15,590 --> 00:30:19,530 OK, dod o hyd i bopeth i mi sy'n cyfateb arbennig. 719 00:30:19,530 --> 00:30:24,104 Yna, o fewn y tagiau hynny, dod o hyd i mi bopeth sydd yn cŵl. 720 00:30:24,104 --> 00:30:27,270 ALLISON BUCHHOLTZ-PA: Felly ffordd arall a allai fod yn dda i feddwl am hyn, 721 00:30:27,270 --> 00:30:29,810 gan ddod ag ef yn ôl i C, yn yn union fel y syniad o gwmpas. 722 00:30:29,810 --> 00:30:34,020 Felly, pan fyddwch yn cael rhywfaint o detholydd, fel y rhai 723 00:30:34,020 --> 00:30:38,460 ein bod ni wedi bod yn gweithio am cyn hyn, eich tudalen we gyfan, eich holl HTML 724 00:30:38,460 --> 00:30:40,180 o fewn eich cwmpas, dde? 725 00:30:40,180 --> 00:30:43,090 Ond pan mae gennym y rhain perthynas rhiant-plentyn, 726 00:30:43,090 --> 00:30:47,130 'i' fel os ydych yn culhau i lawr lle ydych yn chwilio i le penodol, 727 00:30:47,130 --> 00:30:50,540 fel pe, fel, rydym yn edrych yn swyddogaeth benodol yn lle hynny 728 00:30:50,540 --> 00:30:52,007 o'n ffeil gyfan. 729 00:30:52,007 --> 00:30:55,090 GYNULLEIDFA: Felly, gyda hynny mewn golwg, byddai mae wedi yn bwysig pe bai gennym changed-- 730 00:30:55,090 --> 00:30:56,423 ALLISON BUCHHOLTZ-PA: Y gorchymyn? 731 00:30:56,423 --> 00:30:59,320 GYNULLEIDFA: --Yr dosbarth mewn CSS i .cool, gofod, .special? 732 00:30:59,320 --> 00:31:01,153 ALLISON BUCHHOLTZ-PA: Ie, oherwydd bryd hynny 733 00:31:01,153 --> 00:31:04,420 Byddai dweud, cwmpas i popeth sydd oer, 734 00:31:04,420 --> 00:31:07,235 ac yna edrych ar yr hyn has-- Yr wyf yn golygu, fel, yn yr achos hwn, 735 00:31:07,235 --> 00:31:08,860 Nid wyf yn credu y byddai wedi newid hynny. 736 00:31:08,860 --> 00:31:10,318 >> TOMAS REIMERS: Os ydym wedi dweud beth? 737 00:31:10,318 --> 00:31:10,906 Mae'n ddrwg gennym. 738 00:31:10,906 --> 00:31:12,660 >> ALLISON BUCHHOLTZ-PA: Os ydym cwmpas iddo oeri ac yna 739 00:31:12,660 --> 00:31:14,550 chwilio am bethau allan o arbennig, byddai'n yr un fath, mewn gwirionedd. 740 00:31:14,550 --> 00:31:16,260 >> TOMAS REIMERS: Felly ni fyddai'n. 741 00:31:16,260 --> 00:31:16,590 >> ALLISON BUCHHOLTZ-PA: Ni fyddai? 742 00:31:16,590 --> 00:31:17,590 O, oh yn dda. 743 00:31:17,590 --> 00:31:18,090 Yr wyf yn anghywir. 744 00:31:18,090 --> 00:31:21,480 >> TOMAS REIMERS: Felly y rheswm 'i' different-- mistake-- cyffredin 745 00:31:21,480 --> 00:31:27,140 yw y hyn o bryd yn unig y ddolen wedi oeri, dde? 746 00:31:27,140 --> 00:31:32,176 Amcana fy nghwestiwn i chi guys yw, yr hyn ar y dudalen hon yn cael ei gyfateb gan .cool? 747 00:31:32,176 --> 00:31:35,984 748 00:31:35,984 --> 00:31:38,340 Mae dau tagiau yma, dde? 749 00:31:38,340 --> 00:31:39,770 Pa un yw hwn ac mae hyn yn un. 750 00:31:39,770 --> 00:31:40,590 Mae'r ddau yn cyd-fynd yn oer. 751 00:31:40,590 --> 00:31:42,200 Nid oes unrhyw beth arall yn ei wneud. 752 00:31:42,200 --> 00:31:46,460 Felly, os ydych ddywedodd, .cool, gofod, .special, yr hyn yr ydych chi'n mynd i ddweud yw, 753 00:31:46,460 --> 00:31:48,824 o fewn y tagiau hyn, yr hyn sy'n arbennig? 754 00:31:48,824 --> 00:31:49,865 ALLISON BUCHHOLTZ-PA: EM. 755 00:31:49,865 --> 00:31:51,800 Dyna beth iddo-- iawn. 756 00:31:51,800 --> 00:31:52,310 Oherwydd mae fel dim ond rhywbeth yma. 757 00:31:52,310 --> 00:31:53,310 >> TOMAS REIMERS: Felly mae'n dewis dim. 758 00:31:53,310 --> 00:31:56,530 >> ALLISON BUCHHOLTZ-PA: Tra gyda arbennig, rydym yn o fewn y tagiau hyn yma. 759 00:31:56,530 --> 00:31:57,971 >> TOMAS REIMERS: Y rhai a hynny. 760 00:31:57,971 --> 00:31:58,512 GYNULLEIDFA: OK. 761 00:31:58,512 --> 00:31:58,920 Felly tagiau rhai o'r blaenslaes? 762 00:31:58,920 --> 00:31:59,740 >> TOMAS REIMERS: Ie. 763 00:31:59,740 --> 00:32:01,150 A yw hynny'n gwneud synnwyr? 764 00:32:01,150 --> 00:32:03,685 Sut mae'n bôn ceisio gyfyngu cwmpas. 765 00:32:03,685 --> 00:32:04,810 ALLISON BUCHHOLTZ-PA: Yeah. 766 00:32:04,810 --> 00:32:06,870 Rwy'n credu bod hynny'n fwy na thebyg y ffordd hawsaf i feddwl am y peth. 767 00:32:06,870 --> 00:32:09,270 >> TOMAS REIMERS: Felly, rydym yn dod o hyd hyn, a gwelsom hyn yn y ddau cyfateb arbennig. 768 00:32:09,270 --> 00:32:11,400 Ac yna rydym yn gofyn, o fewn guys hyn, beth cŵl? 769 00:32:11,400 --> 00:32:12,941 Ac o fewn yr un yma, yn oer yma yn un o. 770 00:32:12,941 --> 00:32:14,500 O fewn yr un yma, nid oes dim yn cŵl. 771 00:32:14,500 --> 00:32:16,250 Felly dyma'r unig tag sydd ar ôl. 772 00:32:16,250 --> 00:32:20,112 >> ALLISON BUCHHOLTZ-PA: Tra oer yn unig o fewn y tag yn hyn yno. 773 00:32:20,112 --> 00:32:21,070 TOMAS REIMERS: Yn union. 774 00:32:21,070 --> 00:32:22,403 A beth sy'n arbennig o fewn hynny? 775 00:32:22,403 --> 00:32:22,930 Dim byd. 776 00:32:22,930 --> 00:32:25,270 Yn awr, yr hyn y byddaf yn ei ddweud yw os nad oedd lle, 777 00:32:25,270 --> 00:32:29,880 ydych yn gofyn beth sy'n oer ac yn special-- neu beth eithaf ac arbennig, dde? 778 00:32:29,880 --> 00:32:35,370 Os byddwch yn dweud .special.pretty, dyna yr un fath ag .pretty.special. 779 00:32:35,370 --> 00:32:39,220 >> Oherwydd yr hyn gwared ar y gofod yn ofyn yw, pan ddywedwch .special, 780 00:32:39,220 --> 00:32:40,970 ydych yn gofyn, OK, pa rai sy'n arbennig? 781 00:32:40,970 --> 00:32:43,780 Ac yna o'r rheiny, a oedd yn rhai hefyd yn eithaf, 782 00:32:43,780 --> 00:32:47,010 sydd yr un fath, yn ramadegol, fel ofyn, beth 'n bert, 783 00:32:47,010 --> 00:32:49,500 ac yna o'r rheini, beth sy'n arbennig hefyd? 784 00:32:49,500 --> 00:32:50,000 Iawn? 785 00:32:50,000 --> 00:32:53,099 Mae'n y gwahaniaeth o beth sydd o fewn yr hyn sydd. 786 00:32:53,099 --> 00:32:53,640 GYNULLEIDFA: OK. 787 00:32:53,640 --> 00:32:54,473 TOMAS REIMERS: Yeah. 788 00:32:54,473 --> 00:32:56,670 789 00:32:56,670 --> 00:32:58,030 Awesome. 790 00:32:58,030 --> 00:33:00,426 Felly, gyda hynny mewn golwg then-- 791 00:33:00,426 --> 00:33:01,800 >> ALLISON BUCHHOLTZ-UA: Yr wyf yn meddwl ein ddiwethaf beth yw (YN FFANSI BRITISH Accent) 792 00:33:01,800 --> 00:33:02,510 y model bocs. 793 00:33:02,510 --> 00:33:05,992 >> TOMAS REIMERS: Y box-- [chuckles] Rwyf wrth fy modd y ffordd Allison yn dweud bod. 794 00:33:05,992 --> 00:33:06,950 Felly mae'r model blwch peth. 795 00:33:06,950 --> 00:33:09,644 >> ALLISON BUCHHOLTZ-PA: Dim ond yn cael bocs, byddaf yn eich model bocs. 796 00:33:09,644 --> 00:33:11,310 TOMAS REIMERS: Felly gadewch i ni siarad am hynny. 797 00:33:11,310 --> 00:33:14,070 Felly, ar hyn o bryd, rydym wedi treulio llawer o amser yn siarad am detholwyr. 798 00:33:14,070 --> 00:33:16,944 Erbyn hyn, rydych guys yn ôl pob tebyg, fel, meistr o selectors-- eich bod yn gwybod, 799 00:33:16,944 --> 00:33:21,510 sut i ddewis yn union y cynnwys hwnnw rydych am ei drin ar eich sgrîn. 800 00:33:21,510 --> 00:33:24,740 >> Felly, yn awr y cwestiwn yw, sut yn union y gallwch ei drin hyn? 801 00:33:24,740 --> 00:33:27,010 Felly, yr wyf yn dyfalu y mwyaf sylfaenol ffordd i feddwl am hynny 802 00:33:27,010 --> 00:33:30,294 yn, wel, beth yn union yn elfen yn CSS? 803 00:33:30,294 --> 00:33:32,585 Rydym wedi treulio llawer o amser siarad am, beth yw tag, 804 00:33:32,585 --> 00:33:36,140 neu beth yw'r mwyaf sylfaenol cynrychiolaeth tag? 805 00:33:36,140 --> 00:33:39,870 806 00:33:39,870 --> 00:33:45,170 >> Ffordd dda i feddwl am hynny yw, pa siâp yn eog? 807 00:33:45,170 --> 00:33:47,295 Pa siâp yw, fel, yr eog-lliw cefndir? 808 00:33:47,295 --> 00:33:47,880 >> GYNULLEIDFA: Mae'n petryal. 809 00:33:47,880 --> 00:33:49,040 >> TOMAS REIMERS: Mae'n petryal, dde? 810 00:33:49,040 --> 00:33:50,956 >> ALLISON BUCHHOLTZ-PA: Nid oedd cwestiwn tric. 811 00:33:50,956 --> 00:33:51,870 [Chwerthin] 812 00:33:51,870 --> 00:33:54,670 >> TOMAS REIMERS: Ddim yn ceisio i twyllo chi guys hyn yn hwyr. 813 00:33:54,670 --> 00:33:57,510 Felly, rydym wedi petryal hwn. 814 00:33:57,510 --> 00:33:59,140 Ac mae'r tag yn p, dde? 815 00:33:59,140 --> 00:34:02,280 Felly mae hynny'n rhoi i ni yn dda cred fod y paragraff 816 00:34:02,280 --> 00:34:07,440 yn cael ei gynrychioli fel petryal, ar lleiaf ym meddwl y porwr, a oedd yn 817 00:34:07,440 --> 00:34:08,715 y mae. 818 00:34:08,715 --> 00:34:11,423 >> ALLISON BUCHHOLTZ-UA: Yr wyf yn golygu, borwyr fel arfer yn hirsgwar, 819 00:34:11,423 --> 00:34:13,440 felly mae'n gwneud synnwyr. 820 00:34:13,440 --> 00:34:18,750 >> TOMAS REIMERS: Y syniad yma yw bod pob un o'r tagiau fewn CSS 821 00:34:18,750 --> 00:34:21,790 yn cael eu cynrychioli fel petryal. 822 00:34:21,790 --> 00:34:25,699 A phob petryal wedi pedwar rhannau yn ôl y CSS, OK? 823 00:34:25,699 --> 00:34:27,830 Mae gennych y cynnwys gwirioneddol. 824 00:34:27,830 --> 00:34:29,644 Dyna lle mae'r testun yn gorwedd. 825 00:34:29,644 --> 00:34:30,470 >> ALLISON BUCHHOLTZ-PA: Efallai eich llun. 826 00:34:30,470 --> 00:34:31,303 >> TOMAS REIMERS: Yeah. 827 00:34:31,303 --> 00:34:33,860 Mae gennych padin, sef dim ond rhyw fath o le gwyn. 828 00:34:33,860 --> 00:34:35,085 Yna mae gennych ffin. 829 00:34:35,085 --> 00:34:37,710 Ac yna mae gennych elw, a oedd yn yw gofod gwyn y tu allan i hynny. 830 00:34:37,710 --> 00:34:39,460 Felly mae hynny'n gwneud unrhyw synnwyr i unrhyw un, felly rydym yn 831 00:34:39,460 --> 00:34:42,500 mynd i siarad am hynny am eiliad. 832 00:34:42,500 --> 00:34:47,570 Felly dde yma, yr hyn rydym yn mynd i'w wneud yn rydym yn mynd i greu rhai divs, OK? 833 00:34:47,570 --> 00:34:48,420 Esgusodwch fi tra I-- 834 00:34:48,420 --> 00:34:51,506 >> ALLISON BUCHHOLTZ-UA: Yr wyf yn teimlo yn hoffi dylem roi darlun 'n giwt i mewn. 835 00:34:51,506 --> 00:34:52,520 >> TOMAS REIMERS: Yr ydym yn bendant dylai. 836 00:34:52,520 --> 00:34:53,389 >> ALLISON BUCHHOLTZ-PA: Rwy'n teimlo fel pawb 837 00:34:53,389 --> 00:34:54,870 Gallai budd o darlun 'n giwt, i gyd. 838 00:34:54,870 --> 00:34:56,774 >> TOMAS REIMERS: Allwn ni gyd yn elwa a-- 839 00:34:56,774 --> 00:34:57,648 >> GYNULLEIDFA: Yeah, yn sicr. 840 00:34:57,648 --> 00:34:58,790 TOMAS REIMERS: OK, oer. 841 00:34:58,790 --> 00:35:02,254 Felly, dylem roi 'n giwt llun yn rhywle. 842 00:35:02,254 --> 00:35:05,295 ALLISON BUCHHOLTZ-UA: Yr wyf yn teimlo fel Efallai y bunny cute yn ddefnyddiol ar hyn o bryd. 843 00:35:05,295 --> 00:35:06,190 TOMAS REIMERS: Cadarn. 844 00:35:06,190 --> 00:35:06,950 ALLISON BUCHHOLTZ-PA: Diwedd yr wythnos. 845 00:35:06,950 --> 00:35:07,390 Cael rhywbeth adorab-- 846 00:35:07,390 --> 00:35:08,520 >> TOMAS REIMERS: Sut bout a gath fach? 847 00:35:08,520 --> 00:35:09,220 >> ALLISON BUCHHOLTZ-PA: Mae gath fach yn gweithio, hefyd. 848 00:35:09,220 --> 00:35:11,300 >> TOMAS REIMERS: Cool, oherwydd mae 'na safle ar gyfer hynny. 849 00:35:11,300 --> 00:35:12,300 Mae'n cael ei alw PlaceKitten. 850 00:35:12,300 --> 00:35:14,719 ALLISON BUCHHOLTZ-PA: Mae hynny'n wych. 851 00:35:14,719 --> 00:35:15,510 TOMAS REIMERS: Ie. 852 00:35:15,510 --> 00:35:18,040 ALLISON BUCHHOLTZ-PA: Dim ond ar gyfer, fel, delweddau dalfan yn eich gwefan. 853 00:35:18,040 --> 00:35:18,914 TOMAS REIMERS: Mm-EM. 854 00:35:18,914 --> 00:35:21,520 Mae hefyd yn PlacePuppy. 855 00:35:21,520 --> 00:35:22,832 Ac mae PlaceBacon. 856 00:35:22,832 --> 00:35:24,340 >> ALLISON BUCHHOLTZ-PA: PlaceBacon? 857 00:35:24,340 --> 00:35:25,350 Really? 858 00:35:25,350 --> 00:35:28,190 >> TOMAS REIMERS: O, nid ydym yn ei wneud fynediad i'r rhyngrwyd yma. 859 00:35:28,190 --> 00:35:29,875 >> ALLISON BUCHHOLTZ-PA: [griddfan] 860 00:35:29,875 --> 00:35:30,375 Trasig. 861 00:35:30,375 --> 00:35:32,333 TOMAS REIMERS: Fel arall, Byddwn yn dangos i chi guys 862 00:35:32,333 --> 00:35:33,870 sut i roi delweddau yn eich gwefan. 863 00:35:33,870 --> 00:35:36,370 Rydym yn mynd i geisio cael hyn gwaith cyn mae'n rhaid i ni fynd. 864 00:35:36,370 --> 00:35:38,660 Ond am nawr, rydym yn unig mynd i siarad mewn lliwiau hynny. 865 00:35:38,660 --> 00:35:39,820 Rydym am roi lluniau o kittens-- 866 00:35:39,820 --> 00:35:40,210 >> ALLISON BUCHHOLTZ-PA: Gwnaethom. 867 00:35:40,210 --> 00:35:43,110 >> TOMAS REIMERS: --Yr rhyngrwyd yn i lawr am y tro fodolaeth. 868 00:35:43,110 --> 00:35:47,820 Felly, mae gennym ddau divs, ac rydym yn mynd i roi dau IDS iddynt. 869 00:35:47,820 --> 00:35:51,380 870 00:35:51,380 --> 00:35:56,760 Rydym yn mynd i alw iddo "Cyntaf" a "ail." 871 00:35:56,760 --> 00:36:01,184 Felly id = "yn gyntaf." 872 00:36:01,184 --> 00:36:02,850 Ac rydym yn mynd i roi dau liw iddynt. 873 00:36:02,850 --> 00:36:08,424 Felly sut rydym yn dewis rhywbeth gydag id o "cyntaf"? 874 00:36:08,424 --> 00:36:09,840 ALLISON BUCHHOLTZ-PA: Dot neu hash? 875 00:36:09,840 --> 00:36:10,730 GYNULLEIDFA: Sharp. 876 00:36:10,730 --> 00:36:12,940 TOMAS REIMERS: Sharp, perffaith. 877 00:36:12,940 --> 00:36:14,950 Sharp, hash, beth bynnag we-- 878 00:36:14,950 --> 00:36:15,680 >> ALLISON BUCHHOLTZ-PA: Mae llawer o bethau i'w alw. 879 00:36:15,680 --> 00:36:16,430 >> TOMAS REIMERS: OK. 880 00:36:16,430 --> 00:36:19,800 Rydym yn mynd i setlo ar hashtag, a dyna beth rydym yn mynd i fynd â hwy. 881 00:36:19,800 --> 00:36:20,300 OK? 882 00:36:20,300 --> 00:36:20,735 >> ALLISON BUCHHOLTZ-PA: hashtag. 883 00:36:20,735 --> 00:36:22,340 >> TOMAS REIMERS: Felly hashtag yn gyntaf. 884 00:36:22,340 --> 00:36:24,506 >> ALLISON BUCHHOLTZ-PA: Felly gallwch tweet yr seminar-- 885 00:36:24,506 --> 00:36:27,582 CSS hashtag, hashtag oer. 886 00:36:27,582 --> 00:36:29,040 TOMAS REIMERS: hashtag Awesomeness. 887 00:36:29,040 --> 00:36:30,730 ALLISON BUCHHOLTZ-PA: Hashtag Awesomeness, ie. 888 00:36:30,730 --> 00:36:31,480 TOMAS REIMERS: OK. 889 00:36:31,480 --> 00:36:33,660 Felly mae gennym "cyntaf" a "ail." 890 00:36:33,660 --> 00:36:37,697 Felly gyntaf, rydym yn mynd i gael lliw cefndir o goch. 891 00:36:37,697 --> 00:36:39,030 ALLISON BUCHHOLTZ-PA: Uh, colon. 892 00:36:39,030 --> 00:36:40,281 TOMAS REIMERS: Yup. 893 00:36:40,281 --> 00:36:42,281 ALLISON BUCHHOLTZ-PA: Byddaf yn eich fan a'r lle-gwiriwr. 894 00:36:42,281 --> 00:36:43,960 TOMAS REIMERS: Allison yn got 'm. 895 00:36:43,960 --> 00:36:45,830 Cefndir-lliw blue-- 896 00:36:45,830 --> 00:36:46,810 >> TOMAS REIMERS: Porffor! 897 00:36:46,810 --> 00:36:47,726 >> TOMAS REIMERS: Porffor. 898 00:36:47,726 --> 00:36:48,830 ALLISON BUCHHOLTZ-PA: Ie. 899 00:36:48,830 --> 00:36:50,630 Fy hoff liw porffor, a ac nid ydym wedi ei ddefnyddio eto. 900 00:36:50,630 --> 00:36:51,546 >> TOMAS REIMERS: Violet. 901 00:36:51,546 --> 00:36:53,361 ALLISON BUCHHOLTZ-PA: Violet. 902 00:36:53,361 --> 00:36:53,860 Mae hynny'n gweithio. 903 00:36:53,860 --> 00:36:56,482 904 00:36:56,482 --> 00:36:59,880 >> TOMAS REIMERS: Felly rydym yn mynd i gael dau divs. 905 00:36:59,880 --> 00:37:01,654 Maent yn mynd i fod yn hollol wag. 906 00:37:01,654 --> 00:37:03,070 Dylem yn ôl pob tebyg gael rhywfaint o destun. 907 00:37:03,070 --> 00:37:05,580 908 00:37:05,580 --> 00:37:09,815 Felly, "cyntaf" yn mynd i fod yn "HELO." 909 00:37:09,815 --> 00:37:10,940 A'r "ail" Bydd say-- 910 00:37:10,940 --> 00:37:11,110 >> ALLISON BUCHHOLTZ-PA: Hwyl fawr. 911 00:37:11,110 --> 00:37:12,514 >> GYNULLEIDFA: - "BYD." 912 00:37:12,514 --> 00:37:14,122 Helo, hwyl fawr. 913 00:37:14,122 --> 00:37:16,580 ALLISON BUCHHOLTZ-UA: Gwelais iddynt yn gyngerdd yr wythnos o'r blaen. 914 00:37:16,580 --> 00:37:17,705 TOMAS REIMERS: Y Beatles? 915 00:37:17,705 --> 00:37:20,242 ALLISON BUCHHOLTZ-PA: Ar gyfer reals. 916 00:37:20,242 --> 00:37:21,200 Dydyn nhw ddim bod fawr. 917 00:37:21,200 --> 00:37:24,084 918 00:37:24,084 --> 00:37:24,750 Dydw i ddim yn ei hoffi. 919 00:37:24,750 --> 00:37:26,060 >> TOMAS REIMERS: Mae gennym "HELO" a "hwyl fawr." 920 00:37:26,060 --> 00:37:29,102 Ac eto, CSS yn unig anhygoel, oherwydd ei fod yn cydnabod ein lliwiau. 921 00:37:29,102 --> 00:37:30,810 Nid oes angen i hyd yn oed poeni eu bod yn bodoli. 922 00:37:30,810 --> 00:37:33,194 Maent yn gwneud. 923 00:37:33,194 --> 00:37:35,130 >> ALLISON BUCHHOLTZ-PA: Maent yn bodoli. 924 00:37:35,130 --> 00:37:39,560 >> TOMAS REIMERS: Felly CSS rwy'n credu mae 255 o eiriau i siarad am liw. 925 00:37:39,560 --> 00:37:42,986 Os gallwch chi feddwl am liw y tu allan 255 hynny, fel, byddaf yn creu argraff. 926 00:37:42,986 --> 00:37:44,110 ALLISON BUCHHOLTZ-PA: Yeah. 927 00:37:44,110 --> 00:37:45,560 Yr wyf yn meddwl efallai y byddwch yn guys gael newydd ddod yn dde ar ôl. 928 00:37:45,560 --> 00:37:47,727 >> TOMAS REIMERS: Felly dyma, byddwch yn gweld mae gennym ddau flwch 929 00:37:47,727 --> 00:37:49,143 i'r dde ar ben ei gilydd, dde? 930 00:37:49,143 --> 00:37:50,200 HELO a hwyl fawr. 931 00:37:50,200 --> 00:37:51,460 >> ALLISON BUCHHOLTZ-PA: Does dim lle yn y canol. 932 00:37:51,460 --> 00:37:53,390 Maent yn unig smooshed i'r dde ar ben ei gilydd. 933 00:37:53,390 --> 00:37:55,973 >> TOMAS REIMERS: Felly, y peth cyntaf Amcana dylem siarad am 934 00:37:55,973 --> 00:38:02,960 mae gadewch i ni hefyd say-- yeah. 935 00:38:02,960 --> 00:38:08,020 Felly CSS yn eu cynrychioli fel math o flychau. 936 00:38:08,020 --> 00:38:10,100 Ac fel blychau, mae ganddynt gynnwys. 937 00:38:10,100 --> 00:38:14,540 Ac y cynnwys ar hyn o bryd yn fath o y HELO neu'r HWYL FAWR a dyna ni. 938 00:38:14,540 --> 00:38:15,040 OK? 939 00:38:15,040 --> 00:38:19,790 >> Felly, un o'r pethau cyntaf y byddwch yn Gall wneud yw y gallwch chi ychwanegu padin. 940 00:38:19,790 --> 00:38:25,610 Padio yn dweud faint o le dylai adael ar bob ochr. 941 00:38:25,610 --> 00:38:29,200 Felly, gadewch i ni ddweud rwyf am ei ddweud 10 picsel ar bob ochr. 942 00:38:29,200 --> 00:38:31,234 A mi ddyrannu hynny mewn eiliad. 943 00:38:31,234 --> 00:38:33,150 ALLISON BUCHHOLTZ-PA: Mae pob un o'r pethau hyn yma 944 00:38:33,150 --> 00:38:36,980 yn mynd i fod yn bennaf mewn picseli ar gyfer gweddill y seminar. 945 00:38:36,980 --> 00:38:40,980 Rydych yn mynd i weld ei fod wedi ychydig o le o'i amgylch, dde? 946 00:38:40,980 --> 00:38:46,360 Felly yr hyn nad ydych yn gweld yma yw mae ' y math anweledig o padin 947 00:38:46,360 --> 00:38:49,600 ar bob ochr, sy'n dweud, fel, OK, mae gennych eich bocs o content-- 948 00:38:49,600 --> 00:38:51,680 >> ALLISON BUCHHOLTZ-PA: Ydych chi eisiau i ddim ond tynnu i fyny yr elfen arolygu? 949 00:38:51,680 --> 00:38:53,659 >> TOMAS REIMERS: Yeah, mae hynny'n syniad da. 950 00:38:53,659 --> 00:38:56,700 ALLISON BUCHHOLTZ-PA: Hefyd, yr wyf yn dod o hyd bod yr elfen arolygu yn ffordd dda 951 00:38:56,700 --> 00:39:01,280 at chyfrif i maes os bydd rhywbeth yn mynd o'i le, rhywbeth annisgwyl yn digwydd, 952 00:39:01,280 --> 00:39:04,570 archwilio'r tagiau a gweld beth mae fel overwritten yn ddefnyddiol. 953 00:39:04,570 --> 00:39:05,940 >> TOMAS REIMERS: Felly, nid wyf ddim yn siwr os gallwch chi guys yn gweld lliw hwn. 954 00:39:05,940 --> 00:39:06,470 Allwch chi? 955 00:39:06,470 --> 00:39:10,120 Byddwch yn gweld padin hwn ar y math o ymyl. 956 00:39:10,120 --> 00:39:13,410 Ac yna byddwch yn gweld y gwir cynnwys mewn glas, dde? 957 00:39:13,410 --> 00:39:16,820 Felly dyna'r iawn hanfodion y model bocs. 958 00:39:16,820 --> 00:39:17,674 Mae gennych y cynnwys. 959 00:39:17,674 --> 00:39:18,590 Yna, mae gennych padin. 960 00:39:18,590 --> 00:39:20,440 >> GYNULLEIDFA: Pam na gwneud ydych yn unig defnyddiwch y blwch tu mewn the-- 961 00:39:20,440 --> 00:39:21,606 >> ALLISON BUCHHOLTZ-PA: Iawn. 962 00:39:21,606 --> 00:39:24,745 Oherwydd ei fod wedi dim ond dewis yr elfen ar hyn o bryd. 963 00:39:24,745 --> 00:39:26,050 >> TOMAS REIMERS: Yup. 964 00:39:26,050 --> 00:39:27,060 Pethau eraill. 965 00:39:27,060 --> 00:39:29,780 Felly, gadewch i ni siarad am hynny gorchymyn padin am eiliad. 966 00:39:29,780 --> 00:39:36,380 Felly, yn CSS, mesuriadau Mae angen i gael uned. 967 00:39:36,380 --> 00:39:39,740 Felly, cyntaf y byddwch yn cael y swm. 968 00:39:39,740 --> 00:39:41,460 Felly, yn yr achos hwn, rydym wedi dweud 10. 969 00:39:41,460 --> 00:39:44,780 Ac yna y nesaf rydym wedi ddweud yw picsel, px. 970 00:39:44,780 --> 00:39:49,160 Rhai eraill a allai fod gennych yn pethau fel centimetrau, modfedd. 971 00:39:49,160 --> 00:39:51,367 Gallwch chi wneud pethau yn hoffi, yr hyn yw 10 modfedd? 972 00:39:51,367 --> 00:39:52,700 Ac mae'n mynd i fod yn chwerthinllyd. 973 00:39:52,700 --> 00:39:52,990 >> ALLISON BUCHHOLTZ-PA: O, bachgen. 974 00:39:52,990 --> 00:39:53,460 >> GYNULLEIDFA: Pwy yw. 975 00:39:53,460 --> 00:39:54,460 >> TOMAS A ALLISON: Yeah. 976 00:39:54,460 --> 00:39:57,840 TOMAS REIMERS: Felly dyna i gyd padin. 977 00:39:57,840 --> 00:39:59,255 Rydw i'n mynd i fynd yn ôl i'r picsel. 978 00:39:59,255 --> 00:40:01,754 >> ALLISON BUCHHOLTZ-PA: Pixels yn tueddu i fod, fel, y safon. 979 00:40:01,754 --> 00:40:04,589 Pan edrychwch ar lawer o wefannau, maent yn gweithio yn bennaf mewn picseli. 980 00:40:04,589 --> 00:40:07,755 TOMAS REIMERS: Felly, rydych chi'n mynd i weld naill ai pixels-- y rhai eraill a byddwch yn gweld 981 00:40:07,755 --> 00:40:13,952 yn em, sy'n un em yn yn hafal i uchder y ffont 982 00:40:13,952 --> 00:40:15,160 yr ydych yn ei ddefnyddio ar hyn o bryd. 983 00:40:15,160 --> 00:40:16,201 >> ALLISON BUCHHOLTZ-PA: Mm. 984 00:40:16,201 --> 00:40:17,574 985 00:40:17,574 --> 00:40:20,740 TOMAS REIMERS: Mae'n ffordd dda o ddweud, fel, yr wyf am cymaint o le ag y mae fy ffont 986 00:40:20,740 --> 00:40:21,514 yn cymryd. 987 00:40:21,514 --> 00:40:23,180 ALLISON BUCHHOLTZ-PA: Ddim yn gwybod hynny. 988 00:40:23,180 --> 00:40:25,747 Byddwch yn dysgu rhywbeth newydd bob dydd. 989 00:40:25,747 --> 00:40:27,955 TOMAS REIMERS: Mae llawer o fesuriadau mewn CS. 990 00:40:27,955 --> 00:40:29,260 Rwy'n awgrymu i chi edrych i fyny. 991 00:40:29,260 --> 00:40:32,122 Ar gyfer eich holl achosion, yr wyf yn meddwl Dylai picsel fod yn ddigonol. 992 00:40:32,122 --> 00:40:33,830 Ac maen nhw'n hefyd yr hyn ydych yn mynd i weld 993 00:40:33,830 --> 00:40:36,520 yn y mwyafrif o enghreifftiau wneud ar-lein. 994 00:40:36,520 --> 00:40:38,320 Felly, byddwn yn ei adael ar picsel. 995 00:40:38,320 --> 00:40:42,420 >> Gallwch hefyd, dylwn say-- hynny setiau padin bob un o'r paddings. 996 00:40:42,420 --> 00:40:49,789 Gallwch hefyd wneud rhywbeth fel "Padin-top" i ddim ond set-- 997 00:40:49,789 --> 00:40:52,080 ALLISON BUCHHOLTZ-PA: Efallai byddwn yn cael ein "HELO" yn ôl. 998 00:40:52,080 --> 00:40:55,480 TOMAS REIMERS: --to dim ond gosod y padin ar y top a dim byd arall. 999 00:40:55,480 --> 00:40:59,560 Felly y pedwar gorchmynion yn padin-uchaf, padin-gwaelod, padin-chwith, 1000 00:40:59,560 --> 00:41:00,310 a padin-dde. 1001 00:41:00,310 --> 00:41:02,470 >> ALLISON BUCHHOLTZ-PA: Yn union fel byddech yn disgwyl am flwch. 1002 00:41:02,470 --> 00:41:03,530 >> TOMAS REIMERS: Yeah. 1003 00:41:03,530 --> 00:41:05,240 Nid oes dim yn rhy crazy yno. 1004 00:41:05,240 --> 00:41:08,230 A yw hynny'n gwneud synnwyr? 1005 00:41:08,230 --> 00:41:11,990 Felly dyna yw padin. 1006 00:41:11,990 --> 00:41:14,110 Rydw i'n mynd i osod yr holl y paddings yn ôl i 10. 1007 00:41:14,110 --> 00:41:17,010 Ac yna dwi'n mynd i symud ymlaen i ffin. 1008 00:41:17,010 --> 00:41:21,130 >> Felly beth ffin yn ei border 'na gorchymyn' n annaearol. 1009 00:41:21,130 --> 00:41:24,450 Mae'n cymryd rhyw fath o dri pheth ar unwaith. 1010 00:41:24,450 --> 00:41:28,930 Felly, y cyntaf yw pa mor fawr i chi am iddo fod yn mesur. 1011 00:41:28,930 --> 00:41:30,662 Unwaith eto, rwy'n dim ond yn defnyddio picsel. 1012 00:41:30,662 --> 00:41:32,620 A'r peth olaf i mi Dylai ychwanegu at mesuriadau 1013 00:41:32,620 --> 00:41:35,270 yw'r un peth sy'n Nid oes angen uned yw 0. 1014 00:41:35,270 --> 00:41:37,390 Mae'n anghywir mewn gwirionedd i roi 0 uned, 1015 00:41:37,390 --> 00:41:41,940 oherwydd 0 yn 0 ar draws modfedd, picsel, centimetrau, beth bynnag. 1016 00:41:41,940 --> 00:41:43,960 Mae i gyd yn unig yn golygu 0, dde? 1017 00:41:43,960 --> 00:41:46,710 Felly, cyntaf y byddwch yn ei roi y mesur. 1018 00:41:46,710 --> 00:41:48,650 >> Yna, byddwch yn rhoi ei arddull. 1019 00:41:48,650 --> 00:41:49,869 Felly dw i'n mynd i ddweud "solid." 1020 00:41:49,869 --> 00:41:51,410 A byddwn yn siarad am yr hyn mae hynny'n ei olygu. 1021 00:41:51,410 --> 00:41:54,290 Ac yna yn olaf, byddwch yn rhoi ei lliw. 1022 00:41:54,290 --> 00:41:56,850 Felly dw i'n mynd i ddweud "du." 1023 00:41:56,850 --> 00:41:59,637 Ac mae'r rhain i gyd yn bethau rydym wedi weld o'r blaen yn awr, ac eithrio ar gyfer arddull, 1024 00:41:59,637 --> 00:42:00,720 ond byddwn yn siarad am hynny. 1025 00:42:00,720 --> 00:42:04,120 Felly, rydych guys wedi gweld mesuriadau, ac yr ydych wedi gweld lliwiau. 1026 00:42:04,120 --> 00:42:10,410 A beth sy'n digwydd yw ein bod yn cael hyn yn border du 'n glws o'i gwmpas, dde? 1027 00:42:10,410 --> 00:42:11,620 Rydych guys yn gweld sut y gwnaethom hynny? 1028 00:42:11,620 --> 00:42:12,760 >> GYNULLEIDFA: Yeah. 1029 00:42:12,760 --> 00:42:14,850 >> TOMAS REIMERS: Cool. 1030 00:42:14,850 --> 00:42:17,370 Felly beth yw hynny? 1031 00:42:17,370 --> 00:42:19,160 Felly, yn gyntaf oll, mae'n un picsel. 1032 00:42:19,160 --> 00:42:20,880 Dyna hunan-amlwg ddigon, dde? 1033 00:42:20,880 --> 00:42:23,254 Fel, mae'n un picsel trwchus. 1034 00:42:23,254 --> 00:42:26,170 Neu a fyddai'n un picsel, ond rwy'n chwyddo i mewn, felly mae'n ychydig yn fwy 1035 00:42:26,170 --> 00:42:26,490 na hynny. 1036 00:42:26,490 --> 00:42:27,967 >> ALLISON BUCHHOLTZ-PA: Ac mae gennym y teledu datrys chwerthinllyd. 1037 00:42:27,967 --> 00:42:29,460 >> TOMAS REIMERS: Yeah. 1038 00:42:29,460 --> 00:42:33,640 Gallwch ei wneud yn fwy, llai, beth bynnag. 1039 00:42:33,640 --> 00:42:35,630 Felly dyma ffin dwy-picsel. 1040 00:42:35,630 --> 00:42:38,810 Byddwch yn gweld ei fod yn ddwywaith yn fwy trwchus. 1041 00:42:38,810 --> 00:42:40,172 Peth nesaf y byddwch wedi ei lliw. 1042 00:42:40,172 --> 00:42:41,130 Dyw hynny ddim yn ddiddorol. 1043 00:42:41,130 --> 00:42:42,710 Dydw i ddim yn mynd i siarad am hynny, mewn gwirionedd. 1044 00:42:42,710 --> 00:42:45,110 >> ALLISON BUCHHOLTZ-PA: Ond mae'r arddull Efallai fod yr un ychydig yn ddiddorol. 1045 00:42:45,110 --> 00:42:45,980 >> TOMAS REIMERS: Yeah. 1046 00:42:45,980 --> 00:42:48,560 Felly arddull, mae yna ychydig rai fy mod yn gweld a ddefnyddir yn gyffredin. 1047 00:42:48,560 --> 00:42:55,690 Solet, un nesaf un gyntaf doredig, ac wedi chwalu'r yr un diwethaf. 1048 00:42:55,690 --> 00:42:59,290 Ac yma yn frith. 1049 00:42:59,290 --> 00:43:02,980 Byddwch yn gweld eu bod yn criw o ddotiau, dde? 1050 00:43:02,980 --> 00:43:09,030 Ffordd dda o fath o gael border 'n glws mynd, llinellau toriad hefyd yn eithaf poblogaidd. 1051 00:43:09,030 --> 00:43:11,580 1052 00:43:11,580 --> 00:43:13,600 >> ALLISON BUCHHOLTZ-PA: Ac yna, wrth gwrs, rwy'n 1053 00:43:13,600 --> 00:43:16,660 siwr bod digon eraill arddulliau y gallwch ei gael. 1054 00:43:16,660 --> 00:43:20,000 Ac mae gennym set mawr o cysylltiadau ar y diwedd i chi guys 1055 00:43:20,000 --> 00:43:23,470 i fath o ddarllen a edrych ar CSS fwy oer. 1056 00:43:23,470 --> 00:43:25,954 >> TOMAS REIMERS: Ac yna y peth olaf, rydym yn 1057 00:43:25,954 --> 00:43:27,870 mynd i siarad am y modelau blwch go gyflym. 1058 00:43:27,870 --> 00:43:30,070 O, ac yna ffin, yn union fel padin, 1059 00:43:30,070 --> 00:43:33,270 byddwch hefyd yn cael pethau fel chwith-ffin, border-dde, border-top, 1060 00:43:33,270 --> 00:43:37,590 border-gwaelod, sy'n caniatáu i chi i fynd ar ffin benodol. 1061 00:43:37,590 --> 00:43:40,650 Felly dyma dim ond y ffin chwith-ddiffiniedig. 1062 00:43:40,650 --> 00:43:43,060 A yw hynny'n gwneud synnwyr? 1063 00:43:43,060 --> 00:43:46,170 >> ALLISON BUCHHOLTZ-PA: Mae'n cŵl ffordd i bwysleisio pethau neu ychwanegu 1064 00:43:46,170 --> 00:43:47,545 llinellau rhwng gwahanol elfennau. 1065 00:43:47,545 --> 00:43:48,670 TOMAS REIMERS: Yn hollol. 1066 00:43:48,670 --> 00:43:50,940 Felly dyna ein ffin. 1067 00:43:50,940 --> 00:43:52,790 Ac ymyl y un llynedd. 1068 00:43:52,790 --> 00:43:55,892 Padin tebyg Ymyl yn ac eithrio nad yw'n within-- 1069 00:43:55,892 --> 00:43:57,975 ALLISON BUCHHOLTZ-PA: Mae'n Nid yw o amgylch eich elfen 1070 00:43:57,975 --> 00:44:00,840 ond mewn gwirionedd o gwmpas y cyfan blwch yr ydym wedi bod yn ei weld. 1071 00:44:00,840 --> 00:44:02,770 >> TOMAS REIMERS: Yeah. 1072 00:44:02,770 --> 00:44:04,090 Dywedodd Allison mae'n berffaith. 1073 00:44:04,090 --> 00:44:07,550 Dyw hi ddim yn, fel, y tu mewn i'ch elfen, 'i' o amgylch y blwch cyfan. 1074 00:44:07,550 --> 00:44:10,900 Mae hynny'n golygu pethau fel Nid yw cefndir yn gymwys iddo. 1075 00:44:10,900 --> 00:44:13,550 Ac y mae'n ei ddweud yn y bôn, fel, dydw i ddim eisiau dim byd 1076 00:44:13,550 --> 00:44:15,230 yn hyn o le i mi. 1077 00:44:15,230 --> 00:44:17,470 Felly, fel yma mae gennym ymyl o 10 picsel. 1078 00:44:17,470 --> 00:44:23,100 Felly dim byd o fewn 10 picsel Dylai fod yn nesaf i mi. 1079 00:44:23,100 --> 00:44:26,210 Dyna fath o ei gofod ond math o peidio. 1080 00:44:26,210 --> 00:44:29,215 Felly dyna'r iawn hanfodion y model bocs. 1081 00:44:29,215 --> 00:44:30,090 A yw hynny'n gwneud synnwyr? 1082 00:44:30,090 --> 00:44:33,830 1083 00:44:33,830 --> 00:44:34,550 Cool, oer. 1084 00:44:34,550 --> 00:44:35,800 ALLISON BUCHHOLTZ-PA: Awesome. 1085 00:44:35,800 --> 00:44:37,890 Felly, yn awr yr wyf yn meddwl ein bod yn unig wedi ein hadnoddau oer 1086 00:44:37,890 --> 00:44:41,220 y byddwn yn mynd â chi guys trwy gyflym iawn. 1087 00:44:41,220 --> 00:44:44,815 A byddwn yn actually-- yn dda, sydd gennym y rhyngrwyd eto? 1088 00:44:44,815 --> 00:44:47,860 >> TOMAS REIMERS: Gadewch i ni weld os gallaf agor up-- 1089 00:44:47,860 --> 00:44:50,040 gadewch i mi jyst weld os wyf yn Gall cael y rhyngrwyd yn gyflym 1090 00:44:50,040 --> 00:44:53,317 tra Allison yn siarad am unrhyw beth Allison eisiau siarad am. 1091 00:44:53,317 --> 00:44:55,150 ALLISON BUCHHOLTZ-PA: Felly basically-- Nid wyf yn ei wneud 1092 00:44:55,150 --> 00:44:57,930 yn gwybod beth arall y gallaf ei ddweud ar hyn o bryd. 1093 00:44:57,930 --> 00:45:01,340 Ond dyma rai adnoddau gwirioneddol dda. 1094 00:45:01,340 --> 00:45:04,629 Mae'r rhain yn rhai sy'n Tomas ac rwyf wedi defnyddio 1095 00:45:04,629 --> 00:45:06,420 a'n bod yn mewn gwirionedd a ddefnyddir i prep ar gyfer hyn. 1096 00:45:06,420 --> 00:45:09,940 W3Schools yn un sy'n chi Dylai guys wedi gweld o'r blaen. 1097 00:45:09,940 --> 00:45:12,440 Rydym yn argymell ei fod am llawer o bethau gyda CSS. 1098 00:45:12,440 --> 00:45:15,060 Rwy'n gwybod fy mod yn ei argymell i fy adran drwy'r amser. 1099 00:45:15,060 --> 00:45:21,050 >> Un o'r pethau gwych yw ei fod yn yn caniatáu i chi fath o chwarae o gwmpas gyda CSS 1100 00:45:21,050 --> 00:45:23,830 a gweld y newidiadau ar unwaith yn hyn, 1101 00:45:23,830 --> 00:45:25,920 fel, dwbl-ffenestri gweld bod ganddi. 1102 00:45:25,920 --> 00:45:29,980 Felly, nid oes rhaid i chi boeni am sefydlu eich tudalen ar y we eich hun, 1103 00:45:29,980 --> 00:45:33,090 neu sefydlu vhost yn eich peiriant lleol a llu lleol, 1104 00:45:33,090 --> 00:45:34,980 ac yn cael yr holl bod gweithio stwff. 1105 00:45:34,980 --> 00:45:36,830 Mae'n cael ei hymgorffori i'r dde o fewn y dudalen. 1106 00:45:36,830 --> 00:45:39,042 >> Ac mae wedi hyn ychydig gwersi y gallwch 1107 00:45:39,042 --> 00:45:40,750 mynd drwy i ddysgu mwy am detholwyr, 1108 00:45:40,750 --> 00:45:44,610 neu ddysgu am drin eich ffont, neu gefndir, neu ddelwedd. 1109 00:45:44,610 --> 00:45:46,990 Ac mae gennych y rhain canlyniadau y pryd sy'n eich 1110 00:45:46,990 --> 00:45:49,310 Nid oes rhaid i wneud unrhyw gwaith paratoi arall ar gyfer. 1111 00:45:49,310 --> 00:45:51,060 Felly, yr wyf wrth fy modd W3Schools. 1112 00:45:51,060 --> 00:45:51,960 Mae'n wych. 1113 00:45:51,960 --> 00:45:52,670 A yw'n gweithio? 1114 00:45:52,670 --> 00:45:52,950 >> TOMAS REIMERS: Yeah. 1115 00:45:52,950 --> 00:45:53,720 Na, nid yw'n. 1116 00:45:53,720 --> 00:45:55,636 Ydych chi am i mi roi cynnig a restart 'fy nghyfrifiadur? 1117 00:45:55,636 --> 00:45:56,410 Neu ydym ni eisiau i-- 1118 00:45:56,410 --> 00:46:01,490 >> ALLISON BUCHHOLTZ-UA: Yr wyf yn golygu, yn dda, bydd hyn hefyd fod ar-lein. 1119 00:46:01,490 --> 00:46:02,740 Bydd yr holl sleidiau fod ar-lein. 1120 00:46:02,740 --> 00:46:05,470 Felly, Fi jyst dal argymell gwneud hyn. 1121 00:46:05,470 --> 00:46:07,880 >> Mae hyn yn wych fel dim ond fel taflen twyllo. 1122 00:46:07,880 --> 00:46:10,690 Dim ond yr holl sylfaenol gorchmynion sydd gennych. 1123 00:46:10,690 --> 00:46:13,070 Mae'n wych pan fyddwch chi yn gyntaf cychwyn eich gwefan. 1124 00:46:13,070 --> 00:46:15,080 Oherwydd efallai nad ydych yn ei wneud eisiau mynd i mewn i bob 1125 00:46:15,080 --> 00:46:17,355 y nitty gritty go iawn dylunio-trwm stwff. 1126 00:46:17,355 --> 00:46:20,230 'Ch jyst angen i chi ei fformatio mewn ffordd y math hwnnw o yn gwneud synnwyr ac ewyllys 1127 00:46:20,230 --> 00:46:21,490 ei wneud am y tro. 1128 00:46:21,490 --> 00:46:23,580 Ac os ydych wir eisiau i fynd i mewn iddo, yr wyf yn gwybod 1129 00:46:23,580 --> 00:46:27,240 mae hyn yn, fel, yn un o Hoff gyfeiriadau Tomas yn. 1130 00:46:27,240 --> 00:46:30,130 Rydym yn ei ddefnyddio i paratoi, ac mae'n wych. 1131 00:46:30,130 --> 00:46:33,030 Mae'n y Datblygwr o Mozilla. 1132 00:46:33,030 --> 00:46:36,490 >> TOMAS REIMERS: Felly Mozilla yn y bobl sy'n gwneud Firefox. 1133 00:46:36,490 --> 00:46:40,290 Ac mae'n dim ond eu hunain datblygwr cyfeirio, yr wyf yn meddwl yn awesome. 1134 00:46:40,290 --> 00:46:44,870 Ac mae ganddo gwych rhestr o adnoddau. 1135 00:46:44,870 --> 00:46:45,530 Felly rydym have-- 1136 00:46:45,530 --> 00:46:48,060 >> ALLISON BUCHHOLTZ-PA: Ac yna nodyn olaf yw 1137 00:46:48,060 --> 00:46:50,120 pan fyddwch yn ceisio ddylunio eich gwefan, 1138 00:46:50,120 --> 00:46:53,550 tynnu ysbrydoliaeth o bethau eich bod yn meddwl yn eithaf. 1139 00:46:53,550 --> 00:46:56,340 Arolygu yr elfen, archwilio'r cod ffynhonnell 1140 00:46:56,340 --> 00:46:59,370 Gall fod yn ddefnyddiol super i geisio chyfrif i maes 1141 00:46:59,370 --> 00:47:02,080 sut i arddull eich gwefan eich hun. 1142 00:47:02,080 --> 00:47:04,540 >> Yn aml, yr wyf yn teimlo fel y gorau ffordd, ar wahân arbrofi, 1143 00:47:04,540 --> 00:47:06,290 yn unig i edrych ar pethau sy'n eithaf. 1144 00:47:06,290 --> 00:47:09,810 Rwy'n ei chael hi'n anodd iawn i ddim ond math o ddylunio pethau ar eich pen eich hun, 1145 00:47:09,810 --> 00:47:11,090 yn enwedig yn y dechrau. 1146 00:47:11,090 --> 00:47:14,740 Felly, os gwelwch yn dda edrychwch ar wefannau eich bod yn mwynhau edrych ar. 1147 00:47:14,740 --> 00:47:16,880 Chyfrif i maes beth sy'n gwneud eu apelio i chi. 1148 00:47:16,880 --> 00:47:19,170 Ac yna mae croeso i chi ceisio ailadrodd hynny. 1149 00:47:19,170 --> 00:47:20,410 >> TOMAS REIMERS: Iawn. 1150 00:47:20,410 --> 00:47:23,120 Hyd yn oed yn hoffi wefannau fel hyn, gallwch weld 1151 00:47:23,120 --> 00:47:25,460 mae bendant yn div ar y brig. 1152 00:47:25,460 --> 00:47:29,920 Ac yna mae gennych div arall o fewn yma, sydd yn Awesomeness CSS. 1153 00:47:29,920 --> 00:47:32,480 Ac yna mae gennych griw o gysylltiadau yma. 1154 00:47:32,480 --> 00:47:34,770 Os ydych yn wir yn unig yn arolygu elfennau, gallwch ddatrys y 1155 00:47:34,770 --> 00:47:38,520 dechrau gweld beth y mae gwefannau edrych, a sut y gall yr wyf yn 1156 00:47:38,520 --> 00:47:40,493 ail-greu, os oeddwn i eisiau. 1157 00:47:40,493 --> 00:47:41,890 A yw hynny'n gwneud synnwyr? 1158 00:47:41,890 --> 00:47:43,670 Felly, rydym dim ond tri munud sydd ar ôl. 1159 00:47:43,670 --> 00:47:46,380 Felly gwestiynau? 1160 00:47:46,380 --> 00:47:47,650 Unrhyw un ohonynt? 1161 00:47:47,650 --> 00:47:48,350 Ydw. 1162 00:47:48,350 --> 00:47:50,780 >> GYNULLEIDFA: Ar gyfer y lliw petryal, sut y byddech 1163 00:47:50,780 --> 00:47:53,499 have-- os nad oeddech am ei mynd ar draws y dudalen gyfan, gallai 1164 00:47:53,499 --> 00:47:56,400 yr ydych wedi ei gwneud yn mynd ar draws yn unig hanner y dudalen neu dim ond y testun? 1165 00:47:56,400 --> 00:47:59,660 >> TOMAS REIMERS: Yeah, gwbl. 1166 00:47:59,660 --> 00:48:02,780 Felly, gadewch i mi weld mewn gwirionedd. 1167 00:48:02,780 --> 00:48:04,670 Mae gen i ddau o syniadau. 1168 00:48:04,670 --> 00:48:07,265 Felly, yn gyntaf oll, yr ydych Gall hefyd ddefnyddio percents. 1169 00:48:07,265 --> 00:48:08,140 >> GYNULLEIDFA: Really? 1170 00:48:08,140 --> 00:48:11,260 >> ALLISON BUCHHOLTZ-PA: Felly rywbeth i chwilio am ei lleoli cymharol. 1171 00:48:11,260 --> 00:48:13,385 Mae'n rhywbeth yr ydym yn Nid oes gennych amser i fynd i mewn, 1172 00:48:13,385 --> 00:48:16,392 ond mae'n rhywbeth yn bendant argymell eich guys edrych allan. 1173 00:48:16,392 --> 00:48:17,580 >> TOMAS REIMERS: percents Felly. 1174 00:48:17,580 --> 00:48:21,524 A gweld sut yr ydym yn ei gwneud yn dim ond 50% o led? 1175 00:48:21,524 --> 00:48:24,190 ALLISON BUCHHOLTZ-PA: Os ydych yn mewn gwirionedd yn gwybod y nifer o picsel, 1176 00:48:24,190 --> 00:48:25,780 gallwch fod yn fwy manwl gywir y ffordd honno. 1177 00:48:25,780 --> 00:48:27,200 Gallwch chi chwarae o gwmpas ag ef. 1178 00:48:27,200 --> 00:48:27,700 Ond mae 50%. 1179 00:48:27,700 --> 00:48:31,970 Pe baem yn newid maint ein borydd, byddai'n ei gwneud yn llai. 1180 00:48:31,970 --> 00:48:35,250 >> TOMAS REIMERS: Wel, 'i' yn y bôn o 50% ar hyn o bryd, yr wyf yn meddwl. 1181 00:48:35,250 --> 00:48:38,820 Mae'n 50%, ac yna yr ymyl wedi cael ei ychwanegu at hynny. 1182 00:48:38,820 --> 00:48:40,100 CSS Mae gan lawer o quirks. 1183 00:48:40,100 --> 00:48:43,195 Felly, ar hyn o bryd mae hyn yn 50% o'r dudalen led. 1184 00:48:43,195 --> 00:48:46,860 Ond cofiwch fod gennych 10 picsel a gymerwyd oddi ar bob ochr. 1185 00:48:46,860 --> 00:48:49,700 Felly, os ydych yn symud hynny yn erbyn ymyl chwith y porwr, 1186 00:48:49,700 --> 00:48:51,550 yna byddai'n edrych fel 50%. 1187 00:48:51,550 --> 00:48:53,884 Unwaith eto, fel y dywedais, gall CSS fod yn llawer o ddyfalu-a-siec. 1188 00:48:53,884 --> 00:48:56,049 Fel, yn eich barn chi rhywbeth yn mynd i ymddwyn un ffordd, 1189 00:48:56,049 --> 00:48:57,805 ond mae'n ymddwyn yn ffordd hollol wahanol. 1190 00:48:57,805 --> 00:48:59,420 >> ALLISON BUCHHOLTZ-PA: A ydych yn unig yn cael gallach, 1191 00:48:59,420 --> 00:49:02,020 ac ch jyst cael gwell greddf ar ei gyfer wrth i chi symud ymlaen. 1192 00:49:02,020 --> 00:49:02,730 >> TOMAS REIMERS: Ac mae'n mynd yn waeth ac yn waeth. 1193 00:49:02,730 --> 00:49:03,496 Felly mae'n wirioneddol dim ond ras. 1194 00:49:03,496 --> 00:49:05,454 >> ALLISON BUCHHOLTZ-PA: Dyna super galonogol. 1195 00:49:05,454 --> 00:49:07,070 Rydym am iddynt hoffi CSS. 1196 00:49:07,070 --> 00:49:08,810 >> TOMAS REIMERS: CSS yn awesome. 1197 00:49:08,810 --> 00:49:10,354 Cofiwch fod. 1198 00:49:10,354 --> 00:49:11,020 Cwestiynau eraill? 1199 00:49:11,020 --> 00:49:14,297 >> ALLISON BUCHHOLTZ-PA: Yr un peth. 1200 00:49:14,297 --> 00:49:14,880 Unrhyw beth arall? 1201 00:49:14,880 --> 00:49:15,140 Cool. 1202 00:49:15,140 --> 00:49:15,690 >> TOMAS REIMERS: Awesome. 1203 00:49:15,690 --> 00:49:18,523 >> ALLISON BUCHHOLTZ-PA: Wel, os ydych yn guys gennych unrhyw gwestiynau yn nes ymlaen, 1204 00:49:18,523 --> 00:49:20,919 rydym yn ar gael yn unol arfer bob amser. 1205 00:49:20,919 --> 00:49:22,960 Mae'n debyg y byddwch yn gweld rhai o ni am brosiectau terfynol 1206 00:49:22,960 --> 00:49:24,280 ac yn sicr yn y hackathon. 1207 00:49:24,280 --> 00:49:25,200 >> TOMAS REIMERS: Yn hollol. 1208 00:49:25,200 --> 00:49:25,720 Ac yn y ffair. 1209 00:49:25,720 --> 00:49:26,560 >> ALLISON BUCHHOLTZ-PA: Ac yn y ffair. 1210 00:49:26,560 --> 00:49:26,840 Oh. 1211 00:49:26,840 --> 00:49:28,130 >> TOMAS REIMERS: Edrych ymlaen at gweld eich holl awesome-- 1212 00:49:28,130 --> 00:49:29,420 >> ALLISON BUCHHOLTZ-PA: Cawn weld eich holl wefannau anhygoel 1213 00:49:29,420 --> 00:49:30,572 a fydd yn hardd. 1214 00:49:30,572 --> 00:49:32,780 TOMAS REIMERS: Gallwch bob amser weld, fel, y gwefannau 1215 00:49:32,780 --> 00:49:36,234 a oedd wedi, fel, CSS da ac yna fel y rhai nad oedd yn ceisio gwneud CSS. 1216 00:49:36,234 --> 00:49:39,150 ALLISON BUCHHOLTZ-PA: Hefyd, un arall peth, un peth arall i edrych i mewn 1217 00:49:39,150 --> 00:49:40,445 yw bootstrapping. 1218 00:49:40,445 --> 00:49:41,805 Felly Bootstrap yn wych. 1219 00:49:41,805 --> 00:49:42,240 >> TOMAS REIMERS: Google, os you-- 1220 00:49:42,240 --> 00:49:43,573 >> ALLISON BUCHHOLTZ-PA: Google iddo. 1221 00:49:43,573 --> 00:49:44,340 Mae'n wych. 1222 00:49:44,340 --> 00:49:45,620 Byddwch wrth eich bodd. 1223 00:49:45,620 --> 00:49:48,000 Ac yn awr fod gennych dealltwriaeth sylfaenol o CSS, 1224 00:49:48,000 --> 00:49:50,340 bydd yn gwneud llawer mwy o synnwyr. 1225 00:49:50,340 --> 00:49:50,890 Awesome. 1226 00:49:50,890 --> 00:49:51,480 Diolch, guys. 1227 00:49:51,480 --> 00:49:53,330 >> TOMAS REIMERS: Diolch yn fawr i chi. 1228 00:49:53,330 --> 00:49:54,219