[Jwe mizik] ALLISON BUCHHOLTZ-AU: Se konsa, nou ap fondamantalman jis ale ba ou yon fatige nan CSS, paske nou konnen ke li pa te kouvri nan tout seksyon yo. Apre sa, nou reyèlman vle asire w ke ou nèg gen zouti sa a jete ou, paske li gen kapasite nan fè sit ou gade pi bèl pase. 

Men, si w ap bati yon sit entènèt, Lè sa a, pwobableman ou vle fè li bèl. Mwen vle di, ou pa bezwen, men mwen ta sijere li. [Ri] Si ou vle itilizatè yo sèvi ak li, ou ta ka vle fè li yon ti kras [fèbl]. Se konsa, nou ap ale nan eseye ak ba ou jis kèk zouti debaz ak konpreyansyon, se konsa ke lè ou ale deyò epi w ap fè rechèch sou bagay sa yo sou CSS, li pa nan ranpli bavardaj, tankou CSS pafwa yo dwe. 

TOMAS Reimers: Yeah. Allison te di li trè byen. Se konsa, mwen devine nan premye bagay nou ta dwe kòmanse avèk se sa ki CSS? Se konsa, CSS se pè. CSS-- 

ALLISON BUCHHOLTZ-AU: Sa se non an nan seminè nou an. 

TOMAS Reimers: Yeah. Li nan reyèlman enpòtan ke ou konprann ke pa lè sa a. Si ou sèlman pran yon sèl bagay, li a ki CSS si pè. De se CSS kanpe pou Kaskad Dra Style. Se konsa, nan nwayo li yo, CSS se yon fèy style, sa vle di li pèmèt ou style yon paj entènèt. Lè sa a, ki sa sa vle di, li nan yon fason yo ajoute style nan sit entènèt ou. Se konsa, pa style, nou vle di tout bagay ki pa nan structural-- se konsa bagay sa yo tankou koulè, background imaj, sou fwontyè, tankou, padding, marges. Nou pral pale sou sa tout sa ki vle di nan yon ti jan. 

Se konsa, nou te jis ale pi devan epi louvri tou de nan sa moute nan jdi. Se konsa, sa a se index.html. Lè sa a se main.css. Se konsa, pa gen anyen main.css. ALLISON BUCHHOLTZ-AU: Non style byen lwen tèlman. TOMAS Reimers: Okenn. Ak jan ou pral wè, li nan yon sit reyèlman lèd. ALLISON BUCHHOLTZ-AU: Se jis plenn. TOMAS Reimers: Yeah. Yeah, li pa lèd, li nan jis minimalist. Lè sa a, isit la nou gen index.html. Se konsa, pou yon rapid Rekapitilasyon nan HTML, Allison, ou vle jis pale sou paj la? 

ALLISON BUCHHOLTZ-AU: Yeah. Se konsa, evidamman, nou gen HTML nou an tag, ki jis non dosye HTML. Nou gen header nou yo isit la, ak CSS Awesomeness, which-- si ou ale tounen. Ki kote se sa? 

TOMAS Reimers: Oh. Yeah, ou ka wè. ALLISON BUCHHOLTZ-AU: Ak Avi header nan se sa a header tab dwa moute isit la. Lè sa a, "Alo, mond!" se tèks la ke nou gen jis montre sou entènèt la paj, ki is-- ale tounen. Retounen. Ki se jis nan kò nou an isit lan-- tèks la klè. Epitou, yon sèl bagay yo remake, si ou gade isit la, Tomas chanje moute sa yo de soti nan glise nou an. Se konsa, osi lontan ke ou gen tout twa nan sa yo, w ap amann. Yo ka nan tou sa lòd yo vle. Ki sa ki nan pi enpòtan an se sèlman sa ou gen chak nan twa bagay sa yo. 

TOMAS Reimers: Cool. Ajoute yon kalite doc? ALLISON BUCHHOLTZ-AU: Yeah. TOMAS Reimers: Yeah. Cool. ALLISON BUCHHOLTZ-AU: Aparamman, mikro m 'pa renmen m'. TOMAS Reimers: Oh, ban nou yon sec jis pandan y ap Allison switch soti MIC li. Se konsa, yeah. Se konsa, nou gen paj prensipal nou an. Li nan kalite unstyled. Nou pa gen anpil. Nou jis gen fondamantalman tèks. Nou gen fèy la style. Nou gen tit la. Se konsa, jis fè-os eleman fè yon sit entènèt. 

Se konsa, soti nan gen, se pou yo pale sou sa CSS se ak sa li sanble ak nan tout sa. Se konsa, pou that-- ALLISON BUCHHOLTZ-AU: Retounen nan glisad yo. TOMAS Reimers: Retounen nan glisad yo. Epi Allison ka pran sou. 

ALLISON BUCHHOLTZ-AU: Woo. OK. Se konsa, nan dosye CSS ou a, w ap ale nan gen yon anpil nan bagay sa yo rele seleksyon. Sa pral jis pou nan baz nan dosye CSS ou. Li nan jis pral fè anpil ak anpil sa yo. Se konsa, seleksyon. Sa a se jis anatomi la an jeneral. Nou pral yo ale nan egzanp, paske si ou nèg pa janm gade seksyon m 'yo, mwen santi mwen tankou bagay sa yo nan abstrè a pa reyèlman fè sans. Li toujou ede yo wè egzanp yo. 

Se konsa, nou gen kèk seleksyon. Sa k ap pase yo dwe kèk idantifyan pou ki sa nou vle style la pou aplike pou. Lè sa a, nou ka gen nenpòt mete nan règ ak valè. Se konsa, seleksyon ki ou ta ka wè ta kapab yon bagay tankou kò, oswa paragraf ak P, oswa header, oswa kèlkeswa sa, tou sa ou vle Tags HTML ou yo dwe. 

Se konsa, nan ka sa a, nou gen nan kò moun. Epi nou gen kèk règ, ki sa a koresponn nan sa style ou aplike a. Se konsa, nan ka sa a, nou gen koulè background ak font pwa. Se konsa, sa ki pral chanje background nan nan anyen nan nenpòt tag kò nan dosye HTML nou an. Epi li pral bay li sa a valè ble limyè. 

Se konsa, li pral fè a background limyè ble. Lè sa a, anyen nan kò se ale nan gen yon pwa font karaktè fonse. Se konsa, li jis ale nan fonse tout tèks nou an. Lè sa a se jis yon sèl seleksyon. Men, ou te kapab gen anpil anpil nan sa yo. E kòm nou ap ale nan montre pita, yon ti jan ti kras pi plis nan ki jan ki travay ak plis egzanp la. Nenpòt bagay ou vle ajoute? 

TOMAS Reimers: No Allison te resevwa li. Nou jis ap ale nan koupe moute yon egzanp isit la sou sit egzanp nou an. Se konsa, kite a aktyèlman pran sa a. Li nan pafè. Se konsa, mwen jis ale nan kopi ak keratin ki dwat nan dosye main.css nou an. Men, mwen pral pou konsève pou li. Lè sa a, nou pral kouri li. Se konsa, bò nòt, youn nan la pifò bagay sa yo fwistre se si ou pa sove yon dosye, ak lè sa a ou, tankou, Reload paj la, ak renmen, poukisa se pa chanjman nan rive? Li k ap pase. Se konsa, isit la nou te wè ke nou te fè nou an sit entènèt yon fon ble limyè ak kèk gra tèks. 

Mwen ta dwe tou mansyone, si ou nèg gen kesyon sou anyen n ap fè, tanpri santi gratis yo sispann nou epi mande nou. Nou totalman vle nan jaden kesyon. 

ALLISON BUCHHOLTZ-AU: Li evidan, ak CSS, tout bagay bati sou tèt li. Se konsa, si yon sèl bagay pa fè sa fè sans kounye a, nou pa vle ke marè ou desann pita. 

TOMAS Reimers: Se konsa, kite a kalite sèksyone sa a. Se konsa, ou vle kòmanse ak seleksyon an isit la? 

ALLISON BUCHHOLTZ-AU: Yeah. Kòm mwen te di anvan, kò se jis seleksyon nou an isit la. Se konsa, si nou tounen sou nan ah index-- nou an. 

TOMAS Reimers: Ki Mwen jis fèmen. Ban m 'yon dezyèm fwa. Se konsa, File, Open, index.html. ALLISON BUCHHOLTZ-AU: Cool. Se konsa, si w remake isit la, nou gen sa yo Tags kò, dwa? Se konsa, seleksyon an jis koresponn ak etikèt yo ke nou ap pale de. Se konsa, kò dwa isit la. Se konsa, sa nou ap di la a se everything-- ka nou tounen? Mwen swete mwen te kapab jis tankou manyen ekran an. Li ta dwe tèlman pi fre. 

Se konsa, anyen nan sa yo Tags kò, ki nou te wè te jis, tankou, tèks la, ansanm ak tout kò a an jeneral refere a, tankou, background nan. Si ou janm vle chanje background nan, ki k ap pase yo dwe nan yon tag kò. Jis gen règleman sa yo aplike nan yo. 

Se konsa, si nou te pou yo ale nan index.html and-- aktyèlman, nou ka gen yon bagay deyò nan kò a? Si nou te gen, tankou, yon footer oswa yon bagay, li pa ta aplike nan sa a. Men, anyen ki nan sa yo Tags kò ki pral yo dwe afekte pa kò sa a seleksyon ke nou te fè fè yo. Se konsa, si ou te tape yon lòt bagay there-- 

