Этот материал находится в платной подписке. Оформи премиум подписку и смотри или слушай CSS Demystified: Start writing CSS with confidence, а также все другие курсы, прямо сейчас!
Премиум
  • Урок 1. 00:05:24
    Welcome to CSS Demystified!
  • Урок 2. 00:03:16
    My software and extensions
  • Урок 3. 00:12:56
    The Discord Community
  • Урок 4. 00:03:10
    The rules!
  • Урок 5. 00:02:37
    CSS Anatomy/Terminology - So we can all be speaking the same language
  • Урок 6. 00:01:37
    Why is CSS so weird? An introduction
  • Урок 7. 00:10:25
    Why is CSS so weird? A follow-up
  • Урок 8. 00:03:40
    CSS is all about relationships
  • Урок 9. 00:07:08
    Introduction to the Overlooked Fundamentals
  • Урок 10. 00:06:06
    The box model and box-sizing
  • Урок 11. 00:02:26
    What happens when we don't set a width?
  • Урок 12. 00:03:25
    What happens when we set a width
  • Урок 13. 00:01:59
    Adding box-sizing
  • Урок 14. 00:02:44
    Fixing a layout
  • Урок 15. 00:04:43
    A quick word on setting heights
  • Урок 16. 00:05:59
    Inheritance
  • Урок 17. 00:04:51
    A quick look at inheritance in action
  • Урок 18. 00:01:25
    A little project
  • Урок 19. 00:24:54
    A little project | my solution
  • Урок 20. 00:03:22
    A little project | Follow-up
  • Урок 21. 00:02:23
    Introduction to the Cascade
  • Урок 22. 00:02:59
    How well do you really know it?
  • Урок 23. 00:06:12
    Importance and Origin
  • Урок 24. 00:04:50
    Origin and font-size implications
  • Урок 25. 00:06:10
    When animations and transitions get involved
  • Урок 26. 00:02:24
    Closing thoughts on Importance
  • Урок 27. 00:08:14
    Specificity
  • Урок 28. 00:03:00
    Fixing specificity issues
  • Урок 29. 00:08:22
    Calculating specificity
  • Урок 30. 00:02:01
    Pricing Cards | Introduction
  • Урок 31. 00:11:24
    A safe approach to CSS
  • Урок 32. 00:01:37
    Challenge | Pricing Cards
  • Урок 33. 00:06:48
    My Solution | Pricing Cards
  • Урок 34. 00:05:46
    Updated Design
  • Урок 35. 00:08:52
    Updated Design | My solution
  • Урок 36. 00:06:57
    Adding in custom properties
  • Урок 37. 00:07:50
    Setting up the typography
  • Урок 38. 00:08:15
    Mirroring the layout
  • Урок 39. 00:07:33
    Starting to think about class naming
  • Урок 40. 00:02:24
    Overlooked Fundamentals | Final Project
  • Урок 41. 00:29:05
    My solution
  • Урок 42. 00:06:40
    A word on class naming
  • Урок 43. 00:02:24
    Overlooked Fundamentals | Wrap up
  • Урок 44. 00:01:49
    The Unknown Fundamentals | Introduction
  • Урок 45. 00:00:48
    Unknown Fundamentals | Project 1 introduction
  • Урок 46. 00:03:10
    Teaching you how to fish
  • Урок 47. 00:01:38
    Introduction to Formatting Contexts
  • Урок 48. 00:05:42
    Inline formatting context and anonymous boxes
  • Урок 49. 00:10:38
    Block formatting context
  • Урок 50. 00:03:46
    Formatting context and floats
  • Урок 51. 00:13:04
    Collapsing margins in action
  • Урок 52. 00:02:38
    Creating a new formatting context
  • Урок 53. 00:05:52
    Flex and grid formatting contexts
  • Урок 54. 00:07:25
    Consistency
  • Урок 55. 00:08:21
    Creating a CSS rule for Flow Content consistency
  • Урок 56. 00:02:54
    Adding consistency to our magic page
  • Урок 57. 00:04:46
    Magic page finishing touches
  • Урок 58. 00:04:19
    A look at the updated design
  • Урок 59. 00:16:04
    Easy wins
  • Урок 60. 00:10:06
    Adding columns
  • Урок 61. 00:11:51
    The square corner decorations
  • Урок 62. 00:05:49
    Stepping up our spacing utility
  • Урок 63. 00:01:02
    Stacking Context and Containing Blocks Introduction
  • Урок 64. 00:01:52
    Introduction to Stacking Context
  • Урок 65. 00:04:00
    Exploring z-index
  • Урок 66. 00:09:00
    Stacking context deep dive
  • Урок 67. 00:04:01
    Stacking context in action
  • Урок 68. 00:06:06
    When stacking context breaks things
  • Урок 69. 00:08:35
    Stacking context coming into play
  • Урок 70. 00:04:13
    Fixing the stacking issue
  • Урок 71. 00:03:52
    Introduction to containing blocks
  • Урок 72. 00:05:11
    When the containing block is not the parent
  • Урок 73. 00:02:42
    Containing blocks on the magic site
  • Урок 74. 00:02:26
    Containing blocks in action
  • Урок 75. 00:01:33
    Containing blocks, a more complex example
  • Урок 76. 00:03:11
    Containing block edge cases
  • Урок 77. 00:03:48
    A look at the updated design
  • Урок 78. 00:02:48
    More easy wins
  • Урок 79. 00:11:13
    Setting up the typography
  • Урок 80. 00:11:20
    Fun with custom properties
  • Урок 81. 00:09:08
    The testimonial
  • Урок 82. 00:03:21
    Even more custom properties
  • Урок 83. 00:11:01
    The corner squares - updated
  • Урок 84. 00:07:00
    Call to actions
  • Урок 85. 00:03:30
    Module wrap-up
  • Урок 86. 00:02:35
    Introduction to Module 3
  • Урок 87. 00:04:21
    Content vs Layout
  • Урок 88. 00:02:22
    Remember this?
  • Урок 89. 00:03:32
    Fixing the problem
  • Урок 90. 00:13:42
    A deeper look at Flexbox
  • Урок 91. 00:11:58
    Content vs Layout in action | Introduction
  • Урок 92. 00:02:40
    Making things more consistent | In Action
  • Урок 93. 00:02:32
    Styling things up with utility classes | In Action
  • Урок 94. 00:06:53
    Plug and play | In Action
  • Урок 95. 00:03:59
    More Dynamic Layouts | In Action
  • Урок 96. 00:05:36
    Introduction to the final project
  • Урок 97. 00:07:53
    A look at what we're building
  • Урок 98. 00:37:06
    Writing the HTML
  • Урок 99. 00:04:47
    Bringing in, and building out, our reset
  • Урок 100. 00:15:55
    Styling the typography
  • Урок 101. 00:01:50
    Making the typography responsive
  • Урок 102. 00:07:56
    Adding in our spacing
  • Урок 103. 00:05:31
    More spacing!
  • Урок 104. 00:03:36
    Adding columns
  • Урок 105. 00:03:09
    Backgrounds
  • Урок 106. 00:06:38
    Styling the article previews
  • Урок 107. 00:03:43
    Making the images responsive
  • Урок 108. 00:07:35
    The call to action
  • Урок 109. 00:11:12
    Styling the form elements
  • Урок 110. 00:03:52
    Form fun from the future!
  • Урок 111. 00:12:56
    Styling the footer
  • Урок 112. 00:04:22
    Making the form responsive
  • Урок 113. 00:18:35
    Styling the header and the navigation
  • Урок 114. 00:02:23
    Introducing the blog page
  • Урок 115. 00:09:28
    Starting work on the blog page
  • Урок 116. 00:10:31
    A solution and the secondary navigation
  • Урок 117. 00:16:29
    Flexbox vs Grid - and setting up the grid
  • Урок 118. 00:02:55
    Making the grid responsive
  • Урок 119. 00:11:13
    Styling the featured article
  • Урок 120. 00:01:08
    Introduction to the final page
  • Урок 121. 00:06:21
    A look at the header
  • Урок 122. 00:08:25
    The main article
  • Урок 123. 00:07:21
    Challenge #1 | Solution
  • Урок 124. 00:04:18
    A new challenge!
  • Урок 125. 00:06:25
    Challenge #2 | Solution
  • Урок 126. 00:02:18
    The read next area
  • Урок 127. 00:02:14
    About adding in the links
  • Урок 128. 00:08:56
    Adding the links and a challenge
  • Урок 129. 00:04:41
    A solution and styling it up
  • Урок 130. 00:07:16
    A quick look at performance
  • Урок 131. 00:02:55
    Getting the links to cover the entire article
  • Урок 132. 00:02:32
    And that's a wrap!
  • Урок 133. 00:02:38
    Introduction to Module 4
  • Урок 134. 00:01:05
    What is tutorial hell?
  • Урок 135. 00:02:09
    Don't get frustrated if you're stuck
  • Урок 136. 00:02:24
    It's okay to move backwards
  • Урок 137. 00:03:09
    Don't compare yourself to others
  • Урок 138. 00:03:18
    The levels of cognition
  • Урок 139. 00:04:42
    Different methods of learning
  • Урок 140. 00:04:30
    Intentional learning
  • Урок 141. 00:04:49
    Getting to, and through, the applying stage
  • Урок 142. 00:05:40
    Knowing what you don't know
  • Урок 143. 00:03:07
    A simple example
  • Урок 144. 00:08:50
    When we take shortcuts
  • Урок 145. 00:02:34
    Let's learn together!
  • Урок 146. 00:10:05
    Taking a first look at it
  • Урок 147. 00:15:10
    Putting it into action
  • Урок 148. 00:02:49
    You can't remember everything
  • Урок 149. 00:06:10
    Less is more
  • Урок 150. 00:04:27
    You need to start doing
  • Урок 151. 00:06:37
    Wrap up
  • Урок 152. 00:05:05
    Introduction to Module 5
  • Урок 153. 00:05:41
    The next three levels
  • Урок 154. 00:04:15
    Being your own student
  • Урок 155. 00:05:26
    Why this works
  • Урок 156. 00:02:31
    How to teach
  • Урок 157. 00:13:22
    My first steps
  • Урок 158. 00:13:05
    Experimentation
  • Урок 159. 00:11:13
    The next step after you experiment
  • Урок 160. 00:07:03
    Some examples and ideas
  • Урок 161. 00:18:02
    Staying on top of things
  • Урок 162. 00:07:01
    Putting my approach into action
  • Урок 163. 00:16:18
    Asking questions when you are stuck
  • Урок 164. 00:09:40
    Moving into the applying stage
  • Урок 165. 00:03:20
    Vocalizing and analyzing
  • Урок 166. 00:05:21
    In Action - Wrap up
  • Урок 167. 00:07:12
    Go public!
  • Урок 168. 00:08:46
    A look at Dev.to
  • Урок 169. 00:05:22
    A quick look at getting started with video
  • Урок 170. 00:04:05
    Finding things and teaching what you've just learned
  • Урок 171. 00:04:30
    A low stress way to go public
  • Урок 172. 00:07:19
    Don't try to make things perfect
  • Урок 173. 00:05:35
    Teach everything you know
  • Урок 174. 02:00:05
    Live session #1 (November 6, 2020)
  • Урок 175. 00:12:56
    The Discord Community
  • Урок 176. 00:03:16
    My software and extensions
  • Урок 177. 00:04:17
    Using Figma