[Zenelejátszó]
ALLISON Buchholtz-AU: Rendben, mindenki.
Üdv újra a szakasz.
Így a napirendet ma megy keresztül sokkal több webes dev cucc.
Nem tudom, hogy hány láttad a psets
óta megjelent ma reggel.
Szeretném például, hogy hány ember olvassa a specifikációt,
de tekintve, hogy már volt minden A, mint hét órát nézd meg
és ez a hétfő és akkor már valószínűleg volt osztály,
Fogom feltételezni, hogy többsége még nem.
Ha van, extra dicsőség.
>> Te alapvetően segít végre egy egyszerű webes
szerver C, ami egy teljesen új PSET, így srácok, hogy a tengerimalacok.
Ez lesz egy szórakoztató, vad héten, de azt hiszem, lesz sok móka
és ez lesz egy nagyon jó tapasztalat valójában.
Tehát felkészülni , hogy a szakasz ma,
fogunk menni chmod, TCP / IP, és majd egy kicsit a HTML és a CSS.
>> A végén, akkor valójában kód egy egyszerű weboldal együtt
hogy segítsen nektek milyen kap inkább megismerte azt.
És akkor, ha még nem vette fel vetélkedők, ők elöl,
de biztos vagyok benne, hogy mindenki Itt megvan a kvíz.
És azt is, hogy a megjegyzés, megoldások még nem kelt fel,
de amint finish-- tetszik, a utolsó kevesen veszik quizzes--
lesznek fel.
Ha bármilyen kérdése van időközben,
bátran e-mailt nekem személyesen.
Fogok válaszolni az Ön egyedi kérdés, mint mindig.
>> Tehát, hogy a megjegyzés, chmod.
Tehát alapvetően minden, amit tudni kell chmod
az, hogy ezt használják a változtatás fájl jogosultságokat, ugye?
Szóval ez csak egyes rendszerekben ez egy Az engedélyek módosítása ahogy azt mondja itt.
És ha valaha is szeretne látni milyen jogokkal rendelkezik a fájl,
ahelyett, hogy csak ennek ls, meg tudná csinálni ls -l.
l áll sokáig.
>> Szóval, akkor nem hosszú listák mindent, és azt
kapsz sokkal részletesebb információk az egyes fájlokat.
És látni fogod something-- vagyok majd ugorjon a second--
de akkor valami hasonló hogy a felső sorban ott minden fájlt.
És mi megyünk át, hogy ez mit jelent.
>> Tehát alapvetően, a változtatás A fájl jogosultságokat,
csak azt, hogy használni chmod.
Azt lehet gondolni, mint bármely más UNIX hívás, mint a ls vagy cd vagy miegymás.
Ez csak olyan, mint a másik hívás.
>> Szóval mi chmod és aztán majd három számjegy általában.
Van egy pár módja van azt, melyek közül az egyik megyünk át.
De általában, akkor három számjegyek terjedő 0-7 minden egyes alkalommal.
>> Tehát az egyik dolog az, hogy vannak Három különböző engedélyeket
hogy tudunk adni minden fájlt.
És ez olvasható, ami képviseli: r, amely biztosítja, hogy értelme
egy kicsit; w, ami írható; és végrehajtható, ami x.
Tudom, hogy az e egy, végrehajtható, talán nem a legtöbb értelme, de
képviselje x.
>> És akkor mi történik, minden egyes ilyen is a számábrázolás.
Tehát az 1, 2 és 4.
És tulajdonképpen mi történik, Minden ilyen három szám
itt megfelel egy más-más felhasználók
hogy az említett engedélyeket vonatkoznak.
>> Szóval lehet gondolni, hogy az első szám megfelel a tényleges felhasználó
vagy a tulajdonos a fájl, a második szám felel meg a csoportot,
és az utolsó kifejezés a világ, OK?
Tehát mi történik, emlékszem azok numbers-- r értéke 4, w értéke 2,
x értéke 1, nem igaz?
This-- Ha összegezni ezeket, hogy ad, hogy az első szám
hogy talán input mi chmod.
>> Így ebben az esetben, milyen lenne ez a szám lesz?
Lenne, 4 plusz 2 plus 1, amely egy 7, nem?
És ebben az esetben ezek a nincs semmi,
így ez itt lenne lefordítja a chmod 700, OK?
És mi, hogy nem ez ad minden Ezen engedélyeket a felhasználó.
>> Tehát ez azt jelenti, a felhasználó tehetnek, amit akarnak.
Azt tudja olvasni ezt a fájlt.
Ezek végre ezt a fájlt.
Úgy tud írni, hogy ezt a fájlt.
De-csoport és a világ, nem jogosultságokat egyáltalán, OK?
>> Tehát egy másik módja, hogy írjon, hogy mi is do chmod három számjegy, amelyek mindegyike
megfelel bármilyen összeget, vagy speciális csoport, speciális részhalmaza.
Vagy tehetünk valójában egy másik dolog.
Várj.
Tehetünk valamit ezekkel itt.
>> Hányan látták egy példát ahol volt, mint a chmod a plusz x?
Láttad, hogy előadás, azt hiszem?
Így a jelentése minden.
Ez azt jelenti, hogy ez az összes felhasználó számára, amit elfelejtettem, hogy itt.
>> De egy plusz x, ha észre itt, ha nem teszünk
hogy milyen chmod-- csoport vagyunk beszél és az engedélyeket
szeretnénk adni nekik.
Így ez lehet egy plusz vagy mínusz.
Plus hozzáteszi engedély.
Mínusz elveszi engedélyt.
Pretty intuitív, azt hiszem.
>> Így egy plusz x jelent chmod.
Így az engedélyek módosításához minden ember ha ez egy a-- add engedélyeket.
És hogy mit jelent X- engedély vagyunk megadása mindenkinek.
Olvasni, írni, vagy végre?
>> KÖZÖNSÉG: Execute.
>> ALLISON Buchholtz-AU: Execute.
Tehát így minden felhasználó engedélyt, hogy végre ezt a fájlt, OK?
Mi van, ha akartunk csinálni hogy a numerikus formában?
Úgy emlékszem numerikus, akarunk három számot.
>> KÖZÖNSÉG: 4.
ALLISON Buchholtz-AU: Mi volt ez?
KÖZÖNSÉG: 4.
ALLISON Buchholtz-AU: Nincs 4.
KÖZÖNSÉG: 0, 0, 4.
ALLISON Buchholtz-AU: Nos, mi szeretnénk hogy ez az összes felhasználó számára, igaz?
Szóval megy, hogy A szám minden nyílásba.
Ez lesz az ugyanazt a számot minden egyes nyílásba
mert csak azt, hogy mindenki végrehajtható engedélyeket.
Így végrehajtható 1, de a helyes úton.
>> Tehát, ha nem chmod 111, amely az egyenértékű chmod a plusz x.
Van ennek értelme mindenki?
Megyünk végig egy pár példa.
>> Tehát a nagy elvihető itt van egy nincs itt,
hanem csak annyit jelent, hogy ez az összes felhasználó számára.
u, ha csak azt, hogy vagy elvenni
külön engedélye a felhasználó vagy a tulajdonos.
ga a csoport, így a középső számjegy.
És akkor mások is gondol mint a világ, hogy az utolsó számjegy.
>> Tehát, hogy elmegyünk egy példát, mert úgy érzem, mindig példát
hogy ezeket a dolgokat könnyebb megérteni.
Így rwx-- mentünk keresztül this-- is lehet képviselni, mint 700.
Ez a példa néztünk a több kép.
Így chmod 444 néhány fájlt adna milyen jogosultságokat?
Te tényleg közel.
KÖZÖNSÉG: olvasható minden.
ALLISON Buchholtz-AU: olvasható.
Így olvasható mindenkinek, ugye?
És akkor mi van egy másik módja, hogy?
Ha azt akarjuk, hogy chmod akár r vagy a W, valamint és hátrányával,
mi lenne hívás kinézni?
Lenne chmod mi?
>> KÖZÖNSÉG: a plusz r.
>> ALLISON Buchholtz-AU: a plusz r az 5.
OK, így ez ugyanaz, mint ez, csak két különböző fordítások
ugyanaz a dolog.
Tehát, hogy mi ezeket.
Szóval azt szeretném, ha a srácok, hogy megpróbálja írni ilyen jellegű saját fordítva.
>> Tehát chmod 555, mi lenne, mint?
Lenne egy plusz vagy u plusz vagy miegymás?
Az u és x, adj a három számot.
Aztán mesélj milyen jogosultságokat vagyunk valójában engedélyezése és hogy ki?
>> Szóval adok nektek két perc dolgozni azt.
Nyugodtan beszélni egymással.
Azoknak, akik eljöttek egy kis késő van, cukorka és ing.
Van három ing balra, és van Kit Kats és starbursts.
Tehát nyugodtan jöjjön megragad néhány ebben a kis közjáték.
>> Továbbá, az utolsó pedig bonyolult.
Ez két chmods az utolsó.
Igazából, hadd zárja az ajtót miközben a srácok dolgoznak rajta.
Candy mindig szükséges hétfőn délután.
>> OK, így chmod 555.
Mi egy másik módja, hogy azt írja, hogy?
Van ötleted?
Igen.
>> KÖZÖNSÉG: a plusz rx.
>> ALLISON Buchholtz-AU: r és rx.
Szeretné, hogy miért ez lenne rx?
>> KÖZÖNSÉG: Mert van 5, szóval 4 + 1,
annak érdekében, hogy elolvasta és végrehajtható, és ez minden.
ALLISON Buchholtz-AU: Így van.
Tehát csak megismételni, 5 itt , mint tudjuk, az összeg 4 és 1,
mert minden szám a trió a összege a jogaid a részhalmaza,
ugye?
Vagy a felhasználó, a csoport, vagy a világ.
Így ebben az esetben, tudjuk, hogy 5 van, hogy létrejött a 4. és 1.
>> És a 4. és 1. megfelelnek az olvasható és futtatható.
Adunk mindenkinek, így nem tehetünk chmod a plusz rx.
És természetesen, csak ment a kérdések ott,
így most ez a fájl futtatható és olvasható mindenkinek.
>> És mi a helyzet a másik?
Mi lehet a szám, hogy az egyik az?
Van ötleted?
Rajta.
>> KÖZÖNSÉG: 100 [hallható].
>> ALLISON Buchholtz-AU: 100.
Pontosan.
Tehát azt szeretnénk, hogy miért 100?
KÖZÖNSÉG: Mert az felhasználó, így az első helyen.
És akkor x futtatható 1.
ALLISON Buchholtz-AU: Pontosan.
Tehát megadása végrehajtható engedélyeket, hogy csak a felhasználó számára.
Így ebben az esetben lenne 100.
És az összes választ fel a következő dia esetén
írsz sok dolgot le.
>> OK, így ez a következő egy ténylegesen történik két chmods, meg tudod csinálni.
Szóval nem akárki volna bármilyen ötlete, hogyan lehet, hogy
kap chmod 640 újraírt a másik út?
Meg lehet változtatni a felhasználó az első, majd meg lehet változtatni a csoport az én hint.
>> Tehát, ha mi csak a változó felhasználó, amely az első egy van,
mi lehet a hívás lehet?
Így a felhasználó u, ugye?
Így chmod u plusz mi?
Mmhmm?
>> KÖZÖNSÉG: rw.
ALLISON Buchholtz-AU: rw.
Igen, az írni és olvasni, mert olvasni 4, w értéke 2, az említett összeg együtt, mint 6.
Így kap chmod u plus rw, és megkapjuk az első 6 van.
>> Így aztán, hogy a 4, most szeretnénk hogy megváltoztassuk a csoport beállításait.
Így fogunk tenni chmod g plusz mi?
Mi az a 4?
>> KÖZÖNSÉG: r.
ALLISON Buchholtz-AU: r.
Pontosan.
Szóval, hogy a tulajdonosnak olvasási és írási
és mi így a csoport olvasási jogosultságokat, amit minden itt.
Mmhmm?
>> KÖZÖNSÉG: Ha írsz valamit, nem jelenti azt, akkor végre meg?
>> ALLISON Buchholtz-AU: You írhat something--
Nem hiszem, hogy ez azt jelenti, akkor végre azt.
Cool.
Szóval ez minden, amit csak ment keresztül.
Tehát ez a következő egy, ez csak az a közös ügyek
kívánt tartani bánja a probléma beállítva.
Ezek jellemzően az engedélyeket hogy szeretjük Önnek.
>> Tehát 711, hogy ad nekünk, természetesen, a felhasználó
minden engedélyt, amely hajlamos, hogy van értelme.
És akkor ez végrehajtható a csoport a világon, ami teljesen érthető
ha van egy kis könyvtár, akkor szeretné, hogy képes legyen bejárására bele.
Az emberek számára hozzáférést kell biztosítani.
>> A nem-PHP fájlt, mész használható 644, ami mit csináljon?
Ez mit jelent, vagy mi jogosultságokat jelent, hogy adjon?
Így a tulajdonos is, mi?
KÖZÖNSÉG: olvasása és írása.
ALLISON Buchholtz-AU: írni és olvasni.
Aztán csoport és mások egyszerűen csak olvasni, ugye?
És akkor chmod 600 minden PHP fájlok használata,
A tulajdonos, megint, lehet írni és olvasni is
de mindenki más csak ilyen blokkolt le.
>> Tehát ez valóban lehet több, hasznos, ha
eljut a probléma állítsa a jövő héten, ha
te tényleg épület egy weboldal.
Tehát, ha valaha is befut bármilyen furcsa probléma
ahol ez nem töltődik be megfelelően, talán
kell hozzá egy végrehajtható engedély, vagy talán szüksége van egy olvasási
vagy írjon engedély.
Kis dolog, hogy az emberek hajlamosak utazás fel, de ez olyan, mint a go-to
ha jövő héten kezdődik a PSET.
És azt, hogy Ön több tippeket e heti PSET,
de én még nézni óta adták ki ma reggel.
De e-mailt nekem, én is néztem rá mire válaszolni holnap.
>> Tehát most, mindenki jó chmod?
Minden még kérdése?
Elég egyszerű.
Csak egyfajta nyomon követése, hogy mi olvasás, írás és végrehajtás számok
talán a legnehezebb része.
>> Tehát TCP / IP, mind ezeket a protokollokat, olyan, mint az az adatok struktúrákat
a múlt héten, ez sokkal Fontos, hogy milyen kap
magasabb szintű intuíció őket.
Ez nem CS143 hová megyünk kérni, hogy végre egy hálózathoz,
így nem lesz semmi baj, ha nem érted
a tetves kavicsos a protokoll.
Ami fontos, hogy megértsék, olyan, mint amit ők képviselnek
és miért ők fontos.
>> Így a TCP / IP, természetesen, ez a Transmission Control Protocol
vagy Internet Protocol, ami alapvetően csak egy sor törvény alapvetően
vagy szabványok mondani adat hogyan kell kezelni,
hogyan kell csomagokra, továbbítani, és kapott.
Tehát alapvetően, ahogy mondja itt, növeli az esélyét
az adatokat is, amennyiben a azt akarja, hogy a.
>> Biztos vagyok benne, hogy a srácok elment előadás, vagy nézte az interneten,
ő has-- Nem tudom ha ő tette ebben az évben,
de tudom, hogy tavaly volt egy demo ahol volt egy kép Rob
és ő feldarabolja Négy és tedd borítékok
és megpróbálta végig Sanders.
És akkor milyen gondolom így.
Ez csak egy a szabályok mondja az adatokat hogyan lehet valahol
és lehetővé teszi, hogy tudja, ha akkor a hiányzó adatokat,
ugyanolyan módon, hogy ha figyelembe Többoldalas jegyzetek
és címkét őket a 104. oldalon, oldal 204., és menj vissza tanulni később
és ha hiányzik something-- nem találja az oldalon 304-- tudod
valami baj van, így nézd át a jegyzeteket
újra, vagy kérjen meg valakit, hogy elküldjük neked a jegyzet ettől a naptól.
Ugyanígy az adatokat az interneten.
Ha kérek valamit néhány szerver
és ezt kell elküldeni azt több csomagra,
talán lesz szám azt valamilyen módon, legyen
én tudom, hány kaptam volna meg, és mondd, ó, ez az egyik 10
vagy ez az egyik 10.000.
Így amikor megyek szerelje minden darab együtt,
Tudom, hogy ha valami hiányzik és én is kérni, hogy újra.
Van ennek értelme?
Csak egy szabályrendszer.
Annak alapján megállapított szabályok, OK?
>> Így arról is beszélt a kicsit a port.
Ez tényleg csak egy szabvány, amely lehetővé teszi, hogy tudja, milyen típusú adatok
kerül továbbításra az ezeket a csomagokat.
Ha megy a mi boríték Például mi nem
tudjuk, hogy ez a kép Rob ott, ha azt írjuk, hogy
a külső a borítékot.
Tehát portok alapvetően ugyanaz.
Ez csak egy módja annak, hogy kitaláljuk, mi típusú adat kerül továbbításra.
>> Tehát mind a leggyakoribbak itt.
Tehát 21-- ezek is kedves hasonló jó dolgokat tudni.
Elég egy egyszerű kvíz kérdés.
Légy olyan, mint, mit jelent 80-as port csinálni?
Vagy, mit 443-as port csinálni?
Olyan jó dolog tudni.
>> Tehát itt, 21 fájl átviteli protokoll, így csak
a szabályokat, amelyek a fájlátvitel.
25 dolog, amit minden használjon túl sok, az e-mail.
53. az a domain név rendszer, amely alapvetően
csak egyfajta keresési számára a IP-címe, a domain név.
>> Szóval biztos vagyok benne, hogy volt említett előadás, ha
megy valami hasonló google.com, azt az IP-cím
ami társul hozzá.
Ez valójában nem google.com.
És így a 53 port hogy valóban úgy
gondoskodás a fajta fordítja be az IP-címét.
Aztán a 80-as és 443 igen gyakori.
Vagy már a weboldal vagy megvan a biztonságos weblap,
amely sok weboldalak át át most.
>> Szóval ez a fajta magas szintű áttekintése átviteli protokoll.
Nem látom sokkal részletesebb.
Elég jó dolgok ha érdekel.
Rengeteg a források.
Wikipedia valójában egy nagyon jó oldal.
Szóval néztem Csak egy kis ideje,
úgyhogy nagyon ajánlom néztem ha érdekel
vagy hogy két év alatt 143, mert Azt hiszem, ez minden második évben.
>> Tehát a végén ez, vagyunk beszél weboldalak és HTTP,
ami valójában a következő téma ma, mielőtt bemegy a HTML és CSS
és akkor valóban kódolni egy weboldalt.
Jó lesz.
Mi lesz a kép nyuszik és ez lesz jó.
>> Szóval HTTP, ahogy itt is látszik, az egyik a szép betűszavak
ezen a héten, ami Hypertext Transfer Protocol.
Szóval megint, ez csak másik a szabályok
szabályozza hipertext át, ebben az esetben.
Tehát a legjobb módja annak, hogy tanulni erről csak ilyen
törni le ezek az egyes szavak
mert van egy csomó szó a képernyőn ott.
>> Így fogunk kezdeni hypertext.
Szóval "hyper", akkor gondolni "Felett", mint a Super-típusú dolog.
Szóval ez tényleg csak átvett szöveg a következő szintre, így, mint a Super szöveg,
mint a következő szöveget.
Tehát alapvetően csak szöveget ad
több információ normál szöveg nem, OK?
>> Tehát ebben az esetben is, ez a hypertext.
Ez azt mondja, hogy van néhány link, hogy megyünk,
amely cs50.net, amely most cs50.harvard.edu.
Ezek a diák egy kicsit öreg.
És ez meg fog megjeleníteni azt ez, mint a hivatkozás,
majd egy igazán jó weboldal.
>> Szóval ez a szöveg, ami egy kicsit kicsit nagyon jó dolgokat ott.
Szóval lehet kapcsolni a dolgokat, és akkor helyezze be a képeket és akkor stílus dolgokat.
És a legtöbb ismert dolog, amit srácok valószínűleg a hipertext
a Hypertext Markup Language, HTML, ami természetesen az összes web-
hogy amit magunk körül látunk, megadott Néhány CSS stílus dobott.
>> De ha valaki volt igazán nagy a MySpace,
Biztos vagyok benne, minden használt HTML minden alkalommal, hogy hozzon létre
azok tökéletes profilok, ugye?
Úgy érzem, hogy lehet egy elavult referencia most, de mindegy.
Csak egy little-- srácok nem, hogy sokkal fiatalabb.
Néhányan közületek idősebb nálam.
MySpace volt még dolog, amikor fiatal voltam.
Én nem vagyok a régi.
>> Egyébként, csak HTML formában hipertext.
Szóval hipertext csak szöveg hozzáadott funkciók.
Tehát átviteli protokoll valószínűleg A több iffy dolog megmagyarázni.
Nyilvánvaló, transfer-- csak át az adatokat.
Így akár az ügyfél, mint A web testvér, és a szerver.
Tehát alapvetően csak a hogy az internet működik.
>> Így a pontos kérésére hogy ezek a munka, vagyunk
ténylegesen fog nézni egy Például kérés és válasz.
De hogyan kérhet adatokat a szerver
és hogy a kiszolgáló válaszol nekünk mi ez átviteli protokoll szabályozza.
Tehát a kérés és a válasz is a következő különleges szabályokat állapít meg.
Ez egységesítik, hogy nem számít, hová az internet segítségével,
mindig ugyanúgy működik, OK?
>> Ismét, protokoll, meg a szabályokat.
Ez csak egy normális kölcsönhatás ugyanúgy
professzor Malan beszél ha valaki kiterjeszti a kezét,
tudod, hogy ez az általános udvariasság elérje a tiéd, és rázza a kezét.
Ez egy protokoll, ugye?
>> Szóval adok néhány szabványosított kérés, amely akarom rázni a kezét,
és adsz néhány szabványosított válasz, amely vagy nem köszönöm
vagy megpróbálhatod és rázza a kézi vagy talán fogsz próbálni
és ököl bump nekem.
És nincs olyan protokoll, amely.
Ez lebontja.
De ha mindenki követi a ugyanazt a protokollt, persze,
megy sokkal zökkenőmentesen.
Az emberek megismerik egymást.
Mindenki boldog.
>> Így a világ a web, mindenki követi az azonos rules--
valamivel jobb, mint a társadalmi normákat.
De azt, akkor nézd egy példát kérésére itt.
Szóval van ez a kis kulcs itt alul
amely megmondja, hogy a különböző színű, mit akar ez jelenteni.
>> Így fehér, mint a módszer kérés és protokoll version--
így mód kérésére változat.
És akkor ez valami mező neve és az érték
Az ezen a területen, amit majd megy nagyon, nagyon röviden.
Tehát ez egy példa kérés.
Ez olyan, mint én kinyúlik, akarta, hogy bemutatkozzam.
>> Ez az, amit az ügyfél vagy mi a böngészőjében
akkor küld a szerverre.
Tehát ez egy GET kérés, így kér valamit a szerverről.
És, persze, HTTP és ez a 1.1-es verziója.
>> Így a többi ezt itt nevezzük a fejléc, és további információt
hogy ad nekünk egy jobb ötlete amit mi valójában kér,
vagy információkat szeretnénk adni a szerver, hogy lehet releváns.
Így User-Agent ad néhány leírás on-- például itt,
curl / 7.24.0 valóban fog mondani a szerver, hogy mi a Google
Chrome a böngésző.
Tehát, ha valaha is hallani az emberek, akik beszélnek
arról szól, hogy egy app érzékeny több böngészők,
ez olyan dolog, hogy használna mert ha
nem tudom, hogy milyen böngészőt a kérelem származik,
nem tudja szabni az adatokat, hogy a.
Így ebben az esetben, a felhasználó csak ad az ilyen
Az azonosító információkat arról, hogy milyen böngészőt
A felhasználó jelenleg használt, OK?
>> Így aztán mi is gazda, ami ahol vagyunk valójában akar menni.
Ebben az esetben mi akar menni apple.com, vásároljon néhány vadi új iPad
vagy valami, talán aranyos fények a kollégiumi szobákban.
És név érték a végén csak töltőanyagot, csak egy általános dolog
srácok látni.
Ez valójában nem megfelelnek az itt semmit.
>> Így annyi vagy kevés, amit akar minden esetben.
A legtöbb idő, ezek nem kötelezőek.
Ez csak attól függ, hogy milyen szükség van a böngésző,
saját használati utasítása megfelelően ad a kérelmet.
Vagy ez attól függ, milyen a felhasználói valóban azt akarja, hogy adja fel a szerverre.
Szóval lehet, hogy sok, sok Ezeknek a fejléc mezőneveket
vagy lehet, hogy csak egy pár.
Mint oly sok mindent Azt mondtam, ebben a szakaszban,
ez tényleg attól függ, hogy a kontextus A miként használja ezt.
>> Tehát nem, hogy van értelme a mindenki?
Ez csak egy példa kérelmet, fejlécek, miegymás.
OK, így azzal, hogy van néhány válasz.
>> Ismét megvan a státusz kód, protokoll változat, majd a mező neve és mező
érték, mint mindig.
Így a protokoll verzió és a státusz kód 200.
OK, ami azt jelenti, hogy igen, minden jól ment.
Itt van, amit akar.
>> A szerver típusát, a tartalom type-- azt mondja nekünk, OK, te
lesz egy kis szöveget HTML.
Itt látható a hossza, és itt mit kell tenni a kapcsolatot.
OK, így ismét, attól függően, az adatok vagy
kér, attól függően, hogy milyen a szerver akarja, hogy visszatérjen hozzád,
lehet, hogy több ilyen terület neveket, lehet, hogy kevesebb.
Teljesen kontextus függő.
>> És amennyire ez az állapot kódot itt, természetesen,
200 nem az egyetlen akkor lehetett volna, ugye?
Rengeteg állapot kódokat.
Tudja valaki emlékszik valamelyik mások, hogy mi említett előadás?
Sokan közülük kezdeni 4.
>> KÖZÖNSÉG 404.
>> ALLISON Buchholtz-AU 404, ami?
>> KÖZÖNSÉG: A fájl nem található?
>> ALLISON Buchholtz-AU: A fájl nem található.
Pontosan.
Szóval mi a 403?
KÖZÖNSÉG: Tiltott.
ALLISON Buchholtz-AU: Forbidden.
Szóval, mit gondolsz azt jelenti, hogy a chmods?
>> KÖZÖNSÉG: Ez azt jelenti, hogy Nincs engedélye, hogy elolvassa.
>> ALLISON Buchholtz-AU: Pontosan.
Valamilyen módon, akkor nem kell jogosultságod, ugye?
Szóval 404-es, 403.
Van egy nagyon vicces az egyik, hogy mindig
vezessen minden évben, Meg kellett volna fel ide,
mint 413, ami én vagyok teáskanna.
Akkor google ezt.
Ez vicces, mint, hogy a kód 413 és ez én vagyok teáskanna.
Amit nem tudom, miért tenné valaha is szüksége van, hogy az interneten,
de elkalandoztam.
KÖZÖNSÉG: Lehet, hogy te egy teáskanna.
ALLISON Buchholtz-AU: Talán A szerver egy teáskanna.
Ki tudja?
Rendben, mindjárt átmenet valódi kódolás.
Úgy érzem, hogy a srácok fognak innen elég gyorsan.
>> KÖZÖNSÉG: Miért csinálja mondják, hogy "szerver: kétszer?
>> ALLISON Buchholtz-AU: Hm?
Szerver kétszer?
Ez egy jó kérdés.
Nem vagyok biztos benne.
Meg fogom találni, és Én e-mailben minden.
>> OK, minden más kérdés amellett, hogy?
Jó?
Cool.
>> HTML és CSS, és most kap minden a móka része.
Tehát ahogy már korábban említettem, a HTML valószínűleg az egyik dolog,
srácok a leginkább ismerik.
Tehát Hypertext Markup Language.
>> A legjobb módja annak, hogy megtanulják this-- én nem bármilyen felkészült diák vagy bármi
A srácok a HTML.
Ez tényleg a tanulás a szintaxis.
És ha a MySpace nap, akkor ezt le.
>> Szóval tényleg, a legnagyobb dolog csak gyakorolni és a kísérlet.
Az egyik nagy erőforrásokat megtenném nagyon ajánlom a W3Schools.
Szóval W, 3, majd iskolák.
Van egy csomó források HTML, CSS,
és valóban van egy osztott képernyős ilyesmit
ahol kapsz példa kódot.
Akkor babrálnod, változtatni, és nyomja meg a frissítés,
és akkor megmutatja, milyen valójában nem az a weboldal.
>> Szóval nagyon ajánlom használja ezt.
Ez elég jó.
Ön nem fog seg hibák itt, amikor a dolgok rosszul mennek.
Ha sikerül a seg hibát HTML,
ne tudassa velem, mert én vagyok lesz igazi izgatott.
De ez nagyon klassz, mert meg tudod változtatni a dolgokat,
láthatjuk őket élőben frissítve.
És azt hiszem, kapsz egy sokkal intuitív megértése a HTML
ha valóban csak eltölteni néhány idő kísérletezni vele.
Szóval ezért mondtam, gyakorlat és kísérlet.
>> Google innen ki, valószínűleg
az egyik legjobb forrás, és a barátok.
Vagy Bing-- dolgozom a Microsoft, így talán azt kellene mondanom Bing.
De elég sok mindent csak lesz szintaxis,
így megértjük, mi a címkék, understanding-- legalább CSS--
hogyan kell változtatni az egyes attribútumokat.
Ez lesz szuper hasznos.
>> Tehát annak ellenére, hogy mi nem bármilyen kész dolgokat,
mi van a fajta néhány bevált gyakorlatok hogy szeretnénk, ha a srácok, hogy megpróbálja betartani
by-- vagy inkább be tartja magát, amíg további értesítésig.
Így zárja be az összes tag.
Remélhetőleg mindenki has-- tudod mit, ha ez nincs értelme most,
Ígérem, akkor van értelme amikor mi kódoló fel az oldalra.
De közel az összes tag.
Tehát, ha valaha valamilyen header ez konzol,
H1, konzol, győződjön meg arról, hogy amikor kész azzal,
bezárja a fejléc.
Érvényesítse oldal W3 érvényesítő.
Ha nem zárja be a címkéket, akkor kap váratlan viselkedést.
Azt fogja mondani, hogy az oldal érvénytelen ha fut át ​​ezt érvényesítő.
Tehát, ha a doubt-- és különösen ezen a héten és a jövő héten
pset-- azonos módon kérünk használatát ellenőrizni és stílus 50 50,
akkor gondolom, ennek a az egyik az ellenőrzések, OK?
>> Tehát, ha nem adja át a W3-érvényesítő.
Ez olyasmi, amit dokk Önt.
Vagy én mondom jobbra most fogok dock Önt.
Tehát győződj meg róla, hogy érvényesíti.
Ez nem nehéz.
Csak illeszd be a kódot és akkor sem mondják jó munkát
vagy te hiányzol valami ugyanúgy
hogy a stílus 50. megmondja hová Messiás.
>> És akkor még egy utolsó dolog a külön szeretné választani
A jelölés, amely az egész, hogy a HTML vagy a szöveget, és a stílus.
Tehát mi nem egy példát Az, hogy a jog után.
Így HTML és CSS külön kell.
És fogunk beszélni MVC, amely MVC,
a jövő héten.
Srácok kéne megtudjuk, hogy az előadás
holnap, ha már Már tanultam ma.
>> És ez csak egyfajta a paradigma, hogy hajlamosak vagyunk
használni, ha webes oldalak külön a dolgokat.
Azt hiszem, hogy ugyanúgy hogy hajlamosak vagyunk külön funkciók C
ahol hash találni a dolgokat.
Ez csak egy módja annak, hogy hogy az élet könnyebb.
Ez választja ki attribútumokat vagy kód, akkor használja újra és újra,
de ily módon, ez a fajta Az tartja szép és tiszta.
És ha meg akarja változtatni Egy dolog, akkor változtassa meg, ha
és ez megváltoztatta mindenhol máshol.
Tehát inkább a könnyű és rugalmas.
>> Tehát CSS, ez nagyon hasonlít HTML, de ahelyett, hogy a címkék
hogy már említettem, csak most, mi használja az úgynevezett választók.
És tulajdonképpen csak egyfajta A társult egy bizonyos tag
A HTML-más tulajdonságokkal.
És amikor azt mondom, tulajdonságok, úgy értem dolgok, mint a betűszín, betűstílus,
a színe a háttér, a színét a szöveg.
Azok a dolgot.
Mint ha ez középre, ha ez ki a jobb,
ha ez mind inverted-- ezek jó dolgok.
Bármely stilisztikai dolgok hogy te a szöveget,
ez az, amit gondolok attribútumokkal.
>> És akkor két dolog tudni, hogy selectors-- két fő factors--
olyan azonosító, ami egyedülálló.
Csak akkor használhatja, hogy egy dolog.
Egyébként ez meg fog kiabálni veled.
És amikor mi határozza meg azt a CSS fájlt, akkor
legyen hash azonosítót és majd milyen tulajdonságokat akarunk.
Ígérem megyünk megy át egy példát.
Ez lesz, hogy sokkal több értelme van.
>> Class utalhat több blokkot.
Így lehet a első és harmadik bekezdésében
ugyanolyan fajta attribútumok ha Ön társítani őket ugyanabba az osztályba.
És amikor mi határozza meg őket CSS, mi a pont osztály,
osztályú, hogy bármilyen azt akarja, hogy neve.
>> Szóval tudom, hogy ez helyes most nagyon elvont.
Ezért megyünk a kódot.
Tudom, hogy ti szeretsz hogy, és minden van
fog segíteni nekem, mert ez a weboldal.
Ez a mi szekció weboldal, srácok.
Tehát vannak olyan kérdések, mielőtt kapcsolja ki a PowerPoint, vagy bármi
azt akarja, hogy lépjünk vissza hogy mielőtt elkezdünk kódolás?
>> KÖZÖNSÉG: Amikor azt mondod meccs címkék, érted szelektor vagy tag?
ALLISON Buchholtz-AU: Lehetőségek gondol rájuk, mint ugyanaz a dolog.
Ez csak más szavakkal.
Úgy értem, mint a választók.
Hanem választók is leképezni címkéket.
Így gondol rájuk, mint gyakorlatilag ugyanaz a dolog.
Ígérem, ez lesz, hogy a Több értelme van, amikor kódot.
Bármi a PowerPoint vagy bármilyen kérdése
most, mielőtt ténylegesen Létrehozzuk a szekció oldalon?
Mindenki készen áll?
Cool.
>> Szóval van egy elindult.
Hadd növeli a font a srácok.
OK, így most már csak egy csupasz csont weboldal itt.
>> Van néhány HTML.
Van néhány fejléc, amit lásd itt például weboldalt.
Néhány cím, néhány font.
Ezek a címkék, OK?
Így amikor értem bezárja a címkéket, azt látjuk, itt tartó fej a nyitó
tag, és ez a konzol / Fej bezárására, OK?
>> Szóval lehet gondolni ezt A fogszabályozó, ha a körülmények
vagy az a hurok.
Ha van egy az elején, azt szeretné, hogy a végén.
Ez továbbra is működni fognak a legtöbb időt Ha nincs zárt tag,
de bevált gyakorlat zárja a címkéket.
>> Tehát ebben az esetben változtassuk meg ezt.
Mi lesz, hogy hét szakasz.
"Section Weboldal."
Szóval csak úgy, hogy ez megváltozzon.
>> És ha megy itt, és mi reload-- kéne menteni és reload--
azt veszi észre, hogy itt megváltozott, ugye?
Cool.
Tehát ez megváltoztatja a címet.
Ez bármi a a lapon.
>> Tehát ez a fajta látszó unalmas.
Én nem tudom srácok.
Azt hiszem, valami mást itt.
>> Tehát mit tehetünk a header csak ott.
Csináljuk valamilyen test.
Tehát néhány szervezet itt.
Mint mindig nyitott és Becsukom a címkék kezdeni,
ugyanúgy, hogy én nem fogszabályozó.
Ah.
Várj, mi?
>> KÖZÖNSÉG: [hallható].
ALLISON Buchholtz-AU: Ah.
Srácok kaptam.
Szép munka.
Arany csillag.
>> OK, így van egy kis test itt.
És most kezdjük hozzá némi szöveget.
Szóval van egy pár más lehetőségek hozzá szöveget.
Van dolgok, mint a fejlécet.
Van csak a szokásos szöveg.
Szóval csak kezdeni a fejlécet.
Igazából, ha akartok felhúzni W3 Iskola HTML,
akkor a fajta nézz körül és ha van valami,
különösen, hogy szeretne kipróbálni ezzel weboldal, meg tudjuk csinálni.
Tehát ebben az esetben, nézzük csak, hogy némi h1.
Tehát h1 mint legmagasabb fejléc.
Ez ad neked valamit hogy nagyon nagy és merész.
>> És ebben az esetben, mit akarunk Az első szöveg a honlapunkon?
Bármi.
Srácok fog létrehozni ezt.
Én csak úgy írja.
KÖZÖNSÉG: Welcome.
>> ALLISON Buchholtz-AU: Welcome.
OK, így ha menteni és mi reload, van egy hatalmas welcome.
Szóval, csak így láthatja a különbségek, csináljuk valamit H6.
Mit akarunk itt?
Jobb?
>> OK, így csak azért, hogy észrevenni a különbséget.
Ja, Sublime.
Tehát, ha azt veszi észre, h1, nagyon, nagyon nagy.
h6, mint merész, de sokkal kisebb, és van minden között.
Szóval lehet h2, h3, h4.
És ezek csak a fejléceket, így, ha akarsz
hogy hozzon létre egy internetes oldalt, amely különböző szakaszok,
talán a használni kívánt fejlécek valahol.
>> Cool.
Így fogunk hozzá még egy kis dolgok a szervezetben.
Látom, hogy nem lenne ilyen Az jó, ha volt egy kép.
Úgy érzem, mindenki használhatja talán Egy aranyos nyuszi képet igaza van most,
így fogunk találni nyuszi kép első.
>> Nem tudom, hogy a srácok bármilyen preferenciák melyik akarunk.
Van a preferenciákat?
Ez itt?
Le.
OK.
Ez az egy van.
Jó választás.
>> OK, így megyünk a megtekintéséhez a képet.
Nézd csak.
Nézd meg, hogy imádnivaló dolog.
Hogy lehetsz szomorú hétfőn ezzel?
>> Szóval csak úgy másolni a kép URL-jét.
És amit akarok, nézzük csak mondjuk van néhány bekezdés p.
Mi fogja mondani: "Nézd nézd meg az aranyos nyuszi.
d'AWWWW. "
Szeretem a nyuszik.
Van egy nyuszi otthon.
Hiányzik a nyuszi.
Szóval, mit fogunk do-- Nem tudom, ha akartok
a google this-- hanem HTML, hogyan lehet ön tartalmazza képet?
Szó szerint, ha a google "Közé tartozik kép HTML,"
miért nem mondja meg srácok mi ez a tag legyen?
>> KÖZÖNSÉG: img source--
>> ALLISON Buchholtz-AU: img source--
KÖZÖNSÉG: --equals--
ALLISON Buchholtz-AU: --equals--
KÖZÖNSÉG: --quote-- igen.
ALLISON Buchholtz-AU: Tökéletes.
Lovely.
Lásd, MySpace generáció, ugye?
KÖZÖNSÉG: Neopets.
ALLISON Buchholtz-AU: Neopets.
Oh, OK.
Wow.
Ez volt őrült.
OK.
>> Úgyhogy győződjön meg róla, hogy én ezt a jogot.
Cool.
Szóval ez itt.
Aztán ha újratölteni, megvan a nyuszi az oldal nem imádnivaló?
>> Ez annyira aranyos.
Ön úgy döntött, egy nagy, nagy fénykép.
Én ásni azt.
>> OK, így van ez imádnivaló nyuszi most.
Tudtuk, hogy adjunk egy kép, csak úgy.
Tehát alapvetően ha van olyan kép szeretné felvenni a weboldal,
akkor add hozzá, mint ez.
A másik dolog az lenne, ha akkor a tárolt kép
ugyanabban a mappában, mint ezt a fájlt, akkor csak
írja a nevét, amit a kép van, ahelyett, hogy internetes kapcsolat.
>> Ez még mindig idézőjelek közé.
Ez éppen olyan, mint ha nevezte this--
ha ez a kép már mentve a mappában ezzel HTML fájl
hogy én vagyok szerkesztés és hívták bunny.jpg.
Azt is megtehetik, hogy a és ez jelenik meg.
Én azonban nem ezt a mentett a fájlt, és nem szeretném, hogy a nyuszi,
így megyünk, hogy a link.
>> KÖZÖNSÉG: Mi az rabbit.org?
>> ALLISON Buchholtz-AU: rabbit.org.
Ez egy appropriate-- néz, akkor elfogadja azt.
Elfogadása.
bunny.jpg.
Azt akarom, hogy fogadja el ezt a nyuszi.
Ó, Istenem, ez annyira aranyos.
>> OK, így már hozzá fejlécet.
Már hozzá egy képet.
Nyilvánvaló, hogy hozzá szöveget itt, ugye?
Ha akartuk, hogy további szövegek, akkor mennék, mint ez.
Tehát ez egy másik bekezdés.
>> És azt mondják, hogy "ez egy másik bekezdés."
Is, én vagyok a szörnyű helyesírás, úgyhogy lehet elgépelt dolgokat.
Csak FYI.
>> Tehát egy bekezdés itt, ugye?
Így talán szeretne tenni valamit egy kicsit érdekesebb, mint
az összes szöveg, mint jobbra igazítva.
Lehet, hogy szeretne a központtól a szöveget, OK?
>> Tehát, ha valaki azt akarja, hogy használja ezeket a praktikus számítógépek előtted
és mondja meg, hogy te vagy majd a központtól ezt a szöveget,
>> KÖZÖNSÉG: p align.
>> ALLISON Buchholtz-AU: Tehát p align egyenlő "központ".
Ő megöli, srácok.
Y'all fokozni kell.
És mi van "Ez középen."
És most már valami középre.
>> Ugyanilyen módon, ha akarja balra igazított,
meg tudná csinálni align egyenlők balra, jobbra igazítása egyenlő.
Teljesen rajtad múlik.
Ha én itt, akkor ez a törekedjen: most már jobbra igazítva.
>> KÖZÖNSÉG: Allison?
A kép forrása, miért nem ott közel az img forrás?
ALLISON Buchholtz-AU: Sajnálom.
Ezt kell lenni Most már ott jó.
Most vagyunk jó.
KÖZÖNSÉG: Nem Van zárja le ott, vagy nem?
ALLISON Buchholtz-AU: Nos, img forrás, ez az egyik Csak-- kép,
ez csak az egyik eleme tekinteni, míg a ha azt veszi észre, hogy a többi hasonló,
van néhány tag, akkor információ arra vonatkozik, majd a záró tag.
De a kép, minden csak egyfajta önálló.
Cool.
Szóval tudjátok, hogyan kell létrehozni a header, tudod, hogyan kell beviteli,
Ön tudja, hogyan tegye a képet A most, akkor csatlakoznak a dolgokat.
>> A másik dolog, amit Lehet, hogy képes megtenni
az, hogy hozzon létre egy listát CS-- vagyunk milyen lesz a jövő heti PSET.
A dolog, hogy mi általában tanítani ezen a héten
megy igazán jól jövő heti PSET, így vagyunk
fajta keverés, egymást átfedő dolgok itt.
De lesz hasznos a jövő héten.
>> Tehát, ha azt akartuk, hogy egyfajta lista, hogyan lehet azt csinálni?
Ön nem tud válaszolni ebben az időben.
Valaki másnak kell.
Ez nem nehéz, srácok, megígérem.
Google "rendezetlen listát HTML."
Mi volt ez?
>> KÖZÖNSÉG: [hallható].
ALLISON Buchholtz-AU: Így van.
Így akarunk megrendelt vagy rendezetlen?
Csináljunk egy rendezetlen.
Tehát néhány ul, amely jelentése Rendezetlen lista.
És mi van az egyes elemek?
Vajon ez kell a saját tag?
Lehet csak elkezd írni a dolgokat?
>> KÖZÖNSÉG: li.
>> ALLISON Buchholtz-AU: li.
Szóval, mi a lista lesz?
Mit akarunk itt?
Mi csak nem neveket.
Csak tedd Jacob.
>> KÖZÖNSÉG: Nyúl ételek.
>> ALLISON Buchholtz-AU: Nyúl ételek.
OK Szeretem ezt.
Nyúl ételek.
>> OK, így már sárgarépát.
Szeretem ezt a témát nyúl.
Én ásni, hogy sokat.
KÖZÖNSÉG: Igazából azt hittem, hogy Jacob lenne legális.
ALLISON Buchholtz-AU: Jacob?
Jacob nyúl étel.
Ha látta Jákób fotó munkaidejében
lehet, hogy azt hitte, kapott megtámadta a gyilkos nyúl.
>> KÖZÖNSÉG: Van egy nyúl most.
Van egy gyilkos nyúl most.
>> ALLISON Buchholtz-AU: Viccelsz velem?
>> KÖZÖNSÉG: Majd hozza a következő részben.
Megvan.
>> ALLISON Buchholtz-AU: Ez nevetséges.
Mindegy.
>> KÖZÖNSÉG: [hallható]
>> KÖZÖNSÉG: Igen, a Proctor van egy nyúl is.
>> ALLISON Buchholtz-AU: Szeretnék egy nyúl.
OK, aki hoz egy igazi nyúl A következő szakasz, a teljes brownie pontokat.
KÖZÖNSÉG: [hallható]
KÖZÖNSÉG: Ó, ez nem igazi.
Ez egy kitömött nyúl.
>> ALLISON Buchholtz-AU: Oh igen, tudjuk zárni ezeket.
Úgy néz ki, rad.
KÖZÖNSÉG: Vajon tényleg számít?
ALLISON Buchholtz-AU: ez nem.
A legtöbb dolog, nem zárja a tag,
99% -a az idő semmi rossz fog hogy megtörténjen, de ez jó stílus is.
Így Jacob.
És mi van a saláta.
KÖZÖNSÉG: A hivatkozások, ez nagyon fontos.
ALLISON Buchholtz-AU: Hm?
KÖZÖNSÉG: A hivatkozásokat.
ALLISON Buchholtz-AU: For hivatkozásokat.
Igen, van rá hivatkozásokat.
OK, így lássuk itt.
És mi van a közeli listánkon.
És nézzük azt.
Van all-- Jacob ott.
Rabbit étel.
Eszembe jut Bunnicula.
>> KÖZÖNSÉG: [hallható]
ALLISON Buchholtz-AU: hozom vissza a régi iskola hivatkozások ma,
nem?
Csak a régi iskola hivatkozásokat.
Kellett volna hozni, mint a Gogurts vagy valami snack.
>> KÖZÖNSÉG: Or Gushers.
ALLISON Buchholtz-AU: Oh.
OK.
Majd meglátjuk, ha tudok követni le Gushers a jövő héten.
Azt hiszem, meg tudom csinálni.
Azt hiszem, talán van néhány az irodában.
>> OK, így már fedezett egy csomó más dolog, amit tehetünk a HTML, ugye?
És akkor talán látni, hogy nothing-- remélhetőleg nem túl intim--
ha így van, akkor nem értem lekicsinyelni senkinek.
Ha sikerül, kérem, jöjjön hozzám beszélni.
>> De a legtöbb ez csak nézi a szintaxis, igaz?
Ha Ön is szeretne egy rendezetlen lista, Ha azt szeretnénk, valamilyen lista,
ha meg akarja igazítani valamit, vagy formátum valami, ez az egész csak
fajta keresi fel a szintaxist HTML, ugye?
És egy dolog, ami nagyon jó valójában
az, ha megy to-- lássuk, mi egy jó weboldal, amit szeretne?
Bárki, aki kedvenc weboldalak hogy rendben vannak, hogy ki az interneten?
Tudod mit, menjünk csak nem CS50.
Ez szép és biztonságos, ugye?
>> OK, így CS50 itt.
Ó, nézd, van egy rész most.
Ha tetszik, ahogy kinéz.
>> KÖZÖNSÉG: [hallható].
ALLISON Buchholtz-AU: Nem vagyunk csinálni meta szakasz, srácok.
Ez nem lehet igaz.
Nem lenne jó, de nem fogunk csinálni.
>> Szóval, mit tudnál tenni, ha úgy tetszik az út
ez működik akkor mindig jobb kattintson bármelyik weboldalon, hogy tetszik
és meg tudod csinálni Oldal forrásának megtekintése.
Ez hozza létre a HTML.
És ez tényleg egy nagyon jó Így a stílus a saját weboldal.
Ugrás egy weboldal, amit nagyon szeretem, és nézd meg a HTML
és kitalálni, hogyan csinálták.
>> És szó szerint, amíg ahogy idézni dolgokat,
amíg te nem csak lopás az emberek, hogy ez rendben van.
Különösen CS50 [? finanszírozására?], mi
fajta várja, hogy kap ihletet más weboldalon.
Szóval nyugodtan.
Nézd át weboldalak úgy gondolja, nagyon szép
és kitalálni, hogyan használják HTML és CSS csinálni ezeket a dolgokat.
>> Szóval mint látod itt, ott nyilván mint linkek és van egy osztály van.
Van egy link itt.
Van egy lista.
Valószínűleg néhány Képek itt valahol.
>> Van néhány jó stílus itt.
Ez a következő dolog fogunk csinálni.
Szóval stílus, amikor ezeket a stílus konzolok, ez alapvetően CSS.
Ben, te kérdésed van?
>> KÖZÖNSÉG: Mi a div?
>> ALLISON Buchholtz-AU: div csak a-- mi div?
KÖZÖNSÉG: Division.
ALLISON Buchholtz-AU: Division.
Igen, olyan, mint elválasztó különböző elemek.
OK, tehát itt az, amit mi fog menni a jövő.
Így ez nem lehet a legjobb stílus mert, ha azt észleli,
van HTML és stílus ugyanazon az oldalon, és mi valóban szeretné elkülöníteni azokat,
OK?
És valóban, hadd nyit az igazit
mert ez állítólag a PDF, így már style.css.
>> Tehát mit tehetünk itt ezek olyan jó dolog, mint valami elhalványulnak
és tudtunk próbálni, és nem azt, de úgy érzem, mint tenném rendetlenség, hogy akár menet közben,
így azt javasoljuk, hogy a srácok próbáld megy, hogy a saját,
de nem fogok csinálni most.
Tehát, ha a srácok, ne feledd, Ha valaha megüt probléma készlet,
valami csap az oldalról.
Meg kell csinálni a fading és Az átmenet és miegymás.
>> KÖZÖNSÉG: És ez minden CSS és HTML?
>> ALLISON Buchholtz-AU: Minden CSS és HTML.
Igen.
Így nem sok igazán jó dolog, a CSS és HTML.
Tehát a félelmetes nyuszi weboldal itt, mi
fog tenni egy kis kis CSS stílus vele.
>> Tehát, ha valaha is a stílus lemez, amely már itt,
akkor csak hívja style.css.
Meg lehet nevezni, amit csak akarsz.
Mi a fontos az, hogy megyünk hivatkozik rá a mi web.html itt.
>> Szóval, mit fogunk tenni az we-- úgyhogy ne szórakozz ezt up--
fogunk kapcsolni a két fájlt együtt.
Így ugyanabban way-- megyek az analógiát vonhatunk a C itt.
Ugyanígy, hogy ha van néhány library-- és mi cs50.h--
a fordító köti.
Ez csak egy kifejezett Link a részünkről.
Tehát ugyanúgy, ahogy mi hash tartalmaz néhány fájl, amit
Én azon vagyok, hogy írni csak az HTML / CSS megfelelője azt.
>> Mi csak azt mondom, rendben van, ez a weboldal fogja használni ezt a stíluslapot, OK?
Tehát link rel egyenlő stíluslap.
És akkor mi van típus, css.
És akkor href egyenlő.
>> OK.
Tehát mindez nem itt lehet gondolom, ez ugyanaz a dolog, mint
mint a hash tartalmazza.
Nyilvánvalóan úgy néz ki, egy kicsit bonyolult, de minden esetben,
ez gyakorlatilag ugyanaz.
Szóval ez csak néhány összekapcsolása egy stíluslap, ez a típusú text / css,
és a neve is style.css.
>> Mit fontos tudni az, hogy a weboldal
hogy én dolgozom jobbra now-- web.html és style.css-- vannak ugyanabban a mappában.
Mivel a különböző mappákban, meg kell adni a tényleges gyökér
rá vagy az elérési útvonalát.
De ebben az esetben, mi tartása szuper egyszerű és ez lesz itt.
Tehát, ha ezt tesszük, van néhány Már sorban állnak a dolgok itt.
>> Tehát néhány szervezet, amely megy hogy a háttér színe, amely
most a világoskék.
Meg lehet változtatni, ha akarunk, de ha jól emlékszem ez a helyes,
meg kéne változtatni a világoskék.
És most van egy világoskék háttér.
És mi volt here-- tud valaki emlékszik melyik hash azonosítót vagy osztály?
>> KÖZÖNSÉG: ID.
>> ALLISON Buchholtz-AU: ID.
Cool.
Szóval, mit akarunk csinálni az, hogy ezek közül betűtípusok
vagy which-- akarunk "Nézd az aranyos nyuszi ", hogy lila?
Azt hiszem, azt akarjuk, hogy a lila.
Vagyok le, hogy mivel lila.
>> Szóval, mit csinálsz a te ID equals-- ebben az esetben
Azt mondtam, mi, szép színes itt.
Mi reload.
Hirtelen, ez lila.
OK, így azonosító, emlékszem azt kell egyedi,
így soha nem lehet a ez az azonosító máshol.
De osztály, mint mi itt egy szép betűtípust,
Azt kell tudni használni hogy bárhol akarok.
>> Szóval ezt itt.
Így azt mondhatjuk, osztály felel csinos font.
És ha megnézzük most, mi ezt a hűvös csinos font ide.
Így talán azt akarom, hogy mindkettő.
OK, én tényleg nem tudom, hogy ez fog működni, de azt akarom, hogy próbálja ki.
És ez az, hogyan tanulnak a CSS és HTML.
Te, tudod mit, akarom próbálni ezt.
Nem vagyok biztos benne, hogy működni fog.
Nézzük meg, hogy működik.
>> És nézd meg azt.
Most a lila és ez egy nagyon font.
OK, így már ezek a különböző dolog, amit tehetünk.
Van egy kérdés?
>> KÖZÖNSÉG: Igen.
Nos, csak, mint a színek Ön által használt szavak.
Van úgy, hogy nem a színek A hexadecimális RGB?
ALLISON Buchholtz-AU: Azt is csinálni hexadecimális, azt hiszem.
Igen.
De ez a fajta jó, ha Nem akarom nézni őket.
Tudod csak olyan, mint, lila vagy kék.
KÖZÖNSÉG: Reméljük, tudom, hogy ez mit jelent.
ALLISON Buchholtz-AU: Így van.
Szóval, hogy ez vagy olvasási sárgászöld.
Miért válasszam valaha chartreuse?
Ez egy érdekes szín.
>> OK, így nyilvánvalóan láthatjuk mi Megváltoztathatja a dolgokat viszont szeretnénk.
Ha akarta, hogy create-- mondjuk azt akartuk, hogy hozzon létre egy másik osztályba.
Mi lehet akartok változtatni?
Ha húzza fel W3Schools " CSS dokumentáció,
Bízom a szót srácok.
Mi lehet próbálni, és nem valami hűvös ez az utolsó pár percet.
Mert én ilyen adott Önnek gyorstalpaló egy csomó jó dolog
hogy meg tudod csinálni.
De a végén, mint mondtam, ha csak kísérlet, akkor sokat tanulnak.
>> KÖZÖNSÉG: Nem úgy nézel ki, hogy a font?
>> ALLISON Buchholtz-AU: Igen, Felnéztem, hogy font.
Szóval, mint a szó szoros értelmében, én ment to-- mit tegyek?
Én CSS font listát, és akkor én verem font,
és aztán olyan volt, mint, nézd, itt az összes betűtípus hűvös, amit tehetünk.
És ott volt az egyetlen, így Másoltam, hogy a vágólapra.
És akkor én, mint OK, hűvös, ott megyünk.
Kész.
>> KÖZÖNSÉG: Szóval kell győződjön meg róla, hogy tudja, hogy mit CSS font.
>> ALLISON Buchholtz-AU: Igen.
>> KÖZÖNSÉG: Mi azt mondjuk a végén?
Kurzív?
>> ALLISON Buchholtz-AU: Kézírás.
Igen.
>> KÖZÖNSÉG: Háttérkép.
>> ALLISON Buchholtz-AU: háttér kép.
OK.
Szóval azt akarod mondani nekem, hogyan kell ezt csinálni.
Itt hagyom ezt neked.
Én csak gépelés itt most.
A kerék a te kezedben van.
>> KÖZÖNSÉG: OK
>> ALLISON Buchholtz-AU: OK.
Mit csinálok?
>> KÖZÖNSÉG: Doing-- Tudom, mit után jön a zárójel.
ALLISON Buchholtz-AU: OK.
Tehát valószínűleg a test, én azt feltételezik, mert vagyunk
csinál a háttérképet.
>> KÖZÖNSÉG: Igen, csináljuk meg.
>> ALLISON Buchholtz-AU: OK.
KÖZÖNSÉG: OK, így háttér vastagbél, és aztán
kell egy URL-címét a képet.
Lehet, hogy pszeudo-kód, amely most, talán.
>> ALLISON Buchholtz-AU: Mi azt akarod, én to--
KÖZÖNSÉG: Gondolkodom, mint a GIF.
ALLISON Buchholtz-AU: A GIF?
Ez lesz érdekes.
OK, mit keresek én itt google?
>> KÖZÖNSÉG: Nem, ez az Ön választása.
>> ALLISON Buchholtz-AU: Miért Nem we-- ha ez egy nyuszi,
Úgy érzem, kell egy szép füves gyep vagy valami.
>> KÖZÖNSÉG: Meadow.
A rét.
>> ALLISON Buchholtz-AU: A rét?
OK.
KÖZÖNSÉG: Or Rachel Maddow.
ALLISON Buchholtz-AU: Ez az egyik úgy néz ki, elég.
Ó, ez az apró, mégis.
Mi kell egy jó kép.
Lássuk.
Ó, nézd.
Ez egy szép réten.
Tudod mit, én szeretem ezt.
Nézzük másolja ezt.
>> KÖZÖNSÉG: OK, úgyhogy azt hiszem, Az URL, nyitott zárójel.
>> ALLISON Buchholtz-AU: OK, URL.
>> KÖZÖNSÉG: Akkor a cím.
>> ALLISON Buchholtz-AU: OK.
Ez minden, amit kell?
>> KÖZÖNSÉG: Bezár zárójel pontosvessző, majd a tér, háttér kötőjel
mellékletet vastagbél rögzített, és kapcsos zárójel.
>> ALLISON Buchholtz-AU: OK.
Lássuk, hogy működik.
Ez lesz elég jó, ha igen.
Vagyok igazi izgatott itt.
Nem működik.
Kíváncsi vagyok, hogy miért.
KÖZÖNSÉG: Lehet, hogy az URL-t kell lennie idézetek.
ALLISON Buchholtz-AU: Talán.
És ez az, hogy hogyan tanulunk, srácok.
>> KÖZÖNSÉG: Tudunk hátországa színét és háttérképét?
>> KÖZÖNSÉG: Nem.
Egy hatályon kívül helyezi az többi.
>> ALLISON Buchholtz-AU: Nemtom.
Lássuk.
Nézzük, hogy ki és lát.
>> KÖZÖNSÉG: Ó, talán, igen.
[Közbeiktatásával VOICES]
>> ALLISON Buchholtz-AU: OK, ez obviously-- I [hallható] itt.
Így OK.
KÖZÖNSÉG: Háttér mellékletet.
ALLISON Buchholtz-AU: Ah.
>> KÖZÖNSÉG: OK, én nem tudom.
ALLISON Buchholtz-AU: ez úgy néz ki kell dolgozni.
Biztos vagy benne, hogy a vastagbél után az URL?
>> KÖZÖNSÉG: Nem, ez pontosvessző.
ALLISON Buchholtz-AU: Ez pontosvessző.
KÖZÖNSÉG: Mondtam kettőspont?
ALLISON Buchholtz-AU: Azt mondta, a kettőspont.
KÖZÖNSÉG: Ó, nem.
ALLISON Buchholtz-AU: Tessék.
KÖZÖNSÉG: Ó, várj, most nem tudjuk olvasni a szöveget.
ALLISON Buchholtz-AU: Most nem tudja olvasni a szöveget,
de mi van a háttérkép.
Mmhmm?
>> KÖZÖNSÉG: Van HTML támogatja a dinamikus tartalom?
Mint, tudnád, hogy a kép átméretezése attól függően, hogy az ablak méretét,
vagy az, hogy a CSS--
>> ALLISON Buchholtz-AU: Így CSS van erre.
Tehát, ha a srácok érdekel A tanulás korszerű CSS,
Én együtt tanítás szeminárium CSS a 7..
És ígérem, hogy lesz sokkal mélyrehatóbb
és sokkal többet hűvös dolgok ebben a fejezetben.
És a co-tanár, mint teljes front end web dev mester.
Így lesz elég jó, ha azt szeretnénk, hogy megismerjék a jó dolog
hogy CSS tehet.
>> De mi van itt a háttér mellékletet
fixed-- így bizonyos fix size-- de valójában dynamically--
Ha valaha is látni weboldalak, mint a legtöbb jó weboldalak fog tenni,
amikor beállítja az mérete a böngésző,
azt állítja a háttérben, vagy mennyi mutat vagy formázza a dolgokat, ugye?
Szóval, ez az, amit úgy hívunk relatív pozícionálás.
>> És CSS valóban megragad, hogy mekkora a böngésző szélessége vagy milyen magas is,
és akkor helyezze a dolgokat szerint a relatív méretek
versus abszolút méretben.
És ez nyilvánvalóan fejlettebb CSS, de ez valami, amit tehetünk.
Ha szeretne tanulni több, jön az én szemináriumot.
>> Annak érdekében, hogy az, amit tehetünk.
És CSS tud valójában do-- CSS és JavaScript,
amit kapsz a jövő week-- is lehetővé teszi, hogy dinamikusan változtatni
oldalakat anélkül, hogy újratölteni őket az idő.
És kapsz, hogy néhány nagyon jó dolog.
>> Szóval van még egy dolog hogy a srácok érdemes csinálni
vagy bármit, amit akar felfedezni?
Jelenleg 10 perc van hátra.
Azt is korai távozása, de ha szeretne tenni néhány dolgot web,
tudjuk, de nem vagyok fog kényszeríteni, hogy.
De akkor is csak enni édességet.
KÖZÖNSÉG: Jelölje ki a szöveget fehér, így el tudod olvasni.
ALLISON Buchholtz-AU: OK.
Tehát ebben az esetben, szeretnénk néhány p.
KÖZÖNSÉG: Ha mi azt a test, vonatkozik az egész oldalon?
ALLISON Buchholtz-AU: Igen, mi is valójában.
Ez egy jó ötlet.
Szóval ugye have-- tudjuk, hogy mit kell tenni?
Nem tudom, hogy meg tudjuk csinálni a szöveg színét.
Úgy volt, hogy megpróbálja hozzon létre egy másik osztály itt.
>> KÖZÖNSÉG: Hogyan kap olyan hogy azt a javaslatot?
ALLISON Buchholtz-AU: Tehát ha ti érdekel,
ez egy másik szöveg szerkesztő hívott Sublime.
Meg kell tudni, hogy telepítse a készüléket.
Néha ez egy kicsit trükkös.
Ha szeretne segíteni azzal, Vagyok szuper szívesen segít
vele, mert nagy és gedit ez félelmetes, mert akkor fordítsuk le
az alsó, de én tényleg mint Sublime mert elég
és ez nem a dolgok mint az auto-complete.
>> Így biztosan nyugodtan hadd tudjam meg, ha akarsz csinálni.
Ha csak google "Sublime szöveg, "ez általában
leírja, hogyan kell telepíteni A különböző operációs rendszerekben.
Ez nagyon klassz, én gondolom, véleményem szerint.
Így p.
Azt hiszem, csak nem vagy text-- mi csak csinálni színe "fehér".
Ott.
>> Szóval, mit tettem, az, hogy én nem változtatta meg a szöveget.
De p itt csak egy tag, hogy van, ugye?
Ez a paragrafus.
Szóval most létrehozott egy CSS elem azt mondta, rendben, valami ezzel a címkével
p, hogy a fehér szín.
>> Tehát, ha észrevette, tette ez a fehér és a fehér.
Nem teszi a listánkon, mert fehér ez nem társított.
Lehet megy keresztül, és meg tudná say--
>> KÖZÖNSÉG: Ne háttérszín.
>> ALLISON Buchholtz-AU: háttér színe?
>> KÖZÖNSÉG: háttere cső szín, ahová a p tag.
>> ALLISON Buchholtz-AU: OK.
Azt akarod, hogy fehér?
KÖZÖNSÉG: Mmhmm.
ALLISON Buchholtz-AU: OK.
Tessék.
KÖZÖNSÉG: Ez furcsa.
ALLISON Buchholtz-AU: Elég jó, ugye?
Tehát, ha csak szórakozni, fogsz tanulni sokat.
És ez is elég jó.
Azt hiszem, ez határozottan örömteli, mint néha
mert nem kell várni a program összeállításához.
Tudod csak megüt Frissítés és te, mint, ó, nézd,
működött, vagy jaj, én vagyok talán hiányzik valami.
És ez valami, ami igazán hűvös erről következő részében az osztály,
ez biztosan én gondolom, könnyebb ellenőrizni
ahogy megy az út mentén versus kelljen összerakható hosszú programok
és akik imádkoztak és hogy működik a végén.
>> Tehát, azt hiszem srácok minden úgy tűnik, jó.
Ha bármilyen kérdése van, mint mindig, gyere beszélni hozzám, gyere hadd tudjam meg.
Ott leszek a jobb külső a következő 15 perc alatt
ha akarsz beszélgetni semmit, és mindent.
>> Szóval remélem, guys-- jó szerencsét a PSET.
A határidő péntek délben mert megjelent késő.
Szóval valószínűleg látni sok srácok csütörtökön,
de remélhetőleg nem.
Talán akkor van ez történik majd.
Lennék szuper büszke.
>> De ha nem, akkor találkozunk csütörtökön.
Ön is használja a kései időpont, amely kiterjeszti a szombat délben.
De én nem-- mi?
>> KÖZÖNSÉG: Halloween.
>> ALLISON Buchholtz-AU: Ez Halloween, a, és b,
Nem hiszem, hogy nem lesz legyen munkaidőben pénteken.
Szóval tényleg megpróbálja intézd szerint Péntek, hogy mindannyian ünnepeljük
Hallow hétvégén.
Rendben, én találkozunk a jövő héten.