TOMAS Reimers: Se pou nou kondwi ki lakay ou. Se konsa, si nou te gen yon div-- pou ki nan jis yon lòt tag ou ka gen. Mwen pral fèmen li. Oswa kite a fè sa a yon paragraf. Se konsa, p kanpe pou paragraf. Ak nan ki paragraf. Lè sa a, mwen di, "Sa a se tèks." Cool. Lè sa a, mwen te fè règ sa a aplike a yon paragraf olye nan kò a. Ou pral wè li montre kouman li aplike sèlman nan paragraf la fèk fòme, dwa, Men tout bagay la. ki fè sans? 

ALLISON BUCHHOLTZ-AU: Se konsa, sa a se tout kò, men kounye a seleksyon nou jis koresponn ak paragraf la. Se konsa, nou jis gen fonse ak ble pou sa a paragraf espesifik, paske sa a se bagay la sèlman ki se ki fèmen nan tag nan p. 

TOMAS Reimers: ki fè sans sòt nan ki jan bagay sa yo ankapsulasyon lòt bagay? ALLISON BUCHHOLTZ-AU: Epitou, jis yo di, tankou, youn nan fason ki pi bon reyèlman jwenn konfòtab ak CSS se jis fè bagay sa yo tankou sa a, jis eseye li soti. Li trè senp yo tape yon bagay soti, frape Refresh, ak wè sa ki rive. Ak menm jan ak pi CS, eksperimantasyon ka souvan mennen nan yon pi bon entwisyon konpreyansyon. Menm plis konsa pase nou jis, tankou, ap pale ak ou. 

TOMAS Reimers: Absoliman 100% dakò sou pwen sa a. Se konsa, si nou tounen nan sa a, kite la kòmanse diseke ekzakteman ki sa sa yo de fè. Se konsa, nou gen de règ sou sa. Se konsa, youn nan premye se koulè background. Epi ou wè ke nou te mete l ' egal a yon valè, limyè ble. 

Se konsa, nan CSS, CSS se sòt nan trè ki lach sou ki jan w ap pèmèt yo defini koulè. Se konsa, ou ka defini yo pa non. Ou kapab tou fè yon bagay tankou "wouj." Lè sa a, si nou tounen nan sa a, ou ap wè ke background nan se wouj. Ou kapab tou jwenn really-- Mwen panse ke ou ka jwenn bèl kreyatif ak sa a, pa kapab ou? 

ALLISON BUCHHOLTZ-AU: Mwen panse ou ka itilize Egzagòn. Èske pa ou? 

TOMAS Reimers: Yeah. Se konsa, ou ka sèvi ak Egzagòn. Men, mwen ap panse non-ki gen bon konprann. Eske yo pa gen? ALLISON BUCHHOLTZ-AU: Ou ka fè byen yon kèk. Bèl anpil tankou pifò koulè ke ou ka name-- tankou, mwen panse ke somon se youn. 

TOMAS Reimers: Nou ap pral somon eseye. ALLISON BUCHHOLTZ-AU: Mwen panse kouv se nan la. TOMAS Reimers: Yeah. Wè? Se konsa, ou ka jwenn bèl kreyatif. 

ALLISON BUCHHOLTZ-AU: Ou te kapab jwenn bèl kreyatif. Tankou, si ou ka panse a nan Non koulè, li la pwobableman nan la. Si ou reyèlman vle amann detay, ou ka ale Egzagòn. 

TOMAS Reimers: Yeah. Se konsa, ekzadesimal. Si ou nèg sonje sa a tounen soti nan pset fin vye granmoun ou a, imaj Reprann, ou nèg te gen fè fas ak valè Egzagòn sa yo. Ak sòt de Rekapitilasyon sa se sa ki, Egzagòn gen twa valè ki estoke nan li. Se konsa, li nan gwoup nan de ogmantasyon. De nan premye reprezante valè a wouj. Yon sèl nan dezyèm reprezante valè a vèt. Ak youn an pase a se ble? 

Se konsa, FF k ap pase nan reprezante yon ekzadesimal 255. Se konsa, ou gen 255 wouj, 255 vèt, ak 0 pou ble. Ak valè varye ant 0 ak 255. 

ODYANS: Dwa. Se konsa, esansyèlman, nou te ka rechèch entènèt la pou nenpòt ki koulè nou vle, epi idantifye aktyèlman-li te ye nan koulè spectre liste, ak Lè sa a nou te ka mete l 'nan? ALLISON BUCHHOLTZ-AU: Egzakteman. Se konsa, ou gen bèl anpil kontwòl konplè sou koulè yo ou vle nan CSS. Èske nou pwal pale osijè imaj background pita? Oubyen èske nou vle fè sa? 

TOMAS Reimers: Yeah. Absoliman. Se konsa, premye, jis yo montre ke wouj ak vèt se jòn. Men, si ou bezwen kèk èd pou jwenn sa a, ou kapab yon bagay Google tankou "piker koulè." ALLISON BUCHHOLTZ-AU: Oh, li nan tèlman bon. Mwen renmen Koulè selèkteur. 

TOMAS Reimers: colorpicker.com se yon bon egzanp. Ak isit la, ou ap wè ke ou gen yon plen fotoschop-tankou koulè piker. 

ALLISON BUCHHOLTZ-AU: Milimèt-HM. Epitou, bagay sa yo fre yo se ou ka jenere plan koulè pou ke ou pa genyen, tankou, eurte koulè. TOMAS Reimers: Lè sa a, isit la nan valè Egzagòn moute a isit la. Se konsa, ou ka toujou jwenn sou entènèt fondamantalman kote yo jwenn valè a Egzagòn nan. Li pa nan sòt de ki jis, tankou, nou wè koulè yo nan mond lan nan chif yo. Li nan plis ke nou ale sou entènèt epi jwenn sa ki koulè nou vle, ak Lè sa a pran nimewo a desann. Paske li nan jis yon reyèlman fasil fason yo referans bagay sa yo nan CS. 

ALLISON BUCHHOLTZ-AU: Lè sa a, gen nan also-- Mwen bliye non an egzak nan sit la. Men, gen nan definitivman, mwen panse, yon bagay soti nan Adobe ki jenere plan koulè pou ou, ki se vrèman fre, paske ou definitely-- li a pafwa difisil yo konnen ki, oh, si mwen vle sèvi ak sa a koulè, sa ki ta ka yon lòt yon sèl itil yo sèvi ak yon lòt kote sou sit mwen an, tankou, fè li bèl ak limenm. 

TOMAS Reimers: Allison nan ap pale de youn pa Adobe rele Kuler, mwen panse ke. Li nan K-U-L-E-R. ALLISON BUCHHOLTZ-AU: Mwen panse ke sa. Mwen se trè asire w ke nan yon sèl la. 

TOMAS Reimers: pi renmen mwen gen toujou Koulè Scheme Designer. 

ALLISON BUCHHOLTZ-AU: Ooh. 

TOMAS Reimers: Ki se now-- 

ALLISON BUCHHOLTZ-AU: Ah, sa a se bèl. 

TOMAS Reimers: Epi ou ka fondamantalman di, tankou, Mwen vle twa koulè pwochen youn ak lòt. Lè sa a, kite a fè yon bagay bèl. Lè sa a, ou ka jwenn yon egzanp nan sa ki ki ta ka sanble. Lè sa a, si ou hover sou nenpòt nan yo, li ba ou valè a Egzagòn. 

Se konsa, jis kòm yon bon fason yo kòmanse panse sou plan koulè oswa sa ki koulè nan yon sit entènèt ta ka ale byen ansanm. Paske ki ka surprenante pa tankou fasil yo chwazi tankou ou panse. Lè sa a, lòt bagay la fre Mwen te toujou te jwenn sou sit sa a se si ou frape Egzanp, li pral montre sa yon sit entènèt egzanp ta ka gade tankou lè l sèvi avèk ke konplo koulè. De tout fason. 

Retounen nan CSS a vrè. ALLISON BUCHHOLTZ-AU: Men evidamman, nou konnen referans sa yo ta kapab itil. TOMAS Reimers: Non, yo definitivman kapab itil. Se konsa, règ, dezyèm lan, Allison? 

ALLISON BUCHHOLTZ-AU: Yeah. Règ la dezyèm se jis ki koresponn a font nou an. Se konsa, font pwa se jis kalite of-- konsa pwa a ta gen si ou vle jis, tankou, nòmal oswa, tankou, mens polis, oswa nan ka sa a, tankou, karaktè fonse. Mwen bliye. Ki sa ki nan nan si ou te vle l-- ki gen la yon yon sèl mens pase jis, tankou, nòmal? TOMAS Reimers: mwen pa fè sa aktyèlman konnen si gen nan yon sèl mens. ALLISON BUCHHOLTZ-AU: Mwen bliye. Se konsa, font pwa nou tipikman jis itilize pou karaktè fonse. Si ou vle jwenn vrèman an li, nou ap ale nan montre w. W3Schools gen diferan nan tout bagay ou ka fè pou polis. Men, fondamantalman, si ou te janm vle chanje anyen sou font, li nan toujou pral fè, tankou, font-yon bagay. Se konsa, li pral tankou, font-fanmi si w ap ap eseye chanje kalite a vrè. Li pral font-style si ou vle fè li tankou lèt kouran alamen, oswa italik, oswa etajèr. Oswa menm font-koulè, si nou te vle chanje sa. 

