Your SlideShare is downloading. ×
Developer day   2010 - html-css
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Developer day 2010 - html-css

416
views

Published on


0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
416
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
6
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Introdução a HTML/CSS
    Marcos Roberto Ferreira
    marcos.wp@gmail.com
    @marcoooos
  • 2. BRAVA ECM
    Empresa especialista na distribuição e prestação de serviços em soluções de GED/CM, Workflow/BPM, Qualidade e Portais, que conta com a credibilidade de ser uma empresa com o selo TOTVS Business Partner.
    10 anos de atuação no mercado
    + de 1.000 projetos entregues
    + de 1.000.000 horas
    aplicadas em projetos
    Equipe certificada e
    altamente qualificada para atendimento em toda a América Latina
  • 3. Programação
    O que é HTML
    Como escrever HTML
    Principais tags
    Tags importantes
    Algumas tags conhecidas
    CSS
    3
  • 4. O que é HTML?
    4
  • 5. HyperTextMarkup Language
    5
  • 6. Linguagem de Marcação
    “Quem aqui nunca utilizou linguagem de marcação, não é?”
    6
  • 7. E Hypertexto?
    7
  • 8. Nelson não gostava de texto...
    8
  • 9. Ele queria algo não sequêncial
    9
  • 10. E com imagens!
    10
  • 11. HyperTexto
    11
  • 12. HyperTexto
    Tem um texto aqui!!!!
    12
  • 13. HyperTexto
    Tem um texto aqui!!!!
    Tem um link aqui!!!!
    13
  • 14. Como escrever HTML?
    14
  • 15. 15
  • 16. tagse atributos
    16
  • 17. atributo
    tag
    <a href=“algo.html”>
    Isto é um link
    </a>
    17
  • 18. 18
  • 19. Pricipaistags
    19
  • 20. Tudo começa com a tag <html>
    20
  • 21. Assim como nós HTML possui um <head> e um <body>
    <head>
    </head>
    <body>
    </body>
    21
  • 22. <head> e <body>
    22
  • 23. E não ter um deles também faz falta!
    23
  • 24. Outras tags importantes
    24
  • 25. <title>
    </title>
    25
  • 26. <title>
    26
  • 27. Headings
    <h1>
    <h2>
    </h1>
    </h2>
    <h3>
    </h3>
    27
  • 28. <h1>, <h2>, <h3>
    28
  • 29. Parágrafo
    <p>
    </p>
    <p>
    </p>
    29
  • 30. <p>
    30
  • 31. Links
    <a>
    </a>
    31
  • 32. <a>
    32
  • 33. Imagens
    <img>
    </img>
    33
  • 34. <img>
    34
  • 35. Tabelas
    <table>
    </table>
    35
  • 36. Tabelas
    <table>
    <tr>
    </tr>
    </table>
    36
  • 37. Tabelas
    <table>
    <tr>
    </tr>
    <td>
    </td>
    </table>
    37
  • 38. <table>
    38
  • 39. Forms
    <form>
    </form>
    39
  • 40. Forms
    <form>
    <input type=“text”/>
    </form>
    40
  • 41. Forms
    <form>
    <input type=“text”/>
    <input type=“radio” name=“campo” value=“1”>
    <input type=“radio” name=“campo” value=“2”>
    </form>
    41
  • 42. Forms
    <form>
    <input type=“text”/>
    <select>
    <option>
    </option>
    </select>
    </form>
    42
  • 43. <form>
    43
  • 44. <form>
    <input id="nome" name="nome" type="text" />
    <input name="casado" id="casado" type="checkbox">
    <input name="sexo" id="sexoM" value="M" type="radio">
    <input name="sexo" id="sexoF" value=“F" type="radio">
    <select>
    <option>Ensino médio</option>
    <option>Ensino superior</option>
    <option>Pós-graduado</option>
    </select>
    44
  • 45. Outras tags conhecidas
    <div/> define uma divisão ou seção
    <br/> pula uma linha
    <button/> cria um botão
    <textarea/>cria uma área de texto
    45
  • 46. CSS
    Cascade Style Sheet
    46
  • 47. 47
  • 48. Declaração de um estilo
    48
  • 49. Declaração CSS – Arquivo externo
    49
  • 50. Declaração CSS – Declaração interna
    50
  • 51. Declaração CSS – Em linha
    51
  • 52. Exemplo com CSS
    52
  • 53. Exemplo com CSS
    53
  • 54. Referências
    http://webdesignledger.com/tips/the-most-common-html-and-css-mistakes-to-avoid
    http://www.w3schools.com/html/default.asp
    http://www.w3schools.com/css/default.asp
    http://piadasdaleloca.blogspot.com/2009/09/entendendo-html-em-outras-palavras.html
    http://pt.wikipedia.org/wiki/HTML
    http://pt.wikipedia.org/wiki/Hipertexto
    54
  • 55. QUESTÕES?
    bravaecm@totvs.com.br