[Música tocando]
ALLISON Buchholtz-AU: Todo ben, todo.
Benvido de volta á sección.
Polo tanto, a nosa axenda para hoxe está pasando sobre moito máis cousas dev web.
Non sei cantos de xa viu súas Serie de exercicios
desde que foi lanzado ao comezo desta mañá.
Eu faría como cantos persoas leron a especificación,
pero vendo como tivo todo de, como, sete horas de miralo
e é un luns e Probablemente xa tivo clase,
Eu estou indo supor que a maioría de vós non ten.
Se ten, eloxios extras.
>> Está basicamente axudando aplicar unha simple web
servidor en C, que é unha marca nova pset, para que vostedes poden ser as cobaias.
Vai ser unha diversión, semana salvaxe, pero eu creo que vai ser moi divertido
e vai ser realmente un boa experiencia en realidade.
Entón, para prepararse para que, na sección de hoxe,
nós estamos indo a ir chmod, TCP / IP, e logo un pouco de HTML e CSS.
>> Ao final, nós imos realmente código unha páxina web sinxela xuntos
para axudar vostedes tipo de obter máis familiarizado con iso.
E entón se aínda non colleu súas probas, están diante,
pero eu estou seguro que todo o mundo aquí ten o seu quiz.
E tamén nesa nota, solucións non están aínda,
pero, logo que finish-- gusta, o últimos persoas que toman a súa quizzes--
van ser superior.
Se ten algunha dúbida Non obstante,
sexa a vontade para me enviar correo-e, persoalmente.
Vou responder coa súa persoa preguntas, como sempre fago.
>> Entón, nesa nota, chmod.
Entón, basicamente, todo o que precisa saber sobre o chmod
é que se usa para cambiar permisos de ficheiros, non?
Polo tanto, é só algúns sistemas chamalo cambiar os permisos, como se di aquí.
E se queres ver cales permisos dun ficheiro ten,
no canto de só facer ls, podería facer ls -l.
l queda por moito tempo.
>> Entón vai facer longas listas de todo, e
lle vai dar moito máis detallado información sobre cada un dos seus arquivos.
E vai ver que eu son something-- vai saltar a un second--
pero vai ver algo semellante a que a liña superior hai para cada ficheiro.
E nós imos pasar o que iso significa.
>> Entón, basicamente, para cambiar seus permisos de arquivo,
só quere usar chmod.
Pode pensar niso como calquera outra UNIX chamar como ls ou cd ou outros enfeites.
É só unha especie de outra chamada como.
>> Entón nós facemos chmod e entón nós imos ter tres díxitos normalmente.
Existen algunhas formas de facer el, un dos cales nós falaremos sobre.
Pero, normalmente, terá tres díxitos que varían de 0 a 7 de cada vez.
>> Entón, unha cousa é que hai tres diferentes permisos
que podemos dar a cada arquivo.
E é lexible, o que é representado por r, que vai ter sentido
en algo; w, que é gravábel; e executable, que é x.
Sei que o e un, executable, quizais non o máis sentido, pero nós
representa-lo con x.
>> E entón o que pasa é cada un destes Tamén ten a representación número.
Entón, nós temos 1, 2 e 4.
E, basicamente, o que pasa é cada un destes tres números
aquí corresponde a un conxunto de usuarios
aqueles que se refiren á permisos.
>> Entón pode pensar que o primeiro número corresponde ao usuario real
ou o propietario do arquivo, o segundo número corresponderá ao grupo,
ea última refírese a ao mundo, OK?
Entón, o que pasa é lembrar os números de r é 4, w é 2,
x é 1, non?
Isto-- se sumar os para arriba, que lle dá o primeiro número
que poderiamos entrada na nosa chmod.
>> Polo tanto, neste caso, o que que este número pode?
Sería 4 máis 2 máis 1, que é a 7, non?
E neste caso, estes non ten nada,
de xeito que este aquí sería traducir para chmod 700, OK?
E o que iso fai é que concede todos desas permisos para o seu usuario.
>> Entón isto significa que o noso usuario poden facer o que queiran.
Poden ler este ficheiro.
Poden realizar este ficheiro.
Poden escribir para este ficheiro.
Pero o grupo e para o mundo, non permisos de calquera natureza, OK?
>> Así, outra forma de escribir que, podemos facer chmod de tres díxitos, cada un dos cales
corresponde a calquera que sexa a suma ou que grupo específico é, subconxunto específico.
Ou podemos facer realmente outra cousa.
Aguante.
Podemos facer algo con estes aquí.
>> Cantos de vós viu un exemplo onde como era chmod un plus x?
Viu que, na charla, creo?
Así, unha soportes para todos.
Significa dar a todos os usuarios, que eu esquezo de poñer aquí.
>> Pero unha vantaxe x si observar aquí, se facemos
para chmod-- o grupo que estamos falando máis permisos
queremos darlles.
Entón, iso pode ser unha vantaxe ou unha desvantaxe.
Ademais, engade permiso.
Minus tira permiso.
Moi intuitivo, eu creo.
>> Así, unha vantaxe x significa chmod.
Así, cambiar os permisos de todas as persoas Se esta é unha autorización Engadir A--.
E x-- que significa que o permiso estamos concedendo todos.
Ler, escribir ou executar?
>> Audiencia: Executar.
>> ALLISON Buchholtz-AU: Executar.
Entón, nós estamos dando a todos os usuarios permiso para executar o ficheiro, OK?
Entón, o que se quería facer que, coa forma numérica?
Entón lembre-se con numérico, queremos tres números.
>> Audiencia: 4.
ALLISON Buchholtz-AU: Que foi iso?
Audiencia: 4.
ALLISON Buchholtz-AU: Non 4.
Audiencia: 0, 0, 4.
ALLISON Buchholtz-AU: Ben, queremos para dar a todos os usuarios, non?
Entón, nós imos ter un número en cada slot.
Isto vai ser o mesmo número en cada slot
porque nós só queremos dar todos permisos executable.
Entón executable é 1, pero no camiño certo.
>> Entón, se nós fixemos chmod 111 que faría ser o equivalente dunha chmod máis x.
Isto ten sentido para todos?
Nós imos pasar por un par de exemplos.
>> Así, a gran takeaway aquí é un non é aquí,
pero significa só dar a todos os usuarios.
u é se quere só para dar ou quitar
un permiso específico do o usuario ou o propietario.
g é para o grupo, de xeito que díxito do medio.
E entón os outros que pode pensar como o mundo, que o último díxito.
>> Entón, con iso, imos a un exemplo, porque eu sinto como exemplos sempre
facer estas cousas máis fáciles de entender.
Entón rwx-- pasamos por isso- tamén podería ser representar como 700.
Este é o exemplo que parecía en máis da imaxe.
Entón chmod 444 nalgún arquivo daría os permisos?
Vostede estaba moi preto.
Audiencia: lexible para todos.
ALLISON Buchholtz-AU: lexible.
Entón lexible para todos, non?
E entón, o que é outra forma de facelo?
Se queremos facer chmod con calquera desvantaxes de w do r ou, máis e,
o que este chamamento parece?
Sería chmod o que?
>> Audiencia: un plus r.
>> ALLISON Buchholtz-UA: un plus r no 5.
OK, entón iso é o mesmo que este, só dúas traducións diferentes
da mesma cousa.
Entón, con iso, temos estes.
Entón, quero que vostedes tentar escribir este tipo de no seu camiño contrario.
>> Así, con chmod 555, o que sería a sensación?
Sería un plus ou u para máis ou para outros enfeites?
Ademais de u x, déame os tres números.
E entón me diga sobre o que permisos en realidade estamos concesión e para quen?
>> Entón, eu vou dar a vostedes dous minutos para traballar niso.
Sinto-se libre para falar uns cos outros.
Para aqueles de vostedes que viñeron nun pequeno tarde, hai doces e camisas.
Temos tres camisas á esquerda, e temos Kit Kats e Starbursts.
Polo tanto, Sinto-se a liberdade de entrar grab algúns neste pequeno interlúdio.
>> Ademais, a última é complicado.
É dúas chmods para o último.
De feito, déixeme pechar a porta mentres vostedes están traballando niso.
Doce é sempre necesario nunha tarde de luns.
>> OK, entón chmod 555.
Que é outra forma poderiamos escribir isto?
Calquera ideas?
Si.
>> Audiencia: a rx plus.
>> ALLISON Buchholtz-AU: r máis rx.
Quere explicar por que estaría rx?
>> Audiencia: Porque ten 5, de xeito que é 4 + 1,
de xeito que é lido máis executable, e é para todos.
ALLISON Buchholtz-AU: Certo.
Entón, só para reiterar, 5 aquí sabemos como a suma de 4 e 1,
porque cada número é o noso trío suma dos permisos para ese subconxunto,
non?
Ou o usuario, o grupo, ou do mundo.
Polo tanto, neste caso, sabemos que 5 ha de ser formado por 4 e 1.
>> E 4 e 1 corresponde á lexible e executable.
Estamos dando a todos, para que poidamos facer un chmod rx plus.
E, obviamente, nós só fomos as preguntas alí,
entón agora este ficheiro é executábel e lexible para todos.
>> Así que sobre o segundo?
O que pode o número para que un ser?
Calquera ideas?
Continúe.
>> Audiencia: 100 [inaudível].
>> ALLISON Buchholtz-AU: 100.
Exactamente.
Entón, quere explicar por que 100?
Audiencia: Por a usuario, polo que é a primeira posición.
E entón x é un executable.
ALLISON Buchholtz-AU: Exactamente.
Por iso, estamos concedendo executable permisos para só o usuario.
Polo tanto, neste caso, sería de 100.
E eu teño as respostas ó seguinte diapositiva no caso
está escribindo unha morea de cousas para abaixo.
>> OK, entón este próximo é realmente feito con dous chmods, podería facelo.
Entón, alguén ten algunha idea de como pode
obter chmod 640 reescrita no outro lado?
Pode cambiar o usuario en primeiro lugar e, a continuación, pode cambiar o grupo está a miña información.
>> Entón, se nós estabamos só cambiando o usuario, que é ese primeiro aquí,
o que podería ser o noso chamamento?
Así o usuario é u, non?
Entón chmod u máis o que?
Mmhmm?
>> Audiencia: rw.
ALLISON Buchholtz-AU: rw.
Certo, para ler e escribir, porque lectura é 4, w é 2, aqueles en conxunto como suma 6.
Entón, nós temos chmod u máis RW, e temos o noso primeiro 6 alí.
>> Entón para obter a 4, queremos agora para cambiar as nosas opcións do grupo.
Entón, nós imos facer chmod g máis o que?
¿Que é un 4?
>> Audiencia: r.
ALLISON Buchholtz-AU: r.
Precisamente.
Entón, nós estamos dando ao propietario ler e escribir permisos
e estamos dando a lectura grupo permisos, o que temos todo aquí.
Mmhmm?
>> Audiencia: Se pode escribir algo, iso implica que pode executa-lo?
>> ALLISON Buchholtz-AU: Vostede pode escribir para something--
Eu non creo que el implica que pode executalo.
Legal.
Entón, iso é todo o que acaba de pasar por.
Por iso, nesta próxima, é casos só unha especie de comúns
que quere manter-se en mente para establecer o seu problema.
Estes son tipicamente os permisos que nos gusta de usar.
>> Así, por 711, que dá nós, por suposto, o usuario
todos os permisos, que tende a ter sentido.
E entón é executable polo grupo no mundo, o que ten sentido
se ten algún directorio, vostede quere ser capaz de atravesar a el.
As persoas precisan de acceso.
>> Para calquera ficheiro non-PHP, está indo usar 644, o que faría o que?
O que isto implica, é o que permisos é que iso dá?
Así, o propietario pode o que?
Audiencia: ler e escribir.
ALLISON Buchholtz-AU: ler e escribir.
E, a continuación, grupo e outros pode só ler, non?
E entón chmod 600 para calquera Arquivos PHP que utiliza,
seu propietario, unha vez máis, pode ler e escribir para ela
pero todo o mundo é só unha especie de bloqueada.
>> Entón, iso vai realmente ser máis útil cando
chegar ao seu problema definir a próxima semana, onde
en realidade está a construír un sitio web.
Entón, se xa se deparou con os problemas estraños
onde non está cargando correctamente, quizais
que engadir un executable permiso, ou que precise dunha lectura
ou permiso de gravación.
Pequenas cousas que tenden a tropezar persoas up, pero iso é máis ou menos como o go-to
cando comeza pset da próxima semana.
E gustaríame darlle máis consellos pset desta semana,
pero eu teño que mirar para el xa que foi lanzado esta mañá.
Pero me escriba, eu olhei para el na hora que eu responder mañá.
>> Entón, agora, está todo o mundo ben con chmod?
Calquera dúbida remanentes?
Moi sinxelo.
Só un tipo de manter o control do que ler, escribir e executar números son
é probablemente a parte máis difícil.
>> Así, co TCP / IP, todos estes protocolos, tipo como as súas estruturas de datos
a semana pasada, é moito máis importante tipo de obter
intuición un nivel máis elevado deles.
Este non é CS143 a onde estamos indo para pedirlle para implementar unha rede,
así estará ben se non entende
o cerna da cuestión de todos os protocolos.
O que é importante entender é tipo como o que representan
e por que son importantes.
>> Así, o TCP / IP, por suposto, é a Transmission Control Protocol
ou Internet Protocol, que é basicamente, só un conxunto de leis, basicamente
ou normas que informan datos como debe ser tratado,
como debe ser empaquetado, transmitido, e recibidos.
Por iso, basicamente, do mesmo xeito que di aquí, aumenta as posibilidades
que os datos cheguen a onde queres que chegar.
>> Estou seguro que se vós foron para charla ou asistir-lo en liña,
el has-- eu non sei se o fixo este ano,
pero eu sei que o ano pasado, tivo unha demostración onde tiña unha foto de Rob
e el división la en catro e poñelas en sobres
e intentou obtelo mediante Sanders.
E pode tipo de pensar niso desa forma.
É só un conxunto de regras que contar datos como chegar nalgún lugar
e permite que vostede sabe se que falta datos,
do mesmo xeito que se está tomando varias páxinas de notas
e clasificalos los coa páxina 104, páxina 204, e volver a estudar máis tarde
e está perdendo something-- non pode atopar a páxina que sabe 304--
algo está mal, entón pode ollar a través das súas notas
novo ou pedir a alguén para reenviar lle a charla observa a partir dese día.
Do mesmo xeito que cos datos en internet.
Se eu estou pedindo algo dalgún servidor
e el que enviar Lo en varios paquetes,
Probablemente vai número Lo dalgún xeito diferente, imos
me saber cantos eu debería ter recibido, e dígame, oh, que é un dos 10
ou este é un dos 10.000.
Desta forma, cando ir remontar todas as pezas xuntas,
Sei que si algo falta e podo pedir iso de novo.
Será que isto ten sentido?
Só un conxunto de regras.
Na súa base, un conxunto de regras, OK?
>> Entón, nós tamén falamos pouco sobre os portos.
Isto é realmente só un estándar que permite que vostede sabe que tipo de datos
está sendo transmitido nestes paquetes.
Ou tamén coa nosa exemplo sobre, nós non
sei que é unha imaxe de Rob alí, a menos que gravala-lo
do lado de fóra do noso sobre.
Así, as portas son basicamente o mesmo.
É só unha forma de descubrir o que tipo de datos está a ser transmitido.
>> Polo tanto, temos todo o Os máis comúns aquí.
Entón 21-- estes tamén son tipo de como as cousas boas de saber.
É unha especie de unha pregunta do quiz fácil.
Sexa como, o que é que o porto 80 fai?
Ou, o que é que a porta 443 fai?
Entón as cousas boas de saber.
>> Polo tanto, temos aquí, 21 é o arquivo protocolo de transferencia, de xeito que só
as regras que gobernan a transferencia de ficheiros.
25, algo que todos nós utilizan moito máis, é e-mail.
53 é o nome de dominio sistema, que é basicamente
só unha especie de investigación para o Enderezo IP do nome de dominio.
>> Entón, eu estou seguro de que era mencionado na charla, se
ir a algo como google.com, ten un enderezo IP
que está asociado a el.
Non é, en realidade, google.com.
E así 53 é a porta que realmente leva
coidado co tipo de traducilo la en que o enderezo IP para ti.
E, a continuación, 80 e 443 son moi comúns.
Quere ter a súa páxina web ou ten a súa páxina web segura,
que unha morea de páxinas web son transferencia ata o momento.
>> Entón, ese é o tipo de alto nivel Resumo do protocolo de transferencia.
Non vexo moito máis en profundidade.
É o tipo de cousas legais se vostede está interesado.
Hai unha abundancia de recursos.
Wikipedia é realmente unha boa páxina.
Entón, eu estaba mirando para el só un pouco atrás,
entón eu recomendo mirando para el se está interesado
ou tomar 143 en dous anos, xa que Creo que é cada dous anos.
>> Así, ao final deste, estamos falando de páxinas web e HTTP,
que en realidade é o noso próximo tema para hoxe antes de entrar en HTML e CSS
e realmente pode codificar unha páxina web.
Vai ser divertido.
Nós imos ter fotos de coellos e será xenial.
>> Entón, HTTP, como podes ver aquí, é unha das adoráveis ​​siglas
Para esta semana, o que é Hipertexto Transfer Protocol.
Entón, de novo, é só outro conxunto de regras que
goberna hipertexto descargar, no presente caso.
Entón mellor forma de aprender sobre iso é só unha especie de
para división la en estas palabras individuais
porque hai unha morea de palabras na pantalla alí.
>> Entón, imos comezar con hipertexto.
Así, "amiga", pode pensar "Por enriba", como super-tipo cousa.
Por iso é realmente só texto levado ao seguinte nivel, polo que é como super texto,
como o seguinte texto.
Entón, é basicamente só texto que nos dá
máis información do que texto normal fai, OK?
>> Polo tanto, neste caso aquí, este é o hipertexto.
Isto dinos que temos algún enlace que imos,
que é cs50.net, que agora é cs50.harvard.edu.
Estes diapositivas son un pouco vello.
E vai para amosar como este, como un hipervínculo,
e, a continuación, un sitio moi legal.
>> Polo tanto, é o texto, que é un pouco bocado de cousas moi legais alí.
Entón pode conectar as cousas e pode inserir imaxes e pode estilizar as cousas.
E o máis familiar que caras probablemente ten con hipertexto
é Hipertexto Markup Language, HTML, que, por suposto, é todo web
que vemos ao noso arredor, concedido cun pouco de estilo CSS quede.
>> Pero, se alguén se moi grande co MySpace,
Estou seguro de que todo o HTML usado todo o tempo para crear
estes perfís perfectos, non?
Eu sinto que iso pode ser un referencia desactualizados agora, pero o que quere.
Só un little-- vostedes que non son moito máis novo.
Algúns de vostedes son máis vellos do que eu.
MySpace aínda era un cousa cando eu era novo.
Non son tan vello.
>> Sexa como sexa, HTML só unha forma de hipertexto.
Así, o hipertexto é só texto con recursos adicionais.
Así, o protocolo de transferencia é, probablemente, o máis dubidoso de explicar.
Obviamente, transfer-- só transferir de datos.
Así, é entre o cliente, como seu irmán web e un servidor.
Entón, basicamente, só o como a internet funciona.
>> Así, a petición exacto de como eses traballos, estamos
en realidade, vai mirar para un exemplo de solicitude e resposta.
Pero como solicitamos información desde un servidor
e como o servidor responde a nós é o que este protocolo de transferencia goberna.
Así, a solicitude ea resposta ten Para todas estas conxunto específico de regras.
É estandarizada de xeito que non importa onde está a través da internet,
traballa sempre a mesma, OK?
>> Unha vez máis, o protocolo, conxunto de regras.
É só unha normal, interacción do mesmo xeito
que o profesor fala sobre Malan se alguén estende a man,
vostede sabe que é cortesía común para acadar o seu fóra e trasfega súa man.
Isto é un protocolo, non?
>> Entón eu dar un pedido estándar, que é o que quero estreitarlle a man,
e dá algúns estándar resposta, o que é ou non grazas
ou lle podería tentar e presione miña man ou que vai tentar
e fist bump meu.
E non temos un protocolo para iso.
El rompe.
Pero se todo o mundo segue o mesmo protocolo, por suposto,
vai moito máis facilmente.
A xente se a coñecer-se.
Todo o mundo está feliz.
>> Así, no mundo web, todos seguen o mesmo rules--
lixeiramente mellor que as normas sociais.
Pero con iso, imos dar un ollo a petición exemplo aquí.
Entón hai ese pequeno clave aquí na parte inferior
que di que as cores diferentes, o que se supón que deberían dicir.
>> Así branco é como o seu método de solicitude e protocolo version--
o soliciten método, versión.
E entón esta é unha nome do campo eo valor
dese campo, o que imos ir moi, moi pronto.
Polo tanto, esta é unha solicitude de exemplo.
Isto é como eu que estende a fóra, querendo me presentar.
>> Isto é o que o cliente ou o que o seu navegador
sería o envío ao servidor.
Polo tanto, este é unha solicitude get, polo que é pedindo algo desde o servidor.
E é, por suposto, de HTTP e é a versión 1.1.
>> Entón o resto deste aquí é o que chamamos a cabeceira, e á súa información extra
que nos dá unha idea mellor o que en realidade estamos pedindo,
ou información que queremos dar o servidor que se pode pertinente.
Entón User-Agent dá un pouco máis descrición on-- por exemplo, aquí,
onda / 7.24.0 está realmente indo para contar o servidor que está a usar o Google
Chrome como o noso navegador.
Entón, se xa escoitou falar sobre as persoas que falan
sobre como facer unha aplicación responsabilidade para varios navegadores,
iso é algo que eles usaría, porque se
Non sei o navegador a solicitude está a benvida,
non pode adaptar os datos para iso.
Polo tanto, neste caso, o usuario é só dar este tipo
de información de identificación sobre o navegador
o usuario está a usar, OK?
>> Entón nós tamén temos de acollida, o que é onde estamos realmente queren ir.
Neste caso, queremos ir apple.com, mercar uns novos iPads legal
ou algo así, é posible bonito luces nos nosos dormitorios.
E o valor nome ao final é só un recheo, só unha cousa xeral
para vós veren.
En realidade, non corresponde a calquera cousa aquí.
>> Entón pode ter tanto ou tan pouco como quere en cada caso.
Na maioría das veces, estes son opcionais.
Depende só de que precisa do navegador,
do seu usuario, a fin de adecuadamente dar a solicitude.
Ou iso depende do que o usuario Realmente quere dar ao servidor.
Así pode que moitos, moitos destes nomes dos campos de cabeceira
ou só ten un par.
Igual que tantas cousas Eu xa dixen nesta sección,
el realmente depende do contexto de como está a usar iso.
>> Entón, iso ten sentido para todos?
Este é só un exemplo de unha proposta, cabeceiras, outros enfeites.
OK, entón con iso, temos algunha resposta.
>> Unha vez máis, temos o noso código de estado, protocolo versión e, a continuación, nome do campo e campo
Valorados como sempre.
Polo tanto, a nosa versión do protocolo e noso código de estado é de 200.
OK, o que significa que, si, todo foi ben.
Aquí está o que quere.
>> O tipo de servidor, o contido type-- el nos di, OK, vostede é
indo para obter un HTML texto.
Aquí é a lonxitude e é aquí o que ten que facer coa conexión.
OK, entón, de novo, dependendo sobre os datos que está a
pedindo, dependendo do que o servidor quere voltar a vostede,
pode ter máis desas campo nomes, pode que menos.
Totalmente dependente do contexto.
>> E, na medida este estado código aquí, por suposto,
200 non é o único podería ter, non?
Temos lotes de códigos de estado.
Alguén recorda calquera dos outros que mencionados na aula?
Moitos deles comezan con 4.
>> Audiencia: 404.
>> ALLISON Buchholtz-AU: 404, o que é?
>> Audiencia: Non se atopou o?
>> ALLISON Buchholtz-AU: Arquivo non atopado.
Exactamente.
Entón, o que dicir de 403?
Audiencia: Prohibido.
ALLISON Buchholtz-AU: Prohibido.
Entón, o que pensas isto significa que con chmods?
>> Audiencia: Isto significa que Non ten permiso para lelo.
>> ALLISON Buchholtz-AU: Exactamente.
Dalgunha forma, non ten permiso para acceder a ela, non?
Entón, 404, 403.
Hai un moi divertido que sempre
presentar todos os anos que Eu debería ter feitas ata aquí,
como 413, que é o que eu son un bule de té.
Pode google iso.
É divertido como, que é un código 413 e é que eu son un bule de té.
Que eu non sei por que faría ter que en internet,
pero eu desacordo.
Audiencia: Quizais sexa un bule de té.
ALLISON Buchholtz-AU: Quizais o servidor é un bule de té.
Quen sabe?
Todo ben, entón estamos a piques de transición á verdadeira codificación.
Eu sinto que vostedes van saír de aquí rápido.
>> Audiencia: Por que fai iso dicir "servidor: dúas veces?
>> ALLISON Buchholtz-AU: Hm?
Servidor dúas veces?
Esa é unha boa pregunta.
Non estou seguro.
Vou descubrir e Vou enviar correo-e a todos vostedes.
>> OK, calquera outras preguntas, ademais de que?
Boa?
Legal.
>> HTML e CSS, e agora nós chegar a todas as partes divertidas.
Así como eu mencionen antes, HTML é probablemente unha das cousas
vostedes están máis familiarizados.
Polo tanto, temos Hipertexto Markup Language.
>> A mellor forma de aprender isto-- non posúe láminas preparadas ou nada
para vós con HTML.
É realmente sobre a aprendizaxe da sintaxe.
E se está en MySpace día, que tería ese abaixo.
>> Entón, realmente, o máis importante é só para a práctica e experiencia.
Un dos grandes recursos que eu faría recomendo usar é W3Schools.
Entón, só tes que W, 3, e logo Escolas.
Teñen unha chea de recursos en HTML, CSS,
e eles realmente teñen un tipo de pantalla dividida de cousas
onde eles van che dar exemplo de código.
Pode xogar con el, mudalo, e prema Update,
e que vai amosar o que realmente fai á páxina web.
>> Entón eu recomendo usar isto.
É moi legal.
Non terá fallos seg aquí cando as cousas van mal.
Se conseguir ter un fallo de seguridade con HTML,
deixe-me saber por que eu son será real, intrigado.
Pero é moi legal porque pode cambiar as cousas,
podes velos actualizados en directo.
E eu creo que vai ter un gran comprensión máis intuitiva HTML
se realmente só pasar algún tempo experimentando con el.
É por iso que eu dixen, práctica e experiencia.
>> Google, a partir de agora a fóra, probablemente será
un dos seus mellores recursos e amigos.
Ou Bing-- estou a traballar na Microsoft, entón quizais eu debería dicir Bing.
Pero practicamente calquera cousa é só vai ser sintaxe,
así comprender o que as marcas son, understanding-- polo menos con CSS--
como cambiar certos atributos.
Será super útil.
>> Así, aínda que non ten cousas preparadas,
temos o tipo de algunhas das mellores prácticas que queremos que vostedes para intentar cumprir
por-- ou mellor, que debería respectar ata novo aviso.
Entón pecha todas as súas etiquetas.
Esperemos que todos has-- sabe o que, se isto non ten sentido agora,
Eu prometer que vai ter sentido cando estamos a codificación ata a páxina.
Pero pechar todas as etiquetas.
Entón, se xa ten algún cabeceira que é soporte,
H1, soporte, asegúrese de que sempre que está feito con iso,
pecha a cabeceira.
Validar a súa páxina con W3 comprobador.
Se non pechar as etiquetas, pode obter un comportamento inesperado.
El vai dicir que a súa páxina é válido Se executa-lo través deste validador.
Así, cando en doubt-- e especialmente esta semana e na próxima semana
pset-- do mesmo xeito que se require usa o cheque de 50 e 50 estilo,
Pode pensar niso como un dos seus cheques, OK?
>> Entón, se non pasar o validador W3.
Isto é algo que vai aportar en ti.
Ou eu estou dicindo a vostede ben Agora vou encaixar lo en.
Entón, asegúrese de que valida.
Non é difícil.
Só pegar no seu código e que vai quere dicir bo traballo
ou está perdendo algo do mesmo xeito
ese estilo 50 dille onde está entorpecendo.
>> E entón, unha última cousa é que quere separar
súa cita, que é todo o que o HTML ou o seu texto, e seu estilo.
Entón, imos facer un exemplo de que, logo tras iso.
Entón, HTML e CSS debe ser separado.
E nós imos estar falando MVC, que é Model View Controller,
próxima semana.
Vostedes probablemente debe aprender sobre iso na charla
mañá se tivese xa aprendeu hoxe.
>> E é só unha especie de un paradigma que tendemos
para usar ao crear web páxinas para separar as cousas.
Pode pensar niso do mesmo xeito que temos a tendencia de funcións separadas en C
onde botar para atopar cousas.
É só un xeito de facer a súa vida máis fácil.
El separa a atributos ou código que estaría usando unha e outra vez,
pero esta forma, tipo de mantén-lo agradable e limpo.
E se quere cambiar unha cousa, cambia-lo unha vez
e el cambiou toda a parte.
Por iso é máis para a súa facilidade e flexibilidade.
>> Así, con CSS, é moi similar a HTML, pero no canto de etiquetas
que mencionei hai pouco, nos usar o que se chama selectores.
E basicamente só tipo de asociar un determinado tag
HTML con atributos diferentes.
E cando digo atributos, quero dicir cousas como cor da fonte, estilo da fonte,
a cor do fondo, a cor do seu texto.
Estes tipos de cousas.
Como se está centrado, se é a dereita,
se é inverted-- todo destas cousas legais.
Calquera cousas estilísticas que fai para o seu texto,
iso é o que quero dicir con atributos.
>> E entón, dúas cousas principais a saber é que selectors-- dous dos factors-- principal
son ID, que é único.
Só pode usar isto para unha cousa.
Se non, vai berrar con vostede.
E cando nós define-lo nun arquivo CSS, que vai
ser de hash ID e, a continuación, cales os atributos que queremos.
Eu prometer que imos pasar por un exemplo.
Vai facer moito máis sentido.
>> Clase pode referirse a varios bloques.
Así, pode que o seu primeiro e terceiro parágrafo
teñen o mesmo tipo de atributos se vostede asocia-los coa mesma clase.
E cando nós define-los en CSS, facemos unha clase punto,
coa clase sendo o que quere queres que sexa nomeado.
>> Entón, sei que iso é certo agora moi abstracto.
É por iso que estamos indo ao código.
Sei que vós aman que, e todos vostedes son
me vai axudar, porque esta é a súa páxina web.
Esta é a páxina web da nosa sección, rapaces.
Entón, hai algunha dúbida antes de apagar o PowerPoint, ou algo
Quere que eu rolar cara atrás para antes de comezar a codificación?
>> Audiencia: Cando di que xogo etiquetas, quere dicir selectores ou etiquetas?
ALLISON Buchholtz-AU: Pode consideralos como o mesmo.
É só palabras diferentes.
Quero dicir, como selectores.
Pero selectores tamén o mapa de etiquetas.
Así, pode pensar neles como eficazmente o mesmo.
Eu prometer que vai facer máis sentido cando código.
Calquera cousa, desde o PowerPoint ou dúbidas
agora antes de que realmente crear páxina da nosa sección?
Todos listos?
Legal.
>> Entón, eu teño un iniciado.
Déixeme aumentar a fonte para vós.
OK, entón agora, só temos unha esqueleto páxina web aquí mesmo.
>> Temos un pouco de HTML.
Temos algúns cabeceira, que nós vexa aquí como exemplo de páxina web.
Algúns título, algunha fonte.
Estas son as etiquetas, OK?
Entón, cando quero dicir pechar as súas etiquetas, vemos aquí esta cabeza soporte é a súa apertura
tag, e este soporte / Cabeza é pechalo, OK?
>> Entón pode pensar niso como o dispositivo nas súas condicións se
ou o seu para loops.
Se ten un ao principio, quere un ao final.
É aínda funcionará a maior parte do tempo se non ten unha etiqueta pechada,
pero a mellor práctica é pechar os tags.
>> Polo tanto, neste caso, imos cambiar isto.
Nós imos ter sección sete.
"Sección páxina web."
Entón, eu estou indo só para cambiar isto.
>> E se somos por aquí e nós gotta reload-- gardar e reload--
enténdese que até aquí el cambiou, non?
Legal.
Entón, iso cambia o título.
Isto é todo o que está no seu guía.
>> Polo tanto, este é o tipo de mirando tipo de chat.
Non sei canto a vostedes.
Creo que queremos algo máis aquí.
>> Entón o que podemos facer é o cabeceira é só alí.
Imos facer algún tipo de corpo.
Polo tanto, temos un corpo aquí.
Sempre fago aberto e Peche os tags para comezar,
do mesmo xeito que fago chaves.
Ah.
Espere, o que?
>> Audiencia: [inaudível].
ALLISON Buchholtz-AU: Ah.
Vós me colleu.
Bo traballo.
Estrela do ouro.
>> OK, entón temos un corpo aquí.
E agora imos comezar a engadir texto.
Entón, ten un par distinto opcións para engadir texto.
Temos cousas como cabeceiras.
Temos só o texto normal.
Entón imos comezar cun cabeceira.
De feito, se vostedes queren para puxar arriba HTML da escola W3,
pode tipo de ollar en volta e se hai algo
especialmente que quere probar con esta páxina web, podemos facelo.
Polo tanto, neste caso, imos facer algunha h1.
Entón h1 é como a maior cabeceira.
Que vai che dar algo que é moi grande e en negra.
>> E, neste caso, o que queremos para o primeiro texto na nosa web?
Calquera cousa.
Vostedes están indo para crear esta.
Eu só vou escribir.
Audiencia: Benvido.
>> ALLISON Buchholtz-AU: Benvido.
OK, entón si garda-lo e actualizar, temos un gran benvidos.
Entón, só así pode ver o diferenzas, imos facer algo en H6.
O que queremos aquí?
Non?
>> OK, entón só para que poida vexa a diferenza.
Si, Sublime.
Entón, se notar, h1, moi, moi grande.
h6, como ousada, pero moito menor, e ten todo o demais.
Entón, vostede podería H2, H3, H4.
E estes son só cabeceiras, por iso, se está tentando
para crear unha páxina web que ten seccións diferentes,
pode utilizar usar cabeceiras en algún lugar.
>> Legal.
Entón, imos engadir un pouco máis cousas no noso corpo.
Vexo que sería tipo de legal se tivésemos unha foto.
Eu sinto que todo o mundo podería usar quizais unha imaxe bonito do coello sobre a dereita agora,
entón imos atopar unha imaxe do coelliño de primeira.
>> Non sei se vós ten algunha preferencias sobre as que unha que queremos.
Ten algunha preferencia?
Este aquí?
Down.
Está ben.
Aquel que é.
Boas opcións.
>> OK, entón imos ver a nosa imaxe.
Olle para iso.
Olla que cousa encantador.
Como pode ser triste nunha luns con este?
>> Entón, nós só estamos indo para copiar a URL da imaxe.
E o que queremos facer é, imos só dicir que temos algún p por parágrafo.
Nós imos dicir: "Mira mirar para o coello bonito.
d'awwww ".
Eu amo os meus coellos.
Eu teño un coello na casa.
Eu sinto falta do meu coello.
Entón, o que nós estamos indo a fazer-- Non sei se vostedes queren
ao google isto-- pero con HTML, como pode incluír unha imaxe?
Literalmente, se buscar en Google "Inclúense imaxe HTML"
Por que non me dicir caras o que esta marca debe ser?
>> Audiencia: img source--
>> ALLISON Buchholtz-AU: img source--
Audiencia: --equals--
ALLISON Buchholtz-AU: --equals--
Audiencia: --quote-- si.
ALLISON Buchholtz-AU: Perfecto.
Encantador.
Mira, a xeración MySpace, non?
Audiencia: Neopets.
ALLISON Buchholtz-AU: Neopets.
Oh, Aceptar.
Guau.
Foi unha tolemia.
Está ben.
>> Entón asegúrese de que teño ese dereito.
Legal.
Polo tanto, este debería estar aquí.
E entón, se actualizar, temos a nosa coello na páxina Non é este adorable?
>> Isto é tan bonito.
Escolleu un gran, gran foto.
Estou curto.
>> OK, entón temos este coello encantador agora.
Fomos capaces de engadir un imaxe, só como aquel.
Entón, basicamente, se hai algunha imaxe que quere engadir á súa páxina web,
pode engadir lo como esta.
Outra cousa sería se ten a imaxe almacenada
no mesmo cartafol este ficheiro, pode só
escribir o nome desta imaxe é máis que ter unha ligazón a web.
>> Aínda sería entre comiñas.
Sería só como se tivésemos chamado isto--
Se ese cadro fora salvo no cartafol con este ficheiro HTML
que estou editando e foi chamado bunny.jpg.
Tamén podería facelo e ía aparecer.
Con todo, eu non teño isto gardado en o arquivo e quero manter o coello,
entón imos manter a ligazón.
>> Audiencia: Cal é rabbit.org?
>> ALLISON Buchholtz-AU: rabbit.org.
É unha appropriate-- mira, pode adoptalo lo.
Adopción.
bunny.jpg.
Quero adoptar este coello.
Oh, Deus, é tan bonito.
>> OK, entón nós engadimos cabeceiras.
Nós engadimos unha imaxe.
Obviamente, nós engadimos algún texto aquí, non?
Se desexa engadir outro textos, nós iríamos así.
Polo tanto, este é outro parágrafo.
>> E dicimos "este é outro parágrafo."
Ademais, eu son un corrector ortográfico horrible, para que eu poida escribir mal as cousas.
Só FYI.
>> Entón temos outro parágrafo aquí, non?
Entón, talvez quere facer algo algo máis interesante que
ten todo o que escriba, como aliñado á dereita.
Quizais quere centralizar o texto, OK?
>> Entón, se alguén quere usar os ordenadores accesibles diante de ti
e me diga como está vai centrar este texto,
>> Audiencia: p align.
>> ALLISON Buchholtz-AU: Entón p align é igual a "centro".
Está matándoo, rapaces.
Vostedes teñen intensificar.
E nós temos "Este é centrado."
E agora temos algo centrado.
>> Do mesmo xeito, se quere aliñado á esquerda,
podería facer igual align esquerda, igual align dereita.
Totalmente ata.
Se eu fixen aquí, entón este should-- agora está aliñado á dereita.
>> Audiencia: Allison?
Por fonte de imaxe, por que non é alí preto da fonte img?
ALLISON Buchholtz-AU: Sentímolo.
Este debe ser Hai agora que é bo.
Agora estamos ben.
Audiencia: Non ten para pecha-lo alí, ou non?
ALLISON Buchholtz-AU: Ben, entón img fonte, este é só-- coa imaxe,
el é visto só como un elemento, mentres que se observa ao resto destes,
temos algúns tag entón información que que se refire ao e, a continuación, unha marca de peche.
Pero coa imaxe, todo de só unha especie de auto-contido.
Legal.
Entón, vostedes saben como crear un cabeceira, xa sabe como a entrada de texto,
sabe como poñer unha imaxe agora, pode aliñar as cousas.
>> Outra cousa que Pode querer ser capaz de facer
é crear unha lista de CS-- estamos tipo de entrar en pset da próxima semana.
O material que nós tipicamente ensinar esta semana
vai moi ben con pset da semana que vén, polo que estamos
tipo de mestura, superposición de cousas aquí.
Pero vai ser útil para a próxima semana.
>> Entón, se nós quixemos crear algúns lista, como podemos facelo?
Non pode responder a este tempo.
Alguén ten de.
Non é difícil, xente, prometo.
Google "desordenadas lista HTML."
Que foi iso?
>> Audiencia: [inaudível].
ALLISON Buchholtz-AU: Certo.
Entón, nós queremos ordenada ou desordenada?
Imos facer unha desordenada.
Polo tanto, temos algúns ul, que significa lista non ordenada.
E o que temos para cada elemento?
Será que ela ten da súa propia marca?
Podemos só comezar a escribir cousas?
>> Audiencia: li.
>> ALLISON Buchholtz-AU: li.
Entón, o que está a nosa lista será?
O que queremos aquí?
Nós só facemos nomes.
Só ten que facer o Jacob.
>> Alimentos Coello: audiencia.
>> ALLISON Buchholtz-AU: alimentos Coello.
Aceptar me gusta diso.
Alimentos Coello.
>> OK, entón temos cenorias.
Me gusta deste tema coello.
Estou curto moito.
Audiencia: En realidade, eu penso que Jacob sería un lexítimos.
ALLISON Buchholtz-AU: Jacob?
Jacob é comida de coello.
Se viu Jacob foto do horario de expediente,
pode ter pensado que ten atacado por un coello asasino.
>> Audiencia: Eu teño un coello agora.
Eu teño un coello asasino agora.
>> ALLISON Buchholtz-AU: Está a xogar comigo?
>> Audiencia: Vou traelo próxima sección.
Teño isto.
>> ALLISON Buchholtz-AU: Isto é ridículo.
En fin.
>> Audiencia: [inaudível]
>> Audiencia: Si, miña proctor ten un coello ben.
>> ALLISON Buchholtz-AU: Eu quero un coello.
OK, quen trae un coello real para a seguinte sección, brownie puntos totais.
Audiencia: [inaudível]
Audiencia: Oh, non é real.
É un coello de peluche.
>> ALLISON Buchholtz-AU: Oh si, podemos pechar estes.
Parece rad.
Audiencia: Será que isto realmente importa?
ALLISON Buchholtz-AU: Non fai.
Coa maioría destas cousas, non pechar a etiqueta,
99% do tempo nada de malo está pasando a ocorrer, pero é bo estilo, tamén.
Entón Jacob.
E temos leituga.
Audiencia: Para enlaces, que é realmente importante.
ALLISON Buchholtz-AU: Hm?
Audiencia: Para hiperlinks.
ALLISON Buchholtz-AU: Para hiperlinks.
Si, hyperlinks ter.
OK, entón imos ver aquí.
E temos o seguinte da nosa lista.
E miramos para iso.
Temos tudo-- Jacob, alí mesmo.
Comida de coello.
Lémbrame de Bunnicula.
>> Audiencia: [inaudível]
ALLISON Buchholtz-AU: Estou traendo de volta todas as referencias da vella escola hoxe,
non é?
Só a todas as referencias vella escola.
Debería trae como Iogures ou algo para lanches.
>> Audiencia: Ou Gushers.
ALLISON Buchholtz-AU: Oh.
Está ben.
Vou ver se podo seguir baixo Gushers á seguinte semana.
Creo que podo facelo.
Eu creo que pode ter algúns na oficina.
>> OK, entón nós Cubrimos moi diferente cousas que podes facer co HTML, non?
E como probablemente pode ver, é nothing-- espero, non moi intim--
se é o, eu non quero dicir menosprezar a ninguén.
Se está a ter problemas, por favor, veña falar comigo.
>> Pero a maior parte é só mirando para a sintaxe, non?
Se quere unha lista non ordenada, se quere algún tipo de lista,
se quere aliñar algo ou formato de algo, é todo sobre só
tipo de mirar para arriba o sintaxe para HTML, non?
E unha cousa que é moi legal, en realidade,
é se vai a-- veremos, o que é un bo sitio que nos gusta?
Alguén ten algunha sitios favoritos que son Aceptar para traer en liña?
Vostede sabe o que, imos só facer CS50.
Isto é bo e seguro, non?
>> OK, entón CS50 aquí.
Oh, mire, hai unha sección neste momento.
Se che gusta do xeito que parece.
>> Audiencia: [inaudível].
ALLISON Buchholtz-AU: Non somos fará sección de meta, rapaces.
Isto non está pasando.
Sería legal, pero nós non imos facelo.
>> Entón o que podería facer se lle gusta a forma
isto funciona é que pode sempre certo facer clic en calquera páxina web que lle gusta
e pode facer View Page Source.
Ela ha amosar todo o HTML.
E este é realmente un moi bo xeito de estilizar a súa propia páxina web.
Ir a unha páxina web que Realmente me gusta e mirar para o HTML
e descubrir como eles fixeron iso.
>> E literalmente, sempre como citar cousas,
sempre que non é só roubando de persoas, é OK.
Especialmente para CS50 [? financiar?], estamos
medio que espera que obteña inspiración de outro sitio.
Entón, Sinto-se libre.
Olle a través de sitios que pensas que son realmente moi
e descubrir como eles usan HTML e CSS para facer estas cousas.
>> Entón, como ve aquí, hai, obviamente, como as conexións e que temos unha clase aquí.
Temos unha ligazón aquí.
Temos unha lista.
Nós probablemente ten algún fotos nalgún lugar por aquí.
>> Temos algún estilo legal aquí.
Esta é a seguinte cousa imos facer.
Entón estilo, sempre que ve estes soportes de estilo, é basicamente CSS.
Ben, ten unha pregunta?
>> Audiencia: Cal é div?
>> ALLISON Buchholtz-AU: div é só o que é A-- div?
Audiencia: División.
ALLISON Buchholtz-AU: División.
Si, é como separar elementos diferentes.
OK, entón aquí está o que nós somos indo a ir ao seguinte.
Polo tanto, este pode non ser o mellor estilo, porque se observa
temos HTML e estilo na mesma páxina, e nós realmente queremos separar aqueles,
Ok?
E, de feito, déixeme abrir o meu camiño certo
porque este é suposta ser o PDF, polo que temos style.css.
>> Entón o que podemos facer aquí é estes son cousas legais como algúns de fade
e poderiamos tentar facelo, pero eu sinto como eu faría confusión que en tempo real,
eu encorajo vostedes a vaia tentar iso no seu propio país,
pero eu non vou facer iso agora.
Entón, se vostedes, lembren-se, se nunca bateu conxunto de problemas,
Rusgas en algo de lado.
Ten que ver co fade e a transición e outros enfeites.
>> Audiencia: E iso é todo o CSS e HTML?
>> ALLISON Buchholtz-AU: Todos CSS e HTML.
Si.
Así, pode facer unha chea de realmente cousas legais con CSS e HTML.
Así, coa nosa incrible páxina web coello aquí, nós
imos facer un pouco bit de estilo CSS con el.
>> Entón, se xa ten un estilo folla, o que temos aquí,
pode só chamar style.css.
Pode chamar o que quere.
O que é importante é que nós imos facer referencia a ela na nosa web.html aquí.
>> Entón, o que nós imos facer é nós-- para que eu non faga desorde neste up--
imos conectar estes dous ficheiros xuntos.
Así, do mesmo maneira-- vou para facer unha analoxía coa C aquí.
Do mesmo xeito que se dispón algúns library-- e temos cs50.h--
noso compilador liga-lo.
Este é só un explícito conexión da nosa parte.
Así, do mesmo xeito que nós facemos hash de incluír algún ficheiro, o que
Estou a piques de escribir é só o HTML / CSS equivalente a iso.
>> Estamos só dicindo, OK, esta páxina web vai utilizar este estilo, OK?
Polo tanto, temos enlace rel igual a folla de estilo.
E entón temos tipo, css.
E entón href igual.
>> Está ben.
Entón, todo isto fixo aquí é que pode pense nisto como o mesmo
como un hash incluír.
Obviamente parecer un pouco máis complicada, pero en todos os casos,
é efectivamente o mesmo.
Polo tanto, esta é só unha conexión de un folla de estilo, é do tipo text / css,
eo seu nome é style.css.
>> O que é importante saber é que a páxina web
que eu estou a traballar dereito agora- web.html e style.css-- están na mesma carpeta.
Porque en carpetas diferentes, ten que dar a raíz real
para el é o camiño para el.
Pero, neste caso, estamos mantendo-o super sinxelo e que vai estar aquí.
Entón, se facemos iso, teño algunhas as cousas xa na cola aquí.
>> Polo tanto, temos un corpo, o que está pasando ter a nosa cor de fondo, o que
agora é azul claro.
Podemos cambiar isto se quere, pero se ben me lembra isto correctamente,
debe só muda-lo á luz azul.
E agora temos un fondo azul claro.
E tivemos aqui-- pode alguén recorda cal é o ID de hash ou clase?
>> Audiencia: ID.
>> ALLISON Buchholtz-AU: ID.
Legal.
Entón, o que queremos facer é que estas fontes
ou which-- queremos "Olle o coello bonito "ser vermello?
Creo que queremos que sexa vermello.
Estou moi triste con iso sendo vermello.
>> Entón, o que fai é que fai ID equals-- neste caso
Eu dixo, o que, moi cor aquí.
Nós actualizar.
De súpeto, el é vermello.
OK, entón con ID, lembre-se necesita ser único,
entón eu nunca debe estar usando este ID en calquera outro lugar.
Pero, con clase, como temos aquí cunha fonte fermosa,
Eu debería ser capaz de usar que en calquera lugar que quero.
>> Entón imos facer este aquí.
Así, podemos dicir clase é igual a fonte fermosa.
E se miramos agora temos este tipo de letra moi legal aquí.
Entón, talvez quero facer ambos.
OK, eu realmente non sei se isto é indo para o traballo, pero quero probar.
E é así que aprender CSS e HTML.
Vostede é como, xa sabe o que, quero tentar iso.
Eu non estou seguro se vai funcionar.
A ver se funciona.
>> E mira que iso.
Agora é de púrpura e é un tipo de letra fermosa.
OK, entón tes todo isto cousas distintas que podes facer.
Ten unha pregunta?
>> Audiencia: Yeah.
Ben, así como as cores está a usar son palabras.
Existe unha forma de facer cores coa RGB hexadecimal?
ALLISON Buchholtz-AU: Tamén pode facelo con hexadecimal, eu creo.
Si.
Pero é ben legal se Non quero buscalos.
Pode ser como, vermello ou azul.
Audiencia: Imos esperar que sabe o que iso significa.
ALLISON Buchholtz-AU: Certo.
Entón, imos facer esa lectura ou Chartreuse.
Por que nunca escoller Chartreuse?
É unha cor interesante.
>> OK, entón, obviamente, podemos ver que pode cambiar as cousas con todo que queremos.
Se quixese create-- digamos queriamos crear outra clase.
Que vostedes pode querer cambiar?
Se puxar arriba W3Schools ' Documentación CSS,
Deixo a palabra a vós.
Podemos tratar de facer algo legal con este no último par de minutos.
Porque eu teño o tipo de dato-lle unha Crash Course en unha morea de cousas legais
que podes facer.
Pero, ao final, como dixen, se só experiencia, vai aprender moito.
>> Audiencia: Quixo buscar esa fonte?
>> ALLISON Buchholtz-AU: Si, Eu olhei para esta letra.
Así como, literalmente, eu fun a-- o que eu fixen?
Eu fixen lista de fontes CSS, e entón eu fixen pila fonte,
e entón eu era como, mira, aquí son todas as fontes legais que podes facer.
E había un regalo, entón Copia-o para a miña prancheta.
E entón eu era como, OK, legal, alí imos nós.
Todo feito.
>> Audiencia: Entón tes que ter seguro CSS que sabe o que é fonte.
>> ALLISON Buchholtz-AU: Si.
>> Audiencia: O que di ao final?
Cursive?
>> ALLISON Buchholtz-AU: Cursive.
Si.
>> Audiencia: Imaxe de fondo.
>> ALLISON Buchholtz-AU: Imaxe de fondo.
Está ben.
Entón quere me dicir como facelo.
Deixo isto para vostede.
Eu só estou escribindo aquí agora.
A roda está nas súas mans.
>> Audiencia: OK
>> ALLISON Buchholtz-AU: Aceptar.
O que estou facendo?
>> Audiencia: Doing-- Eu sei que vén despois da chaveta.
ALLISON Buchholtz-AU: Aceptar.
Entón, probablemente no corpo, eu asumiría, porque estamos
facendo a imaxe de fondo.
>> Audiencia: Si, imos facelo.
>> ALLISON Buchholtz-AU: Aceptar.
Audiencia: OK, entón fondo colon, e entón nós
precisa dun enderezo URL desa imaxe.
Quizais pseudo-código que, polo momento, quizais.
>> ALLISON Buchholtz-AU: Qué lle gustaría que eu a--
Audiencia: Estou pensando como un GIF.
ALLISON Buchholtz-AU: A GIF?
Isto vai ser interesante.
OK, o que estou buscando aquí?
>> Audiencia: Non, esa é a súa elección.
>> ALLISON Buchholtz-AU: Por non nós-- se é un coello,
Eu sinto que nós deberiamos ter un gramos bo ou algo así.
>> Audiencia: Prado.
Un prado.
>> ALLISON Buchholtz-AU: Un prado?
Está ben.
Audiencia: Ou Rachel Maddow.
ALLISON Buchholtz-AU: Este parece bonito.
Oh, iso é minúscula, porén.
Necesitamos unha imaxe en tamaño bo.
Imos ver.
Oh, mire.
Isto é un prado bonito.
Vostede sabe o que, eu gusto de un regalo.
Imos copiar este.
>> Audiencia: OK, entón eu creo que é o URL, parénteses abertos.
>> ALLISON Buchholtz-AU: OK, URL.
>> Audiencia: Entón o enderezo.
>> ALLISON Buchholtz-AU: Aceptar.
É todo o que necesitamos?
>> Audiencia: Close parénteses punto e coma, e logo, o espazo de fondo guión
dous puntos de fixación fixo, e chaveta.
>> ALLISON Buchholtz-AU: Aceptar.
A ver se isto funciona.
Vai ser moi legal se isto acontecer.
Estou moi animado aquí.
Non funcionou.
Eu me pregunta por que.
Audiencia: Quizais a URL ten que ser en citas.
ALLISON Buchholtz-AU: Quizais.
E é así que aprendemos, rapaces.
>> Audiencia: Podemos ter fondo imaxe de fondo e cor?
>> Audiencia: Non.
Un substitúe outro.
>> ALLISON Buchholtz-AU: Non o sei.
Imos ver.
Imos dar un ollo e ver.
>> Audiencia: Oh, se cadra, si.
[Interpoñendo voces]
>> ALLISON Buchholtz-AU: OK, este é obviously-- I [inaudível] aquí.
Entón Aceptar.
Audiencia: attachment fondo.
ALLISON Buchholtz-AU: Ah.
>> Audiencia: OK, eu non sei.
ALLISON Buchholtz-AU: É mira como debe funcionar.
Está seguro de que é dous puntos tras a URL?
>> Audiencia: Non, é punto e coma.
ALLISON Buchholtz-AU: É punto e coma.
Audiencia: Eu dixen colonos?
ALLISON Buchholtz-AU: Vostede dixo comas.
Audiencia: Oh, non.
ALLISON Buchholtz-AU: Alí vai vostede.
Audiencia: Oh, espera, agora Non podemos ler o texto.
ALLISON Buchholtz-AU: Agora non pode ler o texto,
pero temos a imaxe de fondo.
Mmhmm?
>> Audiencia: O HTML apoiar contido dinámico?
Tipo, pode cambiar o tamaño da imaxe dependendo do tamaño da fiestra,
ou iso é un CSS--
>> ALLISON Buchholtz-AU: Entón CSS ten que facelo.
Entón, se vostedes están interesados en aprender CSS avanzado,
Eu son co-ensinar unha seminario sobre CSS no 7º.
E eu prometer que vai ser moito máis en profundidade
e facer moito máis legal cousas nesta sección.
E o meu co-profesor é como mestre total de dev web front-end.
Entón vai ser moi legal se quere para aprender sobre todas as cousas legais
que CSS pode facer.
>> Pero o que temos aquí con seu apego fondo
fixed-- polo que é algún size-- fixo pero realmente pode dynamically--
se xa viu páxinas web, como A maioría das boas páxinas web vai facer,
cando axustar o tamaño do seu navegador,
axusta o fondo ou como está amosando ou reflexa as cousas, non?
Entón, iso é o que chamamos posicionamento relativo.
>> E CSS realmente incorporarse o quão grande o seu ancho do navegador é ou como alto é,
e pode situar as cousas segundo os tamaños relativos
contra tamaños absolutos.
E iso é, obviamente, máis avanzado CSS, pero iso é algo que podes facer.
Se queres aprender máis, veña ao meu seminario.
>> Entón, iso é algo que podes facer.
E CSS pode, en realidade, fazer-- CSS e JavaScript,
que nós imos chegar o próximo week-- pode permitir que cambiar dinamicamente
páxinas sen ter que recargar los o tempo.
E comeza a facer algunha cousas moi legal.
>> Entón, hai outra cousa que vostedes pode querer facer
ou calquera cousa que quere explotar?
Temos 10 minutos restantes.
Tamén pode saír máis cedo, pero se quere facer máis algunhas cousas na web,
pudermos, pero eu non son vai forzalo a.
Pero tamén podemos só comer doces.
Audiencia: Centrado o texto branco para que poida lelo.
ALLISON Buchholtz-AU: Aceptar.
Polo tanto, neste caso, queremos algún p.
Audiencia: Debemos facelo no corpo para que se aplica a toda a páxina?
ALLISON Buchholtz-AU: Si, podemos, en realidade.
Esa é unha boa idea.
Entón, nós have-- ti sabemos o que debe ser?
Non sei se podemos facer a cor do texto.
Eu estaba indo a tentar crear outra clase aquí.
>> Audiencia: Como obteña que ten as suxestións?
ALLISON Buchholtz-AU: Entón se vostedes están interesados,
este é outro texto editor chamado Sublime.
Ten que ser capaz de instala-lo no seu dispositivo.
Ás veces está un pouco complicado.
Se quere axudar con iso, Estou super feliz en axudar
con iso, porque gedit é grande e é incrible, porque pode compilalo lo
na parte inferior, pero realmente como Sublime porque é bonito
e fai cousas como auto-completa.
>> Entón definitivamente pode sentirse libre para deixe-me saber se quere facelo.
Se só google "Sublime texto ", el normalmente
ten instrucións sobre como instalar en varios sistemas operativos.
É moi legal, eu creo que, na miña opinión.
Entón, p.
Eu creo que eu só podo facer texto-- ou podemos só facer a cor é "branco".
Alí.
>> Entón o que eu fixen aquí é que eu non cambiar todo o texto.
Pero p aquí é só un tag que temos, non?
Esta marca de parágrafo.
Entón, eu só creou un elemento CSS que dixo, OK, calquera cousa con esta etiqueta
p, facer a cor branca.
>> Entón, se entendeu, fixo este branco e ese baleiro.
Non fixo nosa lista branca porque non está asociada a iso.
Podería pasar e puido dicir:
>> Audiencia: Fai cor de fondo.
>> ALLISON Buchholtz-AU: Cor do fondo?
>> Audiencia: Fondo de tubo en cor onde se pon a etiqueta p.
>> ALLISON Buchholtz-AU: Aceptar.
Queres que branco?
Audiencia: Mmhmm.
ALLISON Buchholtz-AU: Aceptar.
Alí vai.
Audiencia: Isto é raro.
ALLISON Buchholtz-AU: Moi legal, non?
Entón, se acaba de xogar, vai aprender moito.
E iso pode ser moi legal.
Creo que é sempre máis gratificante do que, por veces,
porque non ten que esperar para o seu programa para compilar.
Pode só bater Actualizar e vostede é como, oh, mira,
traballou, ou oh, eu son probablemente falta algo.
E iso é algo que é realmente legal sobre iso a próxima parte da clase,
é que é sempre, eu pensar, máis fácil de comprobar
que vaia ao longo do camiño contra ter que escribir estes programas longos
e desexando e rezando que funciona ao final.
>> Entón, con iso, eu creo que Vostedes todos parecen bos.
Se tes algunha preguntas, como sempre, vir falar comigo, veña me aviso.
Eu estarei ben fóra para os próximos 15 minutos
se quere falar sobre todo e calquera cousa.
>> Entón, eu espero que guys-- boa sorte con este pset.
O prazo é venres ao mediodía porque foi lanzado ao final.
Entón eu probablemente será visto unha morea de vostedes o xoves,
pero espero que non.
Quizais vai telo feito ata entón.
Eu sería super orgulloso.
>> Pero se non, eu vou te ver xoves.
Tamén pode usar unha data final, que estende ata sábado ao mediodía.
Pero eu don't-- hein?
>> Audiencia: Día das meiga.
>> ALLISON Buchholtz-AU: É o Día das meiga, a, e b,
Non creo que haberá ser o horario de expediente na venres.
Entón realmente tentar facelo por Venres para que todos poidamos celebrar
Fin de semana Hallow.
Todo ben, eu vou ver vostedes a próxima semana.