TOMAS Reimers: Wi. Se konsa, ou ka chanje sa. Ak sòt de jis Rekapitilasyon kounye a, se konsa ou kapab wè ke nou gen seleksyon an moute isit la. Nou gen sa yo aparèy òtopedik Curly. Lè sa a, nou gen règ séparer pa virgules. ki fè sans? Yeah? Cool. Se konsa, si se sa ki good-- 

ALLISON BUCHHOLTZ-AU: Retounen. TOMAS Reimers: Se pou nou pale espesyalman sou ki kalite seleksyon nou genyen. 'Kòz kounye a nou te sòt de jis montre Tags. Men, ou nèg te kapab wè li posib. Di ou gen de paragraf sou yon paj epi ou vle pou kapab style gen yon sèl men pa lòt la, ou pa jis vle limite tèt ou gen yo sèvi ak diferan HTML aktyèl Tags ba yo diferan estil. 

Se konsa, nou gen twa debaz kalite seleksyon. ALLISON BUCHHOLTZ-AU: Yeah. Se konsa, nou gen tag, ki se ki sa nou ve yo te ap pale de kounye a. Se konsa, sa a, se kalite tankou kò ou oswa p. Lè sa a, nou gen klas, ki se lè nou defini li nan dosye CSS nou an, li nan toujou ale nan dwe dot, kèlkeswa sa ou vle non an nan klas ou yo dwe. Lè sa a ka aplike nan plizyè bagay. 

Di ou gen senk paragraf ak de nan twa a nan yo bezwen yo dwe estile menm bagay la, ou ta aplike yon klas nan li. Lè sa a se jis fason an nou fè li. Nou pral ba ou yon egzanp sou kote sa a aktyèlman montre moute. Men, si ou te gen petèt kèk tag p, apre yo fin li, ou ta ekri, klas egal tou sa klas ou vle pou aplike pou li. Se konsa, tou sa klas seleksyon ke nou vle pou aplike nan sa a paragraf espesifik, nou te ka jis ekri tankou sa a. Natirèlman, mwen panse ke yon egzanp pral fè li pi plis konkrè. 

Lòt yon sèl nan nou gen se id, ki nou don ak yon regle, oswa liv, oswa hashtag. TOMAS Reimers: Octothorpe. ALLISON BUCHHOLTZ-AU: Octothorpe. Ki travay, tou. Lè sa a youn ta dwe vrèman dwe inik. Yo ta dwe aplike sèlman nan yon sèl bagay nan paj ou yo. Se konsa, si sa a, se yon paragraf espesifik, oswa kèk atik nan yon lis, oswa kèlkeswa sa, sa a ta dwe inik. Ak nan menm fason an ke nou jis di, tankou, class = "class1 class2," sa a ka jis pou id nan tou sa nou genyen. TOMAS Reimers: Yeah. Se konsa, kite a definitivman pale sou egzanp isit la. Apre sa, mwen jis ale nan plonje tou dwat tounen nan kòd la. Se konsa, kite pou yo gade nan HTML nou an. Se konsa, nou kounye a gen yon sèl paragraf. Sa a se tèks. Mwen jis ale li modifye li. "Sa a se tèks 1." Lè sa a, nou ap ale nan gen yon "Sa a se tèks 2." 

ALLISON BUCHHOLTZ-AU: Dezyèm yon sèl. TOMAS Reimers: Wi. Se konsa, nou kounye a gen "Sa a se tèks 2," dwa? Epi nou ap ale nan wè ke si nou Reload paj la, ki sa nou ap ale nan jwenn se nou ap pral find-- ALLISON BUCHHOLTZ-AU: Ooh. TOMAS Reimers: Yeah. Nou pral jwenn yon "Sa a se tèks 1, "ak" Sa a se tèks 2. " 

ALLISON BUCHHOLTZ-AU: Lè soti bèl koulè jòn. 

TOMAS Reimers: Epi ou pral wè ki seleksyon nou an kounye a, ki aplike nan p a, oswa paragraf, afekte tou de nan yo, paske tou de peyi yo rankontre nan kondisyon yo ke yo ap tou de yon tag p. Sa fè sans total. Se konsa, kesyon an se, byen, sa ki si nou te vle sèlman jwenn youn? Se konsa, egzakteman menm jan ak Allison te di, nou gen de lòt fason yo kapab fè sa. Mwen pral kòmanse avèk id. 

ALLISON BUCHHOLTZ-AU: Ann kòmanse ak id. 

TOMAS Reimers: Ak tou de nan sa yo, se atribi. Se konsa, atribi egziste nan HTML. Ak ki sa yo ye se yon bagay ke ou ajoute andedan tag nan ki se separe soti nan non an tag. Se konsa, ou ka gen atribi miltip. Yeah? 

ALLISON BUCHHOLTZ-AU: Mwen te jis ale yo di, ki soti nan egzanp ou a soti nan pset 7, si nenpòt nan ou eseye aliman bagay nan sant la, ou ta ka te itilize "Tèks fè aliman = sant." Epi ou remake li pwobableman ta dwe santre tèks ou a oswa ba Navigasyon ou yo. Se konsa, sa se sèlman tou yon atribi ke ou ta ka dwe abitye avèk. TOMAS Reimers: Genyen yon pakèt moun nan atribi ke ou pral wè. Yeah. Tankou bon referans nan pset 7. Nou gen id. Ou ka gen tou klas, bagay sa yo tankou sa a. Yon tag sèl ka gen atribi anpil. Se konsa, kòmanse avèk id, kite a pretann nou vle gen yon id of-- mwen pa konnen. Nou pral rele li espesyal, paske yon sèl sa a, nou ap pral fè fonse, ak soulinye, ak tou sa. ALLISON BUCHHOLTZ-AU: Se pral gen super espesyal. TOMAS Reimers: Se konsa, sa a yon sèl, nou gen id espesyal. Se konsa, wout la nan chwazi ki, lè sa a, se nan main.css, olye ke gen yon tag p, ou fè #special, OK? Epi sa a chwazi bagay ak id espesyal. sa a fè sans a tout moun? ODYANS: Yeah. TOMAS Reimers: Cool. Se konsa, kounye a si nou tounen, nou pral see-- whoops. Yeah. Nou pral wè ke li sèlman seleksyone yon sèl la ak id espesyal. Yeah? Son fre. Wi. 

ODYANS: Èske gen yon bagay atribi nan tou de klas ak yon id? 

TOMAS Reimers: Wi. ODYANS: OK. Lè sa a, kisa k ap rive si ou Lè sa a, bay li kèk règ nan CSS ke konfli? TOMAS Reimers: Absoliman. Nou ap definitivman pral pale sou sa. Se konsa, egzakteman sa ou te resevwa a, ou ka gen klas tou. Se konsa, kite a pretann mwen te gen twa paragraf ak mwen te vle style premye a de, men se pa twazyèm lan. Oke, premye lide ou kapab, byen, mwen te kapab jis bay yon sèl nan dezyèm yon id. Men, ou pa kapab, paske yon ID, egzakteman menm jan ak Allison te di, gen yo dwe inik. 

Se konsa, olye pou yo yon id, ki sa ou ka itilize se ou ka sèvi ak yon klas la. Ak yon class-- sa li pèmèt ou fè se fondamantalman di, sa a ki dwe kòm yon pati nan yon gwoup. Nan ka sa a, gwoup nou an yo rele espesyal. Ak sa ki nou ap ale nan fè Lè sa a, se nou ap ale nan say-- olye ke liv, nou ap ale nan sèvi ak dot. OK? Ak avi ke liv la ak dot sèlman egziste nan dosye a CSS, pa nan HTML a. ALLISON BUCHHOLTZ-AU: Wi. Enpòtan distenksyon. 

TOMAS Reimers: Mwen gen te gen anpil lit, paske mwen mete regle a nan HTML a ak Lè sa a, jis te santi estipid pou yon tan long. Gade kouman li chwazi tou de nan yo menm ki ak sa klas la? Cool. 

Koulye a, bagay sa yo ka gen klas miltip. Se pou nou di mwen te vle fè premye a de gen yon background nan jòn ak de nan dezyèm gen yon koulè font nan ble. OK. Mwen pa vrèman konnen poukisa mwen ta vle fè sa, men mwen kapab. 

ALLISON BUCHHOLTZ-AU: pa ta ka rekòmande li pou sit entènèt ou. Men, pou rezon nou an, li pral fè. 

TOMAS Reimers: Se pa yon bon koulè konplo. ALLISON BUCHHOLTZ-AU: Bon, jòn ak ble yo se koulè lekòl segondè mwen. Mwen pa konnen, menm si. TOMAS Reimers: Allison nan segondè lekòl te gen yon konplo koulè gwo. [Ri] Se konsa, Lè sa a, ki sa nou ka rele sa a se Se pou yo rele this-- konsa nou gen espesyal e nou gen joli. Mwen sijere, pou sa a, ou sèvi ak non pi plis deskriptif. ALLISON BUCHHOLTZ-AU: Yeah, mwen ta rele sa a, tankou, jòn oswa ble. 

TOMAS Reimers: Nou pa ap reyèlman fè yon sit entènèt reyèl, ki se poukisa nou pa ap fè sa. Men, si ou aktyèlman te gen yon sit entènèt reyèl, ou ta ka gen, tankou, header atik, kontni atik, premye mo, bagay sa yo tankou sa, ki pèmèt ou yo dwe pi plis deskriptif. Sa yo se reyèlman jis tankou varyab. Yo ta dwe fè yo te rele nan yon fason kote ou kapab, like-- yeah, kòm sa yo. Pafè. 

