Этот материал находится в платной подписке. Оформи премиум подписку и смотри или слушай Foundation HTML, CSS + Javascript, а также все другие курсы, прямо сейчас!
Премиум
  • Урок 1. 00:14:19
    What is the World Wide Web?
  • Урок 2. 00:02:32
    What is SuperHi?
  • Урок 3. 00:16:25
    Writing our first HTML
  • Урок 4. 00:07:42
    Writing our first CSS
  • Урок 5. 00:10:37
    Sally Hart Photography Part 1
  • Урок 6. 00:16:00
    Sally Hart Photography Part 2
  • Урок 7. 00:04:45
    Sally Hart Photography Part 3
  • Урок 8. 00:18:12
    Sally Hart Photography Part 4
  • Урок 9. 00:15:58
    Overview and initial HTML
  • Урок 10. 00:29:29
    Padding, margins and the box model
  • Урок 11. 00:30:22
    Blockquotes and borders
  • Урок 12. 00:12:19
    Navigation hovers and max widths
  • Урок 13. 00:27:14
    Making our website responsive
  • Урок 14. 00:06:49
    Project overview and initial HTML
  • Урок 15. 00:08:20
    Header and hero section HTML
  • Урок 16. 00:17:19
    Getting content into columns using CSS floats
  • Урок 17. 00:15:44
    Using background-position and vertically centering text
  • Урок 18. 00:04:42
    Multiple columns using fluid percentage widths
  • Урок 19. 00:10:05
    Remaining HTML and a quick look at symbols
  • Урок 20. 00:09:26
    Styling up quotes sections
  • Урок 21. 00:04:10
    Rounding corners using border-radius
  • Урок 22. 00:11:48
    Sharing CSS classes between elements
  • Урок 23. 00:03:44
    Figuring out responsive breakpoints
  • Урок 24. 00:08:05
    Removing floats and responsive styles
  • Урок 25. 00:05:45
    Responsive styles and hiding elements
  • Урок 26. 00:14:17
    Adding multiple media queries and fine tuning
  • Урок 27. 00:04:48
    Styling specific elements using nth-child
  • Урок 28. 00:12:22
    Fixing the header and using drop shadows
  • Урок 29. 00:06:39
    Using the Chrome developer tools to inspect websites
  • Урок 30. 00:02:13
    Project overview
  • Урок 31. 00:03:42
    Initial HTML
  • Урок 32. 00:12:18
    HTML continued and initial CSS
  • Урок 33. 00:04:56
    Header position and active link style
  • Урок 34. 00:11:08
    Introducing inline-block elements
  • Урок 35. 00:05:04
    Varied element widths using classes
  • Урок 36. 00:06:57
    Footer styles
  • Урок 37. 00:07:24
    Header styles using flexbox
  • Урок 38. 00:03:41
    Photo grid styles using flexbox
  • Урок 39. 00:11:00
    Positioning elements using absolute position
  • Урок 40. 00:07:22
    Changing element and color opacity
  • Урок 41. 00:04:18
    Offset absolute position using negative values
  • Урок 42. 00:04:36
    Smoothly transitioning CSS properties
  • Урок 43. 00:09:15
    Changing element layer order using z-index
  • Урок 44. 00:02:39
    Responsive tweaks using flexbox
  • Урок 45. 00:05:41
    Hover transitions for navigation links
  • Урок 46. 00:03:56
    Adding character to transitions using timings
  • Урок 47. 00:04:56
    Grayscale image transitions using CSS filters
  • Урок 48. 00:04:39
    Adding the list view page and initial HTML
  • Урок 49. 00:03:58
    List view hover effect image styles
  • Урок 50. 00:05:00
    Adding list separators using CSS content
  • Урок 51. 00:06:57
    List image hover effect using transitions
  • Урок 52. 00:02:28
    Project overview
  • Урок 53. 00:07:45
    HTML structure using outer and inner containers
  • Урок 54. 00:12:03
    Initial CSS and using 2x assets
  • Урок 55. 00:10:51
    Hero background positioning and copy column
  • Урок 56. 00:04:05
    Final navigation and products HTML
  • Урок 57. 00:08:53
    Navigation and products style using flexbox
  • Урок 58. 00:10:26
    Adding product overlay initial HTML and CSS
  • Урок 59. 00:04:12
    Positioning the overlay using absolutes and rgba
  • Урок 60. 00:06:15
    More playful hover effects using transition timings
  • Урок 61. 00:06:19
    Initial breakpoint for tablet layout
  • Урок 62. 00:06:37
    Responsive styles for tablet to mobile
  • Урок 63. 00:02:19
    Mobile responsive styles
  • Урок 64. 00:03:04
    Adding show filters link
  • Урок 65. 00:05:08
    Using unordered list elements to style up the filters
  • Урок 66. 00:01:29
    Final filter list style tweaks
  • Урок 67. 00:03:26
    What is Javascript and jQuery?
  • Урок 68. 00:12:22
    What types of data do we have in Javascript?
  • Урок 69. 00:03:47
    Using the Chrome Javascript console
  • Урок 70. 00:03:43
    Attaching our Javascript files to the page
  • Урок 71. 00:06:42
    Showing and hiding content on the click event
  • Урок 72. 00:08:32
    Building a navigation toggle using jQuery
  • Урок 73. 00:05:22
    Getting attributes and using variables
  • Урок 74. 00:04:04
    Using the this keyword in Javascript
  • Урок 75. 00:05:42
    Filtering the products selection using jQuery
  • Урок 76. 00:04:46
    Adding and removing the active link style
  • Урок 77. 00:03:13
    Overriding CSS styles using !important
  • Урок 78. 00:01:26
    Project overview
  • Урок 79. 00:05:37
    A quick look at the head and body tags
  • Урок 80. 00:04:29
    Initial HTML
  • Урок 81. 00:05:16
    Header and navigation slideout styles
  • Урок 82. 00:07:53
    Vertically aligning navigation using transforms
  • Урок 83. 00:08:07
    Overlaid offset text effect using absolutes
  • Урок 84. 00:02:35
    HTML finishing touches
  • Урок 85. 00:04:03
    Offset text overlay continued
  • Урок 86. 00:03:12
    Final lookbook section CSS
  • Урок 87. 00:05:53
    Silky smooth rotate and scale transforms
  • Урок 88. 00:04:37
    Using translate, scale and multiple transitions on an element
  • Урок 89. 00:04:36
    Hamburger icon positioning and z-index
  • Урок 90. 00:06:03
    Toggling CSS classes and states using jQuery
  • Урок 91. 00:02:03
    Project overview
  • Урок 92. 00:01:41
    Project setup
  • Урок 93. 00:12:18
    Building a scroll function that counts the pixels to top
  • Урок 94. 00:05:30
    Hiding and showing the header on scroll
  • Урок 95. 00:10:05
    Setting the background color on scroll using extended if/else statements
  • Урок 96. 00:03:50
    Progress bar HTML and CSS
  • Урок 97. 00:03:42
    Setting the bar CSS using jQuery
  • Урок 98. 00:08:19
    Figuring out how far down the page we have scrolled
  • Урок 99. 00:03:09
    Setting the bar width dynamically
  • Урок 100. 00:01:22
    Project overview
  • Урок 101. 00:03:44
    Project setup
  • Урок 102. 00:04:05
    Modal overlay CSS
  • Урок 103. 00:02:58
    Increasing clickable area and changing cursors
  • Урок 104. 00:03:45
    Positioning modal content in the center
  • Урок 105. 00:02:29
    Hiding the modal and adding script tags
  • Урок 106. 00:05:21
    Showing our modal on click and blocking default link action
  • Урок 107. 00:03:47
    Closing our modal using a separate function
  • Урок 108. 00:06:44
    Getting and setting HTML and using the this keyword
  • Урок 109. 00:03:46
    Using variables for setting the HTML
  • Урок 110. 00:07:43
    Making the design responsive
  • Урок 111. 00:01:33
    Project overview
  • Урок 112. 00:06:59
    HTML structure
  • Урок 113. 00:06:07
    A look at the CSS
  • Урок 114. 00:03:06
    What does overflow do?
  • Урок 115. 00:07:16
    Initial transition using interval functions
  • Урок 116. 00:02:47
    A little bit about arrays in Javascript
  • Урок 117. 00:09:00
    Moving to the next slide dynamically
  • Урок 118. 00:08:18
    Putting the slide functionality into separate functions
  • Урок 119. 00:04:04
    Finding how many slides we have using .length
  • Урок 120. 00:04:55
    Wiring up the prev/next buttons and cancelling intervals
  • Урок 121. 00:05:04
    Setting the text for our current slide
  • Урок 122. 00:06:25
    Making the slideshow loop through
  • Урок 123. 00:05:45
    Passing data to functions using arguments
  • Урок 124. 00:04:39
    Creating a function for moving the slide
  • Урок 125. 00:08:11
    Making the arrow keys work for navigation