1. Aula 03HTML/CSS Gilson Paulino07/02/2012 gilsonbp@gmail.com / 82 9973-9868

2. Uma vida sem desafios no vale a pena ser vivida.(Scrates) 3. O que HTML? Sintaxe bsica do HTML Tags mais usadas Tabelas Listas Divs Span O que CSS? Sintaxe bsica do CSS Classes Alinhamentos Efeitos em links e textos Estilos de fontes e tabelas

4. HTML (abreviao para a expresso inglesaHyperText Markup Language, que significaLinguagem de Marcao de Hipertexto) uma linguagem de marcao utilizada paraproduzir pginas na Web. DocumentosHTML podem ser interpretados pornavegadores.Fonte: Wikipdia 5. uma linguagem de programao utilizada para criar pginas WWW World Wide Web; Osdocumentos HTML podem ser criados usando qualquer editor de texto; uma linguagem esttica e limitada na criatividade; uma linguagem simples e rpida de implementar; 6. Tags: Tags so rtulos usados para informar ao navegador como deve ser apresentado o website. Todas as tags tm o mesmo formato: comeam com um sinal de menor "". Ex: Este texto deve ser em negrito. Uma Tag formada por comandos, atributos e valores.Os atributos modificam os resultados padres doscomandos e os valores caracterizam essa mudana. Exemplo: 7. Exemplode pgina HTML:No bloco de notasNo navegado 8. Listas de tags: Neste link tem uma lista extensa de tags HTML: http://www.criarsite.net.br/tags-html.html Destaco apenas as que iremos usar bastante junto ao CSS: ; ;

; ; ;

• . 9. Usada para criar tabelas: 10. Usado para criar formulrios: 11. Usado para criar formataes em blocos especficos do cdigo fonte: 12. Usandopara efetuar formataes especficas em blocos de cdigos: 13. Usadospara fazer listas simples e listas ordenadas: 14. Cascading Style Sheets (ou simplesmenteCSS) uma linguagem de estilo utilizadapara definir a apresentao de documentosescritos em uma linguagem de marcao,como HTML ou XML. Seu principal benefcio prover a separao entre o formato e ocontedo de um documento.Fonte: Wikipdia 15. Uma regra CSS uma declarao que segueuma sintaxe prpria e que define como seraplicado estilo a um ou mais elementos HTML.Um conjunto de regras CSS formam uma Folhade Estilos. Uma regra CSS, na sua forma maiselementar, compe-se de trs partes: umseletor, uma propriedade e um valor e tem asintaxe conforme mostrado abaixo:seletor { propriedade: valor; } 16. Seletor: genericamente, oelemento HTML identificado por sua tag, oupor uma classe, ou por uma ID, ou etc., epara o qual a regra ser vlida (porexemplo:

,

, ,.minhaclasse,etc...); 17. Propriedade: o atributo doelemento HTML ao qual ser aplicada aregra (por exemplo:font, color, background, etc...).Valor: a caracterstica especfica a serassumida pela propriedade (por exemplo:letra tipo arial, cor azul, fundo verde, etc...) 18. Mas voc no est restrito somente aos elementos HTML (tags)para aplicar regras de estilo.Voc pode "inventar" um nome e com ele criar uma classe aqual definir as regras CSS. E o mais interessante das classes, que elas podem ser aplicadas a qualquer elemento HTML. Emais ainda, voc pode aplicar estilos diferentes para o mesmotipo de elemento do HTML, usando classes diferentes para cadaum deles.A sintaxe para o seletor classe mostrada a seguir.Elemento HTML mais um nome qualquer que voc "inventa"precedido de . (ponto):elemento.minhaclasse { propriedade: valor; } 19. O seletor ID difere do seletor classe, por ser NICO. Umseletor ID de determinado nome s pode ser aplicado aUM e somente UM elemento HTML dentro dodocumento.Voc pode "inventar" um nome e com ele criar um ID aoqual definir as regras CSS. Um determinado ID spode ser aplicado a UM elemento HTML.A sintaxe para o seletor ID mostrada a seguir. Umnome qualquer que voc "inventa" precedido do sinal # :#meuID { propriedade: valor;} 20. Existemvrias formas de integrar o CSS a um fonte HTML, usaremos duas delas: Incorporada; Externa. 21. Incorporada: Folha de estilo incorporada uma folha de estiloanexada a um s documento HTML. As regras deestilo so vlidas to somente para aquele documentoespecfico. A folha de estilo especificada dentro daseo headdo documento e declarada como contedoda tag 22. Externa: Folha de estilo externa um arquivo que pode ser gerado emqualquer editor de texto, e salvo com extenso.css, contendoregras de estilo e que pode ser lincado a um ou vriosdocumentos HTML. Esta sem dvida a maneira mais eficazpara se formatar todo um site, bem como mudar sua aparnciaparcial ou globalmente, pois a simples edio de um s arquivofar o efeito. O arquivo linkado ao documento HTML com uso datag colocada dentro da seo head do documento. Osarquivos que contm as regras de estilo ou seja a folha de estilosdevem ter a extenso .css : 23. Formatando texto: 24. Div: 25. http://maujor.com 26. Criando um projeto PHP no Netbeans:Aps abrir o Netbeans,clique no menu Arquivoe em Novo Projeto. 27. Najanela Novo Projeto selecione a opo Aplicativo PHP e clique em Prximo>: 28. D um nome ao projeto:Devemos atentar parapasta onde sero gravadosos cdigos-fonte, verso doPHP e codificao. 29. Configurandoo servidor de teste:Em Executar comoselecione Site da WebLocal.Em URL do projeto digiteapenas http://cursodephp. 30. No usaremos nenhum framework: 31. Hospedagem virtual, do ingls Virtualhosting, um mtodo que osservidores, tais como servidoresweb, utilizam para hospedar mais de umnome de domnio em um mesmocomputador, algumas vezes no mesmoendereo IP. 32. No Windows precisamos alterar o arquivo C:WindowsSystem32driversetchosts Adicione um alias para o nosso projeto. 33. Configurandoo Apache: Abra o arquivo D:xamppapacheconfextrahttpd-vhosts.conf.Copie o blocomodelo e altereconforme omodelo asnecessidades doprojeto. 34. necessrio reiniciar o Apache: 35. Acesseo projeto no navegador usando o alias http://cursodephp:A pgina est em branco, nosso projeto ainda est vazio. 36. Criauma pgina Currculo; Usar tabelas e formataes com CSS; Hospedar a pgina Currculo no site dehospedagens gratuitas: http://www.hdfree.com.br