Se konsa, koulè background. Lè sa a, nou ap ale nan say-- konsa a fason yo chanje koulè se jis "koulè." Epi nou ap ale nan fè li ble. Sa a fre. Se konsa, kounye a nou gen nan de premye gen espesyal. Next yon sèl k ap pase yo gen "class = bèl." ALLISON BUCHHOLTZ-AU: Lè sa a, ou pral vle ajoute "bèl" nan yon sèl la presegondè. TOMAS Reimers: Wi. Lè sa a, nan yon sèl la presegondè, yo ajoute "bèl," sa k ap pase se ou jis gen yon espas. Se konsa, atribi nan klas se yon lis espas-separe nan tout klas yo sa ki aplike a ki tag. OK? Li pa tankou yon sèl sa a ki dwe nan kèk kalite klas espesyal ki rele "Espesyal, espas, bèl." Li fè pati de classes-- espesyal ak bèl. Wi? Cool. 

Lè sa a, si nou gade nan sa k ap pase, nou ap ale nan wè ke premye yon sèl gen background jòn, tèks nwa. Dezyèm yonn- 

ALLISON BUCHHOLTZ-AU: --has fonse background jòn ak tèks ble. Ak yon dènye nou an jis gen nan tèks ble ke nou asiyen nan li. 

TOMAS Reimers: Cool? Ki jan seleksyon travay? Awesome. 

ALLISON BUCHHOLTZ-AU: nou vle pale sou konfli a kounye a lè sa a? 

TOMAS Reimers: Se konsa, yeah. Absoliman. Se konsa, sa k ap pase si ou gen yon konfli, dwa? Se pou nou pretann yon sèl nan premye kouche moute yon bagay like-- ALLISON BUCHHOLTZ-AU: Petèt yon sèl sa a chanje jan nou koumanse a? TOMAS Reimers: Yeah. Se konsa, nou ap ale nan fè "bèl" chanje background nan somon. ALLISON BUCHHOLTZ-AU: Ou se jis ak tout koulè yo gwo jodi a, Tomas. TOMAS Reimers: Yeah. Paske mwen te jwenn deyò mwen kapab itilize somon kòm yon koulè reyèl. Se konsa, nou ap sèlman pral fè sa. Mwen panse tou Sunset se yon koulè reyèl. ODYANS: Sunset nan yon koulè reyèl? ALLISON BUCHHOLTZ-AU: Se pou nou eseye li. TOMAS Reimers: Apre Demo sa a jis paske nan ka li dega moute, Mwen pa vle yo dwe debogaj. Se konsa, nou konnen somon nan yon koulè reyèl. Se konsa, nenpòt eseye devine sou sa ki pral rive? 

ALLISON BUCHHOLTZ-AU: Nenpòt lide? 

ODYANS: [fèbl]. 

TOMAS Reimers: Yeah. Se konsa, ou te resevwa li egzakteman dwat. Fondamantalman, li pran an dènye règ ke li te bay yo. 

ALLISON BUCHHOLTZ-AU: Se konsa, sa a se kote kaskad vin antre nan efè. 

TOMAS Reimers: Se konsa, sonje ki jan nou te gen ki kaskad dra style? Se konsa, pa sa, nou kalite vle di ke nou gen yon pakèt moun sou règ ki aplike sou tèt chak lòt, epi yo kapab tou pase sou desizyon youn ak lòt. 

ALLISON BUCHHOLTZ-AU: Se konsa, tou sa a nan pati anba a pral pase sou desizyon sa a nan tèt la. Ou te kapab gen règ ki konplètman anile yon bagay davans. Sa a tou poukisa ou vle yo dwe atansyon lè w ap manier, pou w pa ap kreye règ ki w ap sèlman konplètman prensip. 

TOMAS Reimers: Oswa petèt ou vle recouvrir règ yo. 

ALLISON BUCHHOLTZ-AU: Oswa petèt ou fè. Wi. 

TOMAS Reimers: Pran pòz ou gen yon klas ki aplike nan pifò bagay sa yo, men kite a di ou vle chanje a koulè background wouj ak font la pwa fonse pou pifò bagay sa yo, men pou yon sèl, ou sèlman vle koulè a ​​background yo dwe wouj men ou vle lòt nan tout pwopriyete, ou ta ka fè yon bagay tankou "font-pwa = nòmal," ki ta Lè sa a, defèt chanjman sa a karaktè fonse. Yeah? Yon fwa ankò, fason ki pi bon, mwen panse ke Allison te di li, se jis pratike. 

ALLISON BUCHHOLTZ-AU: eksperimantasyon. 

TOMAS Reimers: Pratike, pratike, pratik, ak eksperyans. Mwen konnen yon anpil nan moun ki panse ke CSS se jis yon anpil nan devine-ak-chèk nan fen a nan jounen an, kote si ou vle fè fè yon bagay tankou, ou gen yon lide ki graj, men ou toujou pwobableman bezwen eseye li soti a asire w ou konnen ki sa li sanble. 

ODYANS: Lè w ap aplike klas, plis pase yon paragraf la menm oswa seksyon, fè li pwoblèm sa lòd ou kapab tape yo nan quotes yo? 

TOMAS Reimers: Non, pa nan tout. 

ALLISON BUCHHOLTZ-AU: Sa ki enpòtan se lòd la nan fèy style CSS ou. ODYANS: Èske ou ta kapab repete kesyon an? TOMAS Reimers: Oh. ALLISON BUCHHOLTZ-AU: Nan klas, lè w ap bay klas nan yon bagay nan HTML a, fè li enpòtan ki lòd yo ap nan? Li pa enpòtan lòd la. Sa ki enpòtan se lòd la nan seleksyon klas nan CSS ou a, nan fèy style ou. 

TOMAS Reimers: Son bon? 

ALLISON BUCHHOLTZ-AU: Lovely. 

TOMAS Reimers: Lè sa a, nou ap ale nan kontinye to-- ALLISON BUCHHOLTZ-AU: Ki sa nou gen vin apre a? Mwen bliye. Oh, nou jis gen egzanp. Men, nou te kalite fè sa yo. Nou te fè egzanp sou vole a. 

TOMAS Reimers: Nou jwenn yo konbine seleksyon yo byento. 

ALLISON BUCHHOLTZ-AU: Oh, nou jwenn nan konbine seleksyon. TOMAS Reimers: Se konsa, kèk egzanp se nou gen # Dog-- liv, oswa hashtag, oswa octothorpe, oswa kèlkeswa sa ou vle rele that-- byen file. 

ALLISON BUCHHOLTZ-AU: Sharp chen. 

TOMAS Reimers: Lè sa a, ou gen .pets. Yon bagay gen yon id nan chen, gen nan yon sèl chen sou paj la. Yon bagay gen yon id nan chat, gen nan yon sèl chat. Gen dwa gen anpil bèt kay sou paj la. Se poutèt sa nou te bay ke klas yo. Ou gen yon egzanp nan p. Lè sa a, se konsa youn nan la dènye egzanp, ki se yon bagay nou pa te pale osijè de, se sa ki pase lè ou konbine yo. Se konsa, p.pets. 

Se konsa, pou sa, se pou yo tounen nan la Kòd ak prezante another-- yeah. Se konsa, tounen isit la. 

ALLISON BUCHHOLTZ-AU: Mwen santi tankou sa a se really-- tankou jis kap nan egzanp se reyèlman wout la yo aprann sa a. Se konsa, sa a, se sa n ap fè. 

TOMAS Reimers: Se konsa, kite a pretann nou sèlman vle chwazi tèks 2, dwa? Se konsa, nou definitivman pa kapab fè sa ak yon id. Oke, nou ka fè sa ak yon id, men li pa gen yon id. Mwen te kapab ajoute yon sèl, men kite a pretann ke mwen pa t 'vle ajoute yon oswa li deja gen yon lòt bagay. Mwen pa ka fè sa ak sa. Tag a se definitivman pa inik, dwa? Ak ni se klas la. Men, ou ka konbine bagay sa yo. Se pou nou di nou te vle fè yon bagay ki aplike sèlman nan bagay ki gen espesyal nan klas ak ki gen klas la bèl. 

Se konsa, sa ou ka fè se nan main.css, ou ka di, se pou yo premye efase sa a. Ou ka konbine sa yo. Se konsa, ou kapab fè .special. Pa gen espas. Jis .special.pretty. Ki sa sa vle di se yon bagay ki se tou de espesyal ak bèl. ki fè sans? Men, si nou ale isit la, ki sa w ap ale nan wè se règleman sa-a aplike sèlman nan la dezyèm yon sèl, ki te gen tou de nan sa yo. Epi ou ka fè sa pou yon anpil nan bagay sa yo. Ou ka say-- kite nan pretann mwen sèlman te vle fè bagay sa yo ki gen klas nan bèl ak ki se tou yon tag paragraf. Se konsa, p.pretty. Se pou yo pretann ke mwen te gen yon bagay trè sou kò a tag. OK? Mwen ka kouri sa a epi mwen ka wè ke li nan sèlman ale nan aplike nan bagay ki paragraf avèk klas la bèl. Epi ou ka konbine sa yo, fondamantalman, kòm anpil jan ou vle. Se konsa, ou ka jis mete yo ansanm. ki fè sans? ALLISON BUCHHOLTZ-AU: Se konsa, sa a kalite se pi plis itil lè, Tomas te di pi bonè, petèt ou gen yon sit entènèt trè konplike, epi ou deja gen yon anpil nan règleman sa yo ekri, epi ou jis bezwen konbine de soti nan anvan. Tankou olye pou yo ekri yon antye nouvo seleksyon ak chanje li a, ou ka jis konbine yo kote li doubl. 

