Узнайте все, начиная с основ CSS и заканчивая продвинутыми техниками CSS, выполнив более 100 упражнений и проектов. Вы научитесь использовать CSS для создания красивых, адаптивных веб-сайтов, которые впечатлят пользователей и работодателей. Станьте профессионалом в CSS и никогда больше не создавайте некрасивые сайты.
Этот курс по CSS является самым полным и актуальным способом изучения CSS онлайн. Он шаг за шагом проведет вас от полного новичка до настоящего мастера, обучая современным и продвинутым техникам CSS. Кроме того, вы будете создавать потрясающие реальные проекты, чтобы практиковать свои навыки и пополнять свое портфолио.
Это пробный урок. Оформите подписку, чтобы получить доступ ко всем материалам курса. Премиум
Урок 1.
00:01:16
The CSS Bootcamp: Zero to Mastery
Урок 2.
00:03:20
Course Overview & Bruno's Introduction
Урок 3.
00:14:38
Introduction to HTML
Урок 4.
00:23:15
Basic Elements
Урок 5.
00:10:55
Basic Attributes - Part 1
Урок 6.
00:09:34
Basic Attributes - Part 2
Урок 7.
00:11:55
Basic Attributes - Part 3
Урок 8.
00:16:36
Semantic Website
Урок 9.
00:05:36
Challenges
Урок 10.
00:15:42
Introduction
Урок 11.
00:09:56
HTML Forms and Input Types - Part 1
Урок 12.
00:08:52
HTML Forms and Input Types - Part 2
Урок 13.
00:10:18
Form Validation and Accessibility - Part 1
Урок 14.
00:09:08
Form Validation and Accessibility - Part 2
Урок 15.
00:16:28
Job Application Form - Part 1
Урок 16.
00:11:26
Job Application Form - Part 2
Урок 17.
00:11:39
Text Elements - Part 1
Урок 18.
00:09:01
Text Elements - Part 2
Урок 19.
00:07:15
Table Example
Урок 20.
00:05:44
Challenges
Урок 21.
00:09:05
Introduction
Урок 22.
00:11:42
Image and Multimedia Elements - Part 1
Урок 23.
00:09:41
Image and Multimedia Elements - Part 2
Урок 24.
00:10:57
Audio and Video Examples - Part 1
Урок 25.
00:05:50
Audio and Video Examples - Part 2
Урок 26.
00:11:49
Embed Examples
Урок 27.
00:05:26
Challenges
Урок 28.
00:13:27
Introduction to CSS
Урок 29.
00:10:41
CSS Syntax and Basic Selectors
Урок 30.
00:13:04
Basic CSS Properties - Part 1
Урок 31.
00:12:50
Basic CSS Properties - Part 2
Урок 32.
00:07:22
Cascade, Specificity, Inheritance - Part 1
Урок 33.
00:10:23
Cascade, Specificity, Inheritance - Part 2
Урок 34.
00:11:35
External CSS (Bootstrap Example) - Part 1
Урок 35.
00:05:59
External CSS (Bootstrap Example) - Part 2
Урок 36.
00:06:20
Challenges
Урок 37.
00:14:01
Introduction
Урок 38.
00:13:38
Box Model Properties - Part 1
Урок 39.
00:17:20
Box Model Properties - Part 2
Урок 40.
00:08:49
Position Property - Part 1
Урок 41.
00:10:47
Position Property - Part 2
Урок 42.
00:09:55
Display Property
Урок 43.
00:12:34
Video Background
Урок 44.
00:06:08
Challenges
Урок 45.
00:07:54
Introduction
Урок 46.
00:14:05
Table Example
Урок 47.
00:10:01
Images and Multimedia Example
Урок 48.
00:08:13
Audio and Video Example
Урок 49.
00:13:36
Job Application Example - Part 1
Урок 50.
00:08:04
Job Application Example - Part 2
Урок 51.
00:11:42
Semantic Website Example - Part 1
Урок 52.
00:09:58
Semantic Website Example - Part 2
Урок 53.
00:02:02
Bruno
Урок 54.
00:05:02
Introduction
Урок 55.
00:05:35
Mac / Linux Device Setup
Урок 56.
00:06:58
Windows Device Setup
Урок 57.
00:19:27
VSCode Setup & Template
Урок 58.
00:09:11
VSCode Extensions
Урок 59.
00:13:57
DevTools
Урок 60.
00:14:34
GitHub
Урок 61.
00:01:44
Bruno
Урок 62.
00:16:44
Introduction
Урок 63.
00:17:49
Design Games
Урок 64.
00:11:02
Styling Text with CSS
Урок 65.
00:10:55
Web Typography Basics - Part 1
Урок 66.
00:13:27
Web Typography Basics - Part 2
Урок 67.
00:16:11
Font Awesome
Урок 68.
00:13:25
Typographix V1 - Part 1
Урок 69.
00:10:07
Typographix V1 - Part 2
Урок 70.
00:19:35
Introduction
Урок 71.
00:01:41
Bruno
Урок 72.
00:07:22
Color Game
Урок 73.
00:15:18
Color Values
Урок 74.
00:10:15
Color Schemes & Palettes
Урок 75.
00:04:14
Web Accessibility - Contrast Checker
Урок 76.
00:10:38
Shadows
Урок 77.
00:09:09
Border Radius and Shapes
Урок 78.
00:16:07
CSS Variables and Custom Properties
Урок 79.
00:09:54
Dark Mode
Урок 80.
00:14:32
Typographix V2 - Adding Section Content
Урок 81.
00:18:27
Typographix V2 - Section Styling
Урок 82.
00:18:10
Typographix V2 - Dark Mode Toggle
Урок 83.
00:02:02
Bruno
Урок 84.
00:09:02
Introduction
Урок 85.
00:10:32
Viewport & Media Queries
Урок 86.
00:09:15
Responsive Media
Урок 87.
00:12:01
Responsive Text
Урок 88.
00:12:51
Navigation Menu
Урок 89.
00:09:10
Typographix V3 - Custom Scrollbar
Урок 90.
00:12:21
Typographix V3 - Navigation Menu - Part 1
Урок 91.
00:08:22
Typographix V3 - Navigation Menu - Part 2
Урок 92.
00:15:35
Typographix V3 - Media Queries (Tablets) - Part 1
Урок 93.
00:09:03
Typographix V3 - Media Queries (Tablets) - Part 2
Урок 94.
00:12:33
Typographix V3 - Media Queries (Smartphones) - Part 1
Урок 95.
00:11:58
Typographix V3 - Media Queries (Smartphones) - Part 2
Урок 96.
00:01:30
Bruno
Урок 97.
00:08:57
Introduction
Урок 98.
00:05:59
Flexbox Game
Урок 99.
00:15:31
Flexbox Containers
Урок 100.
00:09:11
Flexbox Items
Урок 101.
00:13:27
Common Layouts
Урок 102.
00:06:43
Flexbox Gallery
Урок 103.
00:09:01
Typographix Blog V1 - Adding HTML - Part 1
Урок 104.
00:12:25
Typographix Blog V1 - Adding HTML - Part 2
Урок 105.
00:07:40
Typographix Blog V1 - ChatGPT and AI
Урок 106.
00:14:00
Typographix Blog V1 - Styling Main Page - Part 1
Урок 107.
00:10:22
Typographix Blog V1 - Styling Main Page - Part 2
Урок 108.
00:13:49
Typographix Blog V1 - Sticky Navigation
Урок 109.
00:14:10
Typographix Blog V1 - Article Styling
Урок 110.
00:04:24
Typographix Blog V1 - Mobile Responsiveness - Part 1
Урок 111.
00:11:52
Typographix Blog V1 - Mobile Responsiveness - Part 2
Урок 112.
00:02:57
Exercise: Imposter Syndrome
Урок 113.
00:01:35
Bruno
Урок 114.
00:09:47
Introduction
Урок 115.
00:19:34
Grid Garden
Урок 116.
00:16:41
Grid Containers
Урок 117.
00:11:54
Grid Items
Урок 118.
00:14:39
Common Layouts
Урок 119.
00:06:21
Gallery Layout
Урок 120.
00:13:24
Column Masonry
Урок 121.
00:09:25
Typographix Gallery V1 - Styling - Part 1
Урок 122.
00:14:47
Typographix Gallery V1 - Styling - Part 2
Урок 123.
00:14:46
Typographix Gallery V1 - Modal Functionality
Урок 124.
00:01:19
Bruno
Урок 125.
00:09:08
Introduction
Урок 126.
00:14:31
Transition Properties
Урок 127.
00:11:18
Timing Functions
Урок 128.
00:10:14
Transition Tools
Урок 129.
00:16:39
Riddles Project
Урок 130.
00:06:39
Transition Steps (
Урок 131.
00:18:35
Typographix Gallery V2 - Transitions
Урок 132.
00:01:23
Bruno
Урок 133.
00:10:18
Introduction
Урок 134.
00:05:12
Animation Properties
Урок 135.
00:19:47
Animation Loops (Infinite Animations)
Урок 136.
00:15:53
Animation Tools
Урок 137.
00:09:01
Typewriter Effect
Урок 138.
00:14:28
Loading Animations - Part 1
Урок 139.
00:11:33
Loading Animations - Part 2
Урок 140.
00:17:17
Skeleton Screens
Урок 141.
00:11:01
Typographix Gallery V3 - Add Loading Spinner
Урок 142.
00:15:10
Typographix Blog V2 - Add Skeleton Screen
Урок 143.
00:01:29
Bruno
Урок 144.
00:03:39
Introduction
Урок 145.
00:12:39
Broadcast Graphics Project
Урок 146.
00:10:04
Broadcast Graphics - Styling - Part 1
Урок 147.
00:11:02
Broadcast Graphics - Styling - Part 2
Урок 148.
00:11:39
Broadcast Graphics - Dynamic Width JS
Урок 149.
00:17:31
Broadcast Graphics - CSS Animations
Урок 150.
00:13:42
Broadcast Graphics - JS Controls
Урок 151.
00:01:33
Bruno
Урок 152.
00:09:27
Introduction
Урок 153.
00:11:24
CSS Pseudo Selectors
Урок 154.
00:06:28
AI Image Generation
Урок 155.
00:10:15
Gradients and Patterns
Урок 156.
00:12:44
Clipping and Masking
Урок 157.
00:16:50
Blend Modes and Filters
Урок 158.
00:09:41
Cursor Types and Custom Cursors
Урок 159.
00:10:25
CSS Houdini
Урок 160.
00:03:47
Developer Portfolio V1 - Preview
Урок 161.
00:09:39
Developer Portfolio V1 - Mockups
Урок 162.
00:07:02
Developer Portfolio V1 - AI Generation
Урок 163.
00:16:26
Developer Portfolio V1 - Home - Part 1
Урок 164.
00:08:52
Developer Portfolio V1 - Home - Part 2
Урок 165.
00:17:05
Developer Portfolio V1 - About
Урок 166.
00:17:28
Developer Portfolio V1 - Projects
Урок 167.
00:13:02
Developer Portfolio V1 - Contact - Part 1
Урок 168.
00:12:35
Developer Portfolio V1 - Contact - Part 2
Урок 169.
00:05:18
Developer Portfolio V1 - Navigation
Урок 170.
00:11:07
Developer Portfolio - Responsive Design - Part 1
Урок 171.
00:11:03
Developer Portfolio - Responsive Design - Part 2
Урок 172.
00:07:39
Developer Portfolio - Responsive Design - Part 3
Урок 173.
00:01:20
Bruno
Урок 174.
00:09:28
Introduction
Урок 175.
00:12:27
Accessibility Testing - Part 1
Урок 176.
00:09:37
Accessibility Testing - Part 2
Урок 177.
00:14:02
Typographix V4 - Media Queries - Part 1
Урок 178.
00:07:14
Typographix V4 - Media Queries - Part 2
Урок 179.
00:07:20
Media Queries - Print Example
Урок 180.
00:19:47
Developer Portfolio V2 - Media Optimization
Урок 181.
00:01:46
Bruno
Урок 182.
00:13:41
Introduction
Урок 183.
00:12:55
Compare CSS, SCSS, SASS
Урок 184.
00:15:13
Color Adjustments
Урок 185.
00:18:56
Variables, Nesting, Mixins, Extend/Inheritance
Урок 186.
00:10:25
Control Directives (for, each, while) - Part 1
Урок 187.
00:12:37
Control Directives (for, each, while) - Part 2
Урок 188.
00:10:43
Functions
Урок 189.
00:12:42
Typograhpix Blog V3 - Setup - Part 1
Урок 190.
00:10:04
Typograhpix Blog V3 - Setup - Part 2
Урок 191.
00:18:48
Typographix Blog V3 - Basic Partials, Dark Mode
Урок 192.
00:11:33
Typographix Blog V3 - Most Partials - Part 1
Урок 193.
00:11:02
Typographix Blog V3 - Most Partials - Part 2
Урок 194.
00:13:11
Typographix Blog V3 - Media Queries & Testing
Урок 195.
00:03:20
Introduction
Урок 196.
00:01:29
Bruno
Урок 197.
00:04:43
Typographix Final - Preview
Урок 198.
00:08:30
Typographix Final - Gather and Optimize Media
Урок 199.
00:16:37
Typographix Final - Project Setup
Урок 200.
00:15:04
Typographix Final - Home Section
Урок 201.
00:12:48
Typographix Final - About Section (HTML/SCSS)
Урок 202.
00:13:15
Typographix Final - About Section (JS)
Урок 203.
00:10:19
Typographix Final - Gallery Section - Part 1
Урок 204.
00:12:25
Typographix Final - Gallery Section - Part 2
Урок 205.
00:14:19
Typographix Final - Blog Section - Part 1
Урок 206.
00:13:39
Typographix Final - Blog Section - Part 2
Урок 207.
00:13:15
Typographix Final - Contact Section - Part 1
Урок 208.
00:08:25
Typographix Final - Contact Section - Part 2
Урок 209.
00:10:49
Typographix Final - Form Functionality - Part 1
Урок 210.
00:11:47
Typographix Final - Form Functionality - Part 2
Урок 211.
00:06:58
Typographix Final - Footer Section
Урок 212.
00:13:10
Typographix Final - Navigation Menu
Урок 213.
00:10:33
Typographix Final - Navigation Menu (Animation) - Part 1
Урок 214.
00:07:47
Typographix Final - Navigation Menu (Animation) - Part 2
Урок 215.
00:12:09
Typographix Final - Media Queries (Tablets) - Part 1
Урок 216.
00:09:58
Typographix Final - Media Queries (Tablets) - Part 2
Урок 217.
00:08:47
Typographix Final - Media Queries (Tablets) - Part 3
Урок 218.
00:08:35
Typographix Final - Media Queries (Smartphones) - Part 1
Урок 219.
00:09:57
Typographix Final - Media Queries (Smartphones) - Part 2
Урок 220.
00:11:44
Typographix Final - Media Queries (Smartphones) - Part 3
Урок 221.
00:05:51
Typographix Final - Testing & Optimizing
Урок 222.
00:01:48
Bruno
Урок 223.
00:11:19
Course Wrap-up
Урок 224.
00:08:25
Preparing for CSS Interviews
Урок 225.
00:11:40
Challenges
Урок 226.
00:01:18
Thank You!
Автор - zerotomastery.io
zerotomastery.io
Независимо от того, начинаете ли вы изучать программирование или хотите усовершенствовать свои навыки, Академия Zero To Mastery научит вас React, Javascript, Python, CSS и многим другим вещам, чтобы помочь вам продвинуться по карьерной лестнице, получить работу и добиться успеха в некоторых ведущих компаниях.
Команда внимательно читает ваши комментарии и оперативно на них реагирует. Вы можете спокойно оставлять запросы на обновления или задавать любые вопросы о курсе здесь.
Изучите макеты CSS в глубину, включая Grid и Subgrid, Flexbox, техники адаптивных изображений, медиа-запросы и запросы контейнера. Научитесь применять эти техники к вашему следующему веб-сайту, даже если вы раньше не работали с макетами CSS.
"За пределами CSS" - это курс, разработанный для помощи в использовании современного CSS и инструментов, таких как Sass и PostCSS, для более эффективного управления таблицами стилей. Курс, который поможет вам научиться организовывать и масштабировать ваши таблицы стилей, независимо от размера проекта или количества участников в команде.
Изучите лучшие практики и шаблоны проектирования для каждого макета CSS. Знайте точно, что следует делать и что не следует делать в любое время. Развивайте интуицию для разбиения каждого макета на его простейшие строительные блоки и способность воссоздать его с использованием как CSS Grid, так и Flexbox.
Добро пожаловать на полный курс по CSS, где вы выучите все основы CSS и выполните множество практических упражнений. Этот курс создан для того, чтобы вы уверенно владели стилями и могли превратить свои веб приложения в настоящие произведения искусства. Вы начнете с основ CSS, научитесь применять стили к разным элементам и разберетесь с тем, как создать адаптивный дизайн.Особое внимание в курсе уделяется гибкости в размещении элементов с
Ищете практику верстки CSS? Присоединяйтесь к Джен Крамер и создайте несколько различных адаптивных макетов на основе предоставленных ресурсов, целей проекта и ожиданий. Для решения любой из этих проблем с макетом не требуется JavaScript. Каждое задание становится все сложнее. В первой задаче мы создадим некоторый базовый стиль, который поможет решить другие задачи. Последнее задание включает в себя 5 различных макетов с единой кодовой базой HTML
kevin powell
newline (ex fullstack.io)
