Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

HTML & CSS Masterclass

10 795 vues

Publié le

Masterclass about HTML and CSS, including the new HTML5 structure elements. Great for beginners.

Publié dans : Design
  • Login to see the comments

HTML & CSS Masterclass

  1. 1. <HTML> <.CSS> Masterclass 21 November
  2. 2. What’s HTML and CSS?
  3. 3. <HTML> <.CSS> Content Style
  4. 4. HTMLIt’s all about the tags
  5. 5. Element
  6. 6. Element Attribute
  7. 7. Element Content Attribute
  8. 8. HTMLAn example
  9. 9. Structure firstWhat’s inside an HTML document?
  10. 10. <HTML> The container
  11. 11. <HEAD> The setup
  12. 12. <BODY> The content
  13. 13. Writing the content
  14. 14. Block or Inline
  15. 15. BlockInline
  16. 16. BlockCreate a new line and occupy full width
  17. 17. InlineKeep the flow of the document
  18. 18. Usually work in pairs
  19. 19. Most Important Elements You’ll use these 90% of the time
  20. 20. <DIV>The all-mighty block element
  21. 21. <SPAN>The inline <div>
  22. 22. <P>Paragraph is for text
  23. 23. <H1>Headings from H1 to H6
  24. 24. <A>Link to other pages or sections
  25. 25. But use them wisely
  26. 26. HTML is semantic
  27. 27. Tags have meanings
  28. 28. Don’t suffer from divitis
  29. 29. Start with the structure
  30. 30. Hello HTML5!
  31. 31. <HEADER>Header for a document or section
  32. 32. <NAV>The new navigation menu
  33. 33. <SECTION> The new <div>
  34. 34. <ARTICLE>Blog posts, news stories, comments
  35. 35. <ASIDE>Related, but not really important content
  36. 36. <FOOTER>Footer for a document or section
  37. 37. A real example
  38. 38. <header>
  39. 39. <nav>
  40. 40. <section>
  41. 41. <article>
  42. 42. <footer>
  43. 43. HTML resources
  44. 44. Let’s start styling!
  45. 45. Add the CSS to the page
  46. 46. SelectorsSelect element to style
  47. 47. TagClass ID
  48. 48. Tag Class ID
  49. 49. You can be very specific
  50. 50. Be careful with the space
  51. 51. PropertiesWhat do you want to change?
  52. 52. ValuesDetermine the behaviour of the property
  53. 53. Browsers have custom styling
  54. 54. And custom properties
  55. 55. The box-model
  56. 56. CSS can change everything
  57. 57. CSS3 is awesome
  58. 58. But Keep It Simple!
  59. 59. You don’t even need to work
  60. 60. There are tons of CSS frameworks
  61. 61. Keep learning
  62. 62. Questions?
  63. 63. Thank you! @braposobernardo@connectcoimbra.com

×