TOMAS Reimers: Oswa ou ta ka jwenn out-- pafwa gen nan yon klas ki fè koulè font la tankou ble, ak gen nan yon lòt klas ki fè ble a background. Epi ki jis pa pral travay. Se konsa, ou ekri yon ka espesyal, kote, like-- men si li gen tou de, ki sa w ap pral fè se w ap ale nan fè sa-a yon sèl sa a lonbraj nan ble ak yon sèl sa a sa a lòt lonbraj nan ble. Dwa? 

ALLISON BUCHHOLTZ-AU: Bon pou sa yo kalite eksepsyon. TOMAS Reimers: Se konsa, panse osijè de pwoblèm ki ka rive lè ou konbine yo. Cool. Se konsa, tounen nan prezantasyon nou an. ALLISON BUCHHOLTZ-AU: Nou prèske la. TOMAS Reimers: Epi li te sispann konekte. ALLISON BUCHHOLTZ-AU: Oh, pa gen okenn. ALLISON BUCHHOLTZ-AU: CS nan biwo a, entènèt desann. Oh, paradoks la. 

TOMAS Reimers: Se konsa, erezman, nou kapab prezante san yo pa entènèt la, mwen devine, paske nou gen tout glisad yo isit la. Se konsa, kite a pale sou la relasyon nan Tags. ALLISON BUCHHOLTZ-AU: Dwa. Se konsa, jis kalite ale koupe nan sa Tomas te di, sa a se jis yon lòt fason yo fè li. Se konsa, nou gen kèk paran seleksyon ak yon seleksyon timoun. Se konsa, nan egzanp sa a isit la, nou gen kèk kò ak yon navbar klas, bouton klas. Ah. 

TOMAS Reimers: Oh, regrèt. 

ALLISON BUCHHOLTZ-AU: Lè fondamantalman, sa sa vle di se chwazi tout nan timoun yo, tankou tout nan sa yo kalite seleksyon, nan seleksyon paran sa a. Ak sa yo se yo menm sèlman li nan janm ale nan aplike nan. Mwen pa konnen si ou gen yon pi bon fason of-- TOMAS Reimers: Se konsa, mwen devine wout la nan panse sou sa a se sonje anvan ki jan nou sòt de tankou mete yo ansanm. Lè sa a, sa vle di yon sèl eleman ki matche ak chwa tout moun sa yo. Ki sa ki sa a ap di se, mwen vle ou matche ak tout bagay nan some-- mwen vle ou jwenn yon seleksyon. Lè sa a, nan ki, mwen vle ou matche ak nouvo bagay. Dwa? Se konsa, nan CSS, li tout sou sòt de ke yo te kapab matche ak bagay sa yo. Epi ou ka eseye matche ak atik nan lòt atik. 

Se konsa, kite a aktyèlman fè yon egzanp, e nou panse ki pral klarifye. Se konsa, kite a pretann nou gen espesyal, espesyal bèl, kèlkeswa sa. Lè sa a, nou gen yon lyen, OK? Se konsa, sonje, se yon se yon lyen. Li pa nan ale nan ale nenpòt kote. E nou pral bay li lyen nan klas, mwen devine. Se pou yo bay li a class-- ban m 'yon lide. ALLISON BUCHHOLTZ-AU: Cool. TOMAS Reimers: Coo-- kite nan ale li klas la bèl. Poukisa nou pa? 

ALLISON BUCHHOLTZ-AU: OK. TOMAS Reimers: Se konsa, kounye a trè bagay yo ale nan fè background nan ble, koulè background nan somon. Ki fè sans. Men, si nou fè this-- 

ALLISON BUCHHOLTZ-AU: ou vle ajoute tèks se konsa HyperLink a aktyèlman montre moute? TOMAS Reimers: Sa ta dwe yon bon apèl. ALLISON BUCHHOLTZ-AU: 'dwat Kòz kounye a nou ap jis pral jwenn pa gen anyen. TOMAS Reimers: Se konsa, sa a se yon lyen. "Sa a se yon lyen." Oh, ak sa a ki pral yo dwe yon lòt lyen. Se pou yo bay li klas la "fre." Ou se dwa. Cool. Se konsa, kounye a nou ap ale nan gen tan pwan sa a. Nou pwal voye jete yon sèl. Nou gen yon sèl nan la tag espesyal, ak nou menm tou nou yo ale nan gen yon sèl nan tag a bèl. E yo gen dwa kounye a ki sa nou ap ale nan fè se nou ap ale nan fè cool-- ki sa nou vle li fè? ALLISON BUCHHOLTZ-AU: Èske nou ka fè l 'pi gwo? TOMAS Reimers: Se pou nou bay li yon limit fwontyè yo. ALLISON BUCHHOLTZ-AU: Nou te ka fwontyè. TOMAS Reimers: Yeah. Se konsa, nou ap ale nan fè yon bagay tankou, is-- fwontyè ak nou ap ale nan esplike sa a tout nan yon dezyèm fwa. Pou now-- 

ALLISON BUCHHOLTZ-AU: Pou modèl nan bwat. TOMAS Reimers: Men, pou kounye a, nou ap jis ale nan bay li yon limit fwontyè yo. Se konsa, sa sa vle di se w ap pral wè lyen sa yo. Epi ou ap ale nan wè yo ke yo gen sa yo, tankou, lèd fwontyè nwa, ki se fre. 

ALLISON BUCHHOLTZ-AU: Sit entènèt nou an nan tèlman bèl. 

TOMAS Reimers: Yeah. Sit entènèt nou an se pè. Se konsa, de sa yo, se lyen yo, ak yo parèt. Koulye a, kite a pretann mwen sèlman te vle fè sa a si li pa t 'ki nan yon bagay ki te gen yon background nan somon. Se konsa, sonje ke yon sèl sa a gen yon background nan somon, paske li nan nan klas bèl. 

Men, nou vle di ke se sèlman refwadi ki fè yo nan klas espesyal, pa nan klas bèl, ta dwe gen ki fwontyè. Oke, ki sa ou ka fè se ou ka di, .special, espas, .cool. Ak sa ki ki nan fè, lè ou panse sou li, se li nan fondamantalman li di yo: OK, jwenn m 'tou sa ki matche ak chwa espesyal. Lè sa a, nan sa yo tags, jwenn m 'tou sa ki nan fre. ALLISON BUCHHOLTZ-AU: Se konsa, yon lòt fason ke sa ta kapab bon yo reflechi sou sa a, yo pote l 'tounen nan C, se jis tankou lide a nan dimansyon. Se konsa, lè ou gen kèk seleksyon, tankou sa yo ke nou ve yo te ap travay pou anvan sa a, paj tout antye entènèt ou, tout nan HTML ou se nan sijè ki abòde ou, dwa? Men, lè nou gen sa yo relasyon paran-pitit, li a kòm si w ap konble desann kote w ap chèche nan yon kote espesifik, kòm si, tankou, nou ap chèche nan yon fonksyon espesifik olye pou nan tout dosye nou yo. ODYANS: Se konsa, avèk ki nan tèt, ta li te konte si nou te gen changed-- ALLISON BUCHHOLTZ-AU: Lòd la? ODYANS: klas --the nan CSS .cool, espas, .special? ALLISON BUCHHOLTZ-AU: Wi, paske Lè sa a, ki ta ka di, sijè ki abòde li nan tou sa ki gen fre, ak Lè sa a gade nan ki sa has-- Mwen vle di, tankou, nan ka sa a, Mwen pa panse li ta chanje li. 

TOMAS Reimers: Si nou te di ki sa? Padon. 

ALLISON BUCHHOLTZ-AU: Si nou sijè ki abòde li yo refwadi ak Lè sa a, gade pou bagay sa yo soti nan espesyal, li ta dwe menm bagay la, aktyèlman. 

TOMAS Reimers: Se konsa, li pa ta dwe. 

ALLISON BUCHHOLTZ-AU: Li pa ta? Oh, oh byen. Se mwen menm ki mal. 

TOMAS Reimers: Se konsa, rezon ki fè yo li nan diferan mistake-- komen se ke kounye a sèlman lyen an gen fre, dwa? Mwen devine kesyon mwen an ou nèg se, sa sou paj sa a se matche pa .cool? Gen de Tags isit la, dwa? Ki se yon sèl sa a ak yon sèl sa a. Tou de matche ak fre. Pa gen anyen lòt moun fè. Se konsa, si ou te di, .cool, espas, .special, ki sa w ap ale nan di se, nan sa yo Tags, ki sa ki espesyal? ALLISON BUCHHOLTZ-AU: Hm. Sa a ki sa l-- dwat. Paske li nan tankou jis yon bagay isit la. 

TOMAS Reimers: Se konsa, li chwazi pa gen anyen. 

ALLISON BUCHHOLTZ-AU: Lè nou konsidere ke ak espesyal, nou ap nan tags sa yo isit la. 

TOMAS Reimers: Moun sa yo ki ak tout moun. ODYANS: OK. Se konsa, moun ki soti nan pou pi devan nan tags koupe? 

TOMAS Reimers: Wi. ki fè sans? Ki jan li nan fondamantalman ap eseye etwat sijè ki abòde. ALLISON BUCHHOLTZ-AU: Yeah. Mwen panse ke sa a, se pwobableman a pi fasil fason yo reflechi sou li. 

TOMAS Reimers: Se konsa, nou te jwenn sa a, ak nou jwenn sa a tou de matche espesyal. Lè sa a, nou ap mande, nan mesye sa yo, sa ki nan fre? E nan lespas de yon sèl sa a, fre sa a yon sèl la. Nan yon sèl sa a, pa gen anyen nan fre. Se konsa, sa a se tag a sèlman ki rete. 

ALLISON BUCHHOLTZ-AU: Lè nou konsidere ke fre se jis nan sa yo yon tags la. TOMAS Reimers: Egzakteman. Ak sa ki nan espesyal nan sa yo? Pa gen anyen. Koulye a, sa m 'pral di se si pa te gen okenn espas, w ap mande sa ki nan fre ak special-- oswa sa ki nan bèl ak espesyal, dwa? Si w di .special.pretty, ki nan menm bagay la kòm .pretty.special. 

Paske sa retire espas ki la se mande se, lè ou di .special, w ap mande, OK, ki sa yo se espesyal? Lè sa a, nan tout sa yo, ki sa yo se tou trè, ki se menm bagay la, gramatikalman, kòm mande, sa ki nan bèl, ak Lè sa a nan tout sa yo, sa ki nan tou espesyal? Dwa? Li nan diferans lan nan sa ki nan ki nan ki sa ki. ODYANS: OK. TOMAS Reimers: Yeah. Awesome. Se konsa, avèk ki nan tèt then-- 

ALLISON BUCHHOLTZ-AU: Mwen panse ke dènye nou an bagay se (NAN FANCY Britanik aksan) modèl nan bwat. 

TOMAS Reimers: box-- [Chuckles a] Mwen renmen fason an Allison di ke. Se konsa, bagay la modèl bwat. 

ALLISON BUCHHOLTZ-AU: Jis gen yon bwat, mwen pral modèl bwat ou. TOMAS Reimers: Se konsa, kite nan pale sou sa. Se konsa, kounye a nou te pase yon anpil nan tan ap pale de seleksyon. Depi kounye a, ou nèg yo se pwobableman, tankou, mèt nan selectors-- ou konnen, Ki jan yo chwazi egzakteman kontni an ki ou vle manipile sou ekran an. 

Se konsa, koulye a kesyon an se, ki jan egzakteman ou ka manipile li? Se konsa, mwen devine ki pi fondamantal la fason yo panse osijè de sa se, byen, ki sa egzakteman se yon eleman nan CSS? Nou te pase yon anpil tan pale de, sa ki se yon tag, oswa ki sa ki pi fondamantal la reprezantasyon nan yon tag? 

Yon bon fason yo reflechi sou ki se, se sa ki fòm se somon? Ki fòm se la, tankou, somon ki gen koulè pal background? 

ODYANS: Li se yon rektang. 

TOMAS Reimers: Li se yon rektang, dwa? 

ALLISON BUCHHOLTZ-AU: Pa t 'yon kesyon Trick. [Ri] 

TOMAS Reimers: Pa eseye fè je chèch ak ou nèg sa a ta. Se konsa, nou gen rektang sa a. Ak tag a se yon p, dwa? Se konsa, ki ba nou bon kwayans ke paragraf la se reprezante kòm yon rektang, nan omwen nan tèt ou a nan navigatè a, ki li se. 

ALLISON BUCHHOLTZ-AU: Mwen vle di, navigatè yo, se tipikman rektangilè, se konsa li fè sans. 

TOMAS Reimers: Lide a isit la se ke tout nan etikèt yo ki nan CSS yo reprezante kòm yon rektang. Ak chak rektang gen kat pati selon CSS, OK? Ou gen kontni an vrè. Sa a kote tèks la bay manti. 

ALLISON BUCHHOLTZ-AU: Petèt foto ou. 

TOMAS Reimers: Yeah. Ou gen padding, ki se jis kèk kalite espas blan. Lè sa a, ou gen yon limit fwontyè yo. Lè sa a, ou gen Marge, ki se espas blan deyò nan sa. Se konsa, ki pa fè okenn sans yo ba nenpòt moun, se konsa nou ap pral pale sou sa pou yon dezyèm fwa. Se konsa, isit la menm, ki sa nou ap ale nan fè se nou ap ale nan kreye kèk div, OK? Eskize m 'pandan I-- 

ALLISON BUCHHOLTZ-AU: Mwen santi mwen renmen nou ta dwe mete yon foto bèl nan. 

TOMAS Reimers: Nou definitivman ta dwe. 

ALLISON BUCHHOLTZ-AU: Mwen santi mwen tankou tout moun te kapab benefisye de yon bèl foto, se tout. 

TOMAS Reimers: Èske nou ka tout benefisye de a-- 

ODYANS: Yeah, asire w. TOMAS Reimers: OK, fre. Se konsa, nou ta dwe mete yon bèl foto nan yon kote. ALLISON BUCHHOLTZ-AU: Mwen santi mwen tankou yon Cute Bunny kapab itil kounye a. TOMAS Reimers: Asire w. ALLISON BUCHHOLTZ-AU: Fen nan semèn nan. Gen yon bagay adorab-- 

TOMAS Reimers: Ki jan bout yon ti chat? 

ALLISON BUCHHOLTZ-AU: Yon chat travay, tou. 

TOMAS Reimers: Cool, paske gen nan yon sit pou sa. Yo rele li PlaceKitten. ALLISON BUCHHOLTZ-AU: Sa se gwo. TOMAS Reimers: Wi. ALLISON BUCHHOLTZ-AU: Jis pou, tankou, imaj kontneur nan sit entènèt ou. TOMAS Reimers: Milimèt-HM. Genyen tou PlacePuppy. Apre sa, nan PlaceBacon. 

ALLISON BUCHHOLTZ-AU: PlaceBacon? Vrèman? 

TOMAS Reimers: Oh, nou pa fè sa gen aksè entènèt isit la. 

ALLISON BUCHHOLTZ-AU: [Ap plenn] Trajik. TOMAS Reimers: Sinon, Mwen ta montre ou nèg ki jan yo mete imaj nan sit entènèt ou. Nou pral eseye jwenn sa a k ap travay anvan nou gen yo ale. Men, pou kounye a, nou ap jis pral pale nan koulè lè sa a. Nou vle mete foto nan kittens-- 

ALLISON BUCHHOLTZ-AU: Nou te fè sa. 

TOMAS Reimers: --the entènèt la desann pou moman sa a ke yo te. Se konsa, nou gen de div, epi nou ap pral bay yo de idantifikasyon. Nou pral rele li "Premye" ak "dezyèm fwa." Se konsa, didantite = "premye." E nou pral ba yo de koulè. Se konsa, kouman nou chwazi yon bagay ak yon id nan "premye"? ALLISON BUCHHOLTZ-AU: Dot oswa regle? ODYANS: Sharp. TOMAS Reimers: Sharp, pafè. Sharp, regle, kèlkeswa sa we-- 

ALLISON BUCHHOLTZ-AU: Anpil nan bagay sa yo rele li. 

TOMAS Reimers: OK. Nou pral rezoud sou hashtag, ak se sa ki nou ap ale nan ale avèk yo. OK? 

ALLISON BUCHHOLTZ-AU: hashtag. 

TOMAS Reimers: Se konsa, hashtag a an premye. 

ALLISON BUCHHOLTZ-AU: Se konsa, ou ka tweet seminè a hashtag CSS, hashtag fre. TOMAS Reimers: Hashtag awesomeness. ALLISON BUCHHOLTZ-AU: Hashtag awesomeness, wi. TOMAS Reimers: OK. Se konsa, nou gen "premye" ak "dezyèm fwa." Se konsa, premye, nou ap ale nan gen yon koulè background nan wouj. ALLISON BUCHHOLTZ-AU: Uh, kolon. TOMAS Reimers: Wi. ALLISON BUCHHOLTZ-AU: Mwen pral ou plas-korektè. TOMAS Reimers: Allison nan te resevwa m '. Jan nou koumanse-koulè nan blue-- 

TOMAS Reimers: Mòv! 

TOMAS Reimers: Mòv. ALLISON BUCHHOLTZ-AU: Wi. Koulè wouj violèt nan koulè pi renmen m 'yo, epi nou pa te itilize li ankò. 

TOMAS Reimers: Vyolèt. ALLISON BUCHHOLTZ-AU: Vyolèt. Sa ap travay. 

TOMAS Reimers: Se konsa, nou ap ale nan gen de div. Yo ap ale nan dwe totalman vid. Nou ta dwe pwobableman gen kèk tèks. Se konsa, "premye" a pwal "Hello." Ak "dezyèm" ap say-- la 

ALLISON BUCHHOLTZ-AU: Goodbye. 

ODYANS: - "lemonn." Hello, orevwa. ALLISON BUCHHOLTZ-AU: Mwen te wè yo nan konsè lòt semèn nan. TOMAS Reimers: The Beatles? ALLISON BUCHHOLTZ-AU: Pou ril. Yo ap pa sa ki gwo. Mwen pa renmen li. 

TOMAS Reimers: Nou gen "Alo" ak "Goodbye." Epi ankò, CSS se jis pè, paske li rekonèt koulè nou an. pa bezwen menm enkyete ke yo egziste. Yo fè. 

ALLISON BUCHHOLTZ-AU: Yo egziste. 

TOMAS Reimers: Se konsa, mwen panse ke gen CSS 255 mo yo pale sou koulè. Si ou ka panse a yon koulè deyò moun 255, tankou, mwen pral enpresyone. ALLISON BUCHHOLTZ-AU: Yeah. Mwen panse ke ou nèg ka gen jis vini nan bon apre. 

TOMAS Reimers: Se konsa, isit la, ou pral wè nou gen de bwat dwa sou tèt chak lòt, dwa? HELLO ak OREVWA. 

ALLISON BUCHHOLTZ-AU: Gen nan pa gen espas nan ant. Yo ap jis smooshed dwa sou tèt chak lòt. 

TOMAS Reimers: Se konsa, premye bagay la Mwen devine nou ta dwe pale sou se kite a say-- tou yeah. Se konsa, CSS reprezante yo kòm sòt de bwat. Epi kòm bwat, yo gen kontni. Ak kontni an dwa kounye a se sòt de HELLO nan oswa orevwa nan e ke sa a li. OK? 

Se konsa, youn nan bagay ki premye ou ka fè se ou ka ajoute pwotèj. Ranbouraj di konbyen lajan espas li ta dwe kite sou chak bò. Se konsa, kite a di mwen vle di 10 piksèl sou chak bò. Apre sa, mwen pral sèksyone ke nan yon dezyèm fwa. ALLISON BUCHHOLTZ-AU: Tout bagay sa yo isit la yo pral yo dwe sitou nan piksèl pou tout rès seminè a. W ap ale nan wè ke li gen kèk espas bò kote l ', dwa? Se konsa, sa ou pa wè isit la se gen nan sa a sòt envizib nan padding sou chak bò, ki di, tankou, OK, ou gen bwat ou nan content-- 

ALLISON BUCHHOLTZ-AU: Èske ou vle jis rale moute eleman nan enspekte? 

TOMAS Reimers: Yeah, sa a, se yon bon lide. ALLISON BUCHHOLTZ-AU: Epitou, mwen jwenn ki eleman nan enspekte se yon bon fason eseye figi konnen si gen yon bagay k ap pase sa ki mal, yon bagay inatandi rive, enspekte etikèt yo ak wè sa ki li a tankou écrase se itil. 

TOMAS Reimers: Se konsa, mwen pa fin sèten si ou nèg ka wè sa a koulè. Èske ou ka? Ou pral wè sa a padding sou sòt nan nan kwen. Lè sa a, ou wè aktyèl la kontni nan ble, dwa? Se konsa, sa a, se trè a Basics nan modèl la bwat. Ou gen kontni. Lè sa a, ou gen pwotèj. 

ODYANS: Poukisa pa fè sa ou jis itilize bwat la andedan the-- 

ALLISON BUCHHOLTZ-AU: Dwa. Paske li jis chwazi eleman nan kounye a. 

TOMAS Reimers: Wi. Lòt bagay. Se konsa, kite a pale sou ki padding lòd pou yon dezyèm fwa. Se konsa, nan CSS, mezi bezwen gen yon inite. Se konsa, premye ou gen kantite lajan an. Se konsa, nan ka sa a, nou te di 10. Lè sa a, youn nan pwochen nou te di se piksèl, PX. Lòt moun ou ka gen yo bagay sa yo tankou santimèt, pous. Ou ka fè bagay sa yo renmen, ki sa ki 10 pous? Epi li nan pral fè ridikil. 

ALLISON BUCHHOLTZ-AU: Oh, ti gason. 

ODYANS: Ola. 

TOMAS AK ALLISON: Yeah. TOMAS Reimers: Se konsa, sa a, se tout pwotèj. Mwen pral tounen nan piksèl. 

ALLISON BUCHHOLTZ-AU: piksèl gen tandans yo dwe, tankou, estanda la. Lè ou gade nan yon anpil nan sit entènèt, yo sitou travay nan piksèl. TOMAS Reimers: Se konsa, w ap ale nan wè swa pixels-- lòt yo menm ki ou wè se em, ki se youn em se egal a wotè nan font la ki ou ap kounye a lè l sèvi avèk. 

ALLISON BUCHHOLTZ-AU: mm. TOMAS Reimers: Li se yon bon fason yo di, tankou, mwen vle kòm anpil espas kòm font mwen se pran. ALLISON BUCHHOLTZ-AU: pa t 'konnen. Ou aprann yon bagay nouvo chak jou. TOMAS Reimers: Gen yon anpil nan mezi nan CS. Mwen sijere ou gade yo moute. Pou tout ka ou, mwen panse ke piksèl yo ta dwe ase. Apre sa, yo ap tou sa w ap ale nan wè nan majorite a nan egzanp fè sou entènèt. Se konsa, nou pral kite li nan piksèl. 

Ou kapab tou, mwen ta dwe say-- konsa padding kouche tout ranbouraj yo. Ou kapab tou fè yon bagay tankou "Padding-tèt" nan jis set-- ALLISON BUCHHOLTZ-AU: Petèt nou pral jwenn nou "HELLO" tounen. TOMAS Reimers: --to jis mete nan padding sou tèt la e pa gen anyen lòt bagay. Se konsa, kat kòmandman yo se padding-tèt, padding-anba, padding-kite, ak padding-dwa. 

ALLISON BUCHHOLTZ-AU: Jis tankou ou ta atann pou yon bwat. 

TOMAS Reimers: Yeah. Pa gen anyen twò fou a. ki fè sans? Se konsa, se sa ki pwotèj. Mwen pral mete tout ranbouraj yo tounen nan 10. Lè sa a, mwen pral pou avanse pou sou fwontyè. 

Se konsa, sa se se fwontyè fwontyè a yon lòd etranj. Li pran sòt de twa bagay nan yon fwa. Se konsa, premye a se ki jan gwo ou vle li nan dwe kòm yon mezi. Yon fwa ankò, mwen sèlman lè l sèvi avèk piksèl. Epi bagay la pase mwen ta dwe ajoute nan mezi se bagay ki youn ki pa bezwen yon inite se 0. Li nan aktyèlman kòrèk bay 0 yon inite, paske 0 se 0 atravè pous, piksèl, santimèt, kèlkeswa sa. Li tout jis vle di 0, dwa? Se konsa, premye ou ba li mezi a. 

Lè sa a, ou ba li style la. Se konsa, mwen pral di "solid." Epitou, n ap pale sou sa sa vle di. Lè sa a, anfen, ou ba li yon koulè. Se konsa, mwen pral di "nwa." Ak sa yo, se tout bagay sa yo nou te kounye a wè anvan, eksepte pou style, men nou pwal pale sou sa. Se konsa, ou nèg te wè mezi, epi ou te wè koulè. Ak sa ki k ap pase se nou jwenn sa a bèl fwontyè nwa bò kote l ', dwa? Ou nèg wè ki jan nou te fè sa? 

ODYANS: Yeah. 

TOMAS Reimers: Cool. Se konsa, sa se sa? Se konsa, premye nan tout, li nan yon sèl pixel. Sa a pwòp tèt ou-evidan ase, dwa? Tankou, li nan yon sèl pixel epè. Oswa li ta yon sèl pixel, men mwen agrandi nan, se konsa li nan yon ti jan ti kras pi plis pase sa. 

ALLISON BUCHHOLTZ-AU: Epi nou gen sa a rezolisyon televizyon ridikil. 

TOMAS Reimers: Yeah. Ou ka fè li pi gwo, ki pi piti, kèlkeswa sa. Se konsa, isit la nan yon fwontyè de-pixel. Ou pral wè li nan de fwa tankou epè. Next bagay ou genyen se koulè. Sa a pa enteresan. Mwen pa pral pale sou sa, vrèman. 

ALLISON BUCHHOLTZ-AU: Men, style la ta ka jis yon ti kras ki enteresan. 

TOMAS Reimers: Yeah. Se konsa, style, gen yo se yo menm kèk ke mwen wè itilize souvan. Premye yon sèl la solid, youn nan pwochen pwentiye an, ak brize youn nan dènye a. Ak isit la se chaje. Ou pral wè yo ke yo ap yon pakèt moun sou pwen, dwa? Yon bon fason yo sòt de jwenn yon fwontyè bèl prale a, tirè yo se tou trè popilè. 

ALLISON BUCHHOLTZ-AU: Lè sa a, nan kou, mwen se asire w gen anpil lòt Styles ke ou ka jwenn. Epi nou gen yon seri gwo nan lyen nan fen a pou ou nèg kalite parkourir ak gade nan CSS plis fre. 

TOMAS Reimers: Lè sa a, bagay la pase, nou ap pwal pale osijè a modèl bwat reyèl rapid. Oh, ak Lè sa a, fwontyè, egzakteman menm jan ak padding, ou gen tou bagay sa yo tankou fwontyè-gòch, fwontyè-dwa, fwontyè-tèt, fwontyè-anba, ki pèmèt ou yo ka resevwa nan yon fwontyè espesifik. Se konsa, isit la jis fwontyè a kite-defini. Èske sa fè sans? 

ALLISON BUCHHOLTZ-AU: Li se yon fre fason yo mete aksan sou bagay sa yo oswa ajoute liy ant eleman diferan. TOMAS Reimers: Absoliman. Se konsa, sa a, se fwontyè nou yo. Ak Marge youn nan dènye a. Tankou padding Maj nan eksepte li pa nan within-- ALLISON BUCHHOLTZ-AU: Se pa alantou eleman ou men aktyèlman alantou tout la bwat ki nou ve yo te wè. 

TOMAS Reimers: Yeah. Allison te di li parfe. Li pa, tankou, andedan ou eleman, li la bò kote ti bwat la tout antye. Sa vle di bagay sa yo tankou background pa aplike nan li. Epi li fondamantalman di, tankou, mwen pa vle anyen nan espas sa a anpil pou mwen. Se konsa, tankou isit la nou gen yon maj nan 10 piksèl. Se konsa, pa gen anyen nan 10 piksèl yo ta dwe pwochen m '. Sa a kalite li yo espas, men kalite pa. Se konsa, sa a, se trè a Basics nan modèl la bwat. ki fè sans? Cool, fre. ALLISON BUCHHOLTZ-AU: Awesome. Se konsa, koulye a, mwen panse ke nou jis gen resous fre nou an ke nou pral pran ou nèg nan trè vit. Epitou, n ap aktyèlman byen, nou gen entènèt ankò? 

TOMAS Reimers: Se pou nou wè si mwen ka louvri up-- kite m 'jis wè si mwen ka jwenn entènèt byen vit pandan y ap chita pale sou anyen Allison Allison vle pale sou. ALLISON BUCHHOLTZ-AU: Se konsa, fondamantalman mwen pa fè sa konnen ki sa lòt bagay mwen ka di nan pwen sa. Men, sa yo se kèk reyèlman bon resous. Sa yo se moun yo ki Tomas ak Mwen te itilize e ke nou aktyèlman itilize yo preparasyon pou sa. W3Schools se youn ke ou mesye ta dwe te wè anvan. Nou rekòmande li pou yon anpil nan bagay sa yo ak CSS. Mwen konnen mwen rekòmande pou li seksyon mwen tout tan tout tan an. 

Youn nan bagay ki gwo se ke li pèmèt ou kalite dezòd ak CSS ak wè chanjman yo enstantane nan sa a, tankou, doub-fenèt wè ke li te genyen an. Se konsa, ou pa gen enkyete sou mete kanpe pwòp sit web ou, oswa mete kanpe vhost nan ou aparèy lokal yo ak lame lokal yo, ak ap resevwa tout sa ki bagay ap travay. Li se entegre dwa nan paj la. 

Epi li gen sa yo ti kras leson ke ou ka ale nan yo aprann plis sou seleksyon, oswa aprann sou manipile ou font, oswa yon background, oswa yon imaj. Epi ou gen sa yo rezilta Enstantane ke ou pa bezwen fè nenpòt ki lòt travay preparasyon pou. Se konsa, mwen renmen W3Schools. Li nan fantastik. Èske li travay? 

TOMAS Reimers: Yeah. Non, li pa. Èske ou ta vle m 'eseye ak rekòmanse òdinatè mwen an? Oswa nou vle to-- 

ALLISON BUCHHOLTZ-AU: Mwen vle di, byen, sa a ap tou ap sou entènèt. Tout glisad yo pral sou entènèt. Se konsa, mwen jis trè rekòmande fè sa yo. 

Sa a se gwo kòm jis tankou yon fèy twonpe. Se jis nan tout debaz la kòmande ke ou gen. Li nan gwo lè w ap premye kòmanse soti sit entènèt ou. Paske petèt ou pa fè sa vle jwenn nan tout nitty courageux a reyèl konsepsyon-lou bagay. Ou jis bezwen fòma li nan yon fason ki kalite fè sans epi yo pral fè pou tan an ke yo te. Men, si ou reyèlman vle jwenn nan li, mwen konnen sa a se, tankou, youn nan Referans pi renmen Tomas la. Nou te lè l sèvi avèk li nan preparasyon, epi li fantastik. Li nan Developer a soti nan Mozilla. 

TOMAS Reimers: Se konsa, Mozilla yo moun sa yo ki fè Firefox. Lè li nan jis pwomotè pwòp yo referans, ki mwen panse ke se pè. Epi li gen yon bèl bagay lis resous. Se konsa, nou have-- 

ALLISON BUCHHOLTZ-AU: Lè sa a, nòt pase a se lè w ap eseye konsepsyon sit entènèt ou, trase enspirasyon nan bagay sa yo ki ou panse yo se bèl. Enspekte eleman a, enspekte kòd la sous ka super itil pou ap eseye figi konnen ki jan yo style pwòp sit entènèt ou. 

Anpil fwa, mwen santi mwen tankou pi bon an fason sa a, san konte eksperimantasyon, se jis fè yon gade nan bagay ki bèl. Mwen jwenn li vrèman difisil yo jis kalite konsepsyon bagay sa yo sou pwòp ou a, espesyalman nan kòmansman an. Se konsa, tanpri gade nan sit ke ou jwi gade nan. Konnen sa ki fè yo fè apèl kont ou. Lè sa a, santi yo lib yo eseye ak replike sa. 

TOMAS Reimers: Dwa. Menm tankou sit tankou sa a, ou ka wè gen nan definitivman yon div nan tèt la. Lè sa a, ou gen yon lòt div ki nan isit la, ki se CSS awesomeness. Lè sa a, ou gen yon pakèt moun sou lyen isit la. Si ou reyèlman jis enspekte eleman, ou ka sòt nan kòmanse yo wè sa ki fè sit gade tankou, ak ki jan yo kapab mwen rkree ke si mwen te vle. ki fè sans? Se konsa, nou gen sèlman twa minit kite. Se konsa, kesyon? Nenpòt nan yo? Wi. 

ODYANS: Pou koulè a rektang, ki jan ou ta have-- si ou pa t 'vle li ale atravè paj la tout antye, te kapab ou te fè l 'ale nan tout sèlman mwatye paj an oswa jis tèks la? 

TOMAS Reimers: Yeah, absoliman. Se konsa, kite m 'wè aktyèlman. Mwen gen de lide. Se konsa, premye nan tout, ou kapab tou itilize pousantaj. 

ODYANS: Vrèman? 

ALLISON BUCHHOLTZ-AU: Se konsa, yon bagay yo gade jiska se relatif pwezante. Li nan yon bagay ke nou pa gen tan jwenn nan, men li la yon bagay mwen definitivman rekòmande pou ou mesye kouran soti nan. 

TOMAS Reimers: pousantaj Se konsa,. Epi wè ki jan nou te fè li jis 50% nan lajè a? ALLISON BUCHHOLTZ-AU: Si ou aktyèlman konnen ki kantite piksèl, ou ka dwe plis presi ki fason. Ou ka jwe ak alantou ak li. Men, 50%. Si nou te rdimansyonman navigatè nou an, li ta fè l 'pi piti. 

TOMAS Reimers: Oke, li nan fondamantalman 50% kounye a, mwen panse ke. Li nan 50%, ak Lè sa a Marge a te ajoute ak sa yo ki. CSS gen yon anpil nan Kapris. Se konsa, kounye a sa a se 50% nan paj lajè a. Men, sonje ke ou gen 10 piksèl pran koupe soti nan chak bò. Se konsa, si ou te pou avanse pou pi ki kont kwen an kite nan navigatè a, Lè sa a, li ta sanble 50%. Yon fwa ankò, tankou mwen te di, CSS kapab gen yon anpil nan devine-ak-chèk la. Tankou, ou panse yon bagay nan ale nan konpòte yon fason, men li konpòte li yon fason totalman diferan. 

ALLISON BUCHHOLTZ-AU: Epi ou jis jwenn pi entelijan, epi ou jis jwenn yon pi bon entwisyon pou li jan ou deplase ansanm. 

TOMAS Reimers: Epi li vin pi mal ak pi mal. Se konsa, li vrèman jis yon ras. 

ALLISON BUCHHOLTZ-AU: Sa a super ankouraje. Nou vle yo renmen CSS. 

TOMAS Reimers: CSS se pè. Sonje ke. Lòt kesyon? 

ALLISON BUCHHOLTZ-AU: bagay la yon sèl. Nenpòt lòt bagay? Cool. 

TOMAS Reimers: Awesome. 

ALLISON BUCHHOLTZ-AU: Bon, si ou nèg gen nenpòt kesyon pita sou, nou ap toujou disponib tankou pou chak dabitid. Ou ap pwobableman wè kèk nan nou pou pwojè final ak definitivman nan Hackathon la. 

TOMAS Reimers: Absoliman. Ak nan kèmès la. 

ALLISON BUCHHOLTZ-AU: Ak nan kèmès la. Oh. 

TOMAS Reimers: Gade pou pi devan pou wè tout nan awesome-- ou 

ALLISON BUCHHOLTZ-AU: Nou pwal wè tout nan sit awizom ou ki pral bèl. TOMAS Reimers: Ou ka toujou wè, tankou, sou sit entènèt yo ki te gen, tankou, bon CSS ak Lè sa a, tankou sa yo ki pa t 'eseye fè CSS. ALLISON BUCHHOLTZ-AU: Epitou, yon lòt bagay, yon sèl plis bagay yo gade nan se Bootstrapping. Se konsa, demaraj se gwo. 

TOMAS Reimers: Google ke si you-- 

ALLISON BUCHHOLTZ-AU: Google li. Li nan fantastik. Ou pral renmen li. Epi, koulye a ke ou gen yon konpreyansyon debaz sou CSS, li pral fè yon anpil plis sans. Awesome. Mèsi, guys. 

TOMAS Reimers: Mèsi anpil.