26 added
33 removed
Original
2026-01-01
Modified
2026-02-21
1
-
<h2>Course “CSS: Site Adaptability”</h2>
1
+
<p>Responsive Page Design</p>
2
-
<p>Course updated on December 29, 2025</p>
2
+
<p>CSS</p>
3
-
<p><a>Subscribe</a></p>
3
+
<p>Flexbox</p>
4
-
<p>Access this and all courses with a subscription</p>
4
+
<p>Grid</p>
5
-
<p>What's included</p>
5
+
<p>Media Queries</p>
6
-
<p>7 lessons (video and/or text)</p>
6
+
<p>Skill in creating responsive interfaces for building convenient, functional solutions across a wide range of devices</p>
7
-
<p>4 exercises in the simulator</p>
7
+
<h2>Learning syllabus</h2>
8
-
<p>Extended materials for 7 lessons</p>
8
+
<p>Element Positioning</p>
9
-
<h2>Description</h2>
9
+
<p>Types of element positioning, floating elements, element stacking</p>
10
-
<p>The course is devoted to adaptivity, the main element of the site. The adaptive layout allows layouts to be viewed comfortably on cell phones, tablets, and PC screens. This course will reveal the mechanisms of creating adaptive HTML markup using CSS mechanisms. You will learn about a powerful tool - media queries. They help to add CSS styles for different resolutions and screen types.</p>
10
+
<p>Grid and Flex</p>
11
-
<h2>You will learn</h2>
11
+
<p>Flex container, aligning elements along axes, Flex item properties, placing elements in a grid</p>
12
-
<ul><li><p>Check the site's adaptability using online tools</p>
12
+
<p>Website Responsiveness</p>
13
+
<p>Checking site responsiveness, viewport, flexible elements, media queries</p>
14
+
<h2>Projects</h2>
15
+
<p>"Music Box" website</p>
16
+
<p>In the second project, you will create two pages for the "Music Box" website. This project is a continuation of the first one and will involve using OOCSS and Atomic CSS methodologies for layout creation. In addition, you will apply the skills you learned in the Adaptivity and SASS courses. You will need to implement an adaptive layout on your own. The Figma service will allow you to work directly with the layout file in the project.</p>
17
+
<h2>How learning is organised</h2>
18
+
<p>You learn the theory in a convenient text format - easy to read even from your phone. Live examples help you immediately understand how everything works in practice. The material is organised in such a way that you move step by step from simple to complex without missing important details</p>
19
+
<p>Subscription 3,900 ₽/month</p>
20
+
<p>The subscription gives access to all courses in the "subscription" catalog. Cancel anytime. Company payments are available.</p>
21
+
<p><a>Subscribe →</a></p>
22
+
<ul><li><p>50+ courses</p>
13
</li>
23
</li>
14
-
<li><p>Use the unit of measure percentage to create responsive layouts</p>
24
+
<li><p>Lifetime access to theory</p>
15
</li>
25
</li>
16
-
<li><p>Work with Flex when creating adaptive layouts</p>
26
+
<li><p>Learn in parallel</p>
17
</li>
27
</li>
18
-
<li><p>Create media queries that allow you to use styles for different screen resolutions</p>
28
+
<li><p>Learning with an AI assistant</p>
19
</li>
29
</li>
20
-
<li><p>Work with different types of devices and create styles for them</p>
30
+
</ul>
21
-
</li>
22
-
</ul><h2>Challenges</h2>
23
-
<p>1</p>
24
-
<p>Weather widget</p>
25
-
<p>2</p>
26
-
<p>Responsive table</p>
27
-
<p>3</p>
28
-
<p>Adaptive menu</p>
29
-
<h2>Recommended programs</h2>
30
-
<ul><li><p>Run code right in the browser</p>
31
-
</li>
32
-
<li><p>Lifetime access</p>
33
-
</li>
34
-
<li><p>Learn at your own pace</p>
35
-
</li>
36
-
</ul><p><a>Subscribe</a></p>
37
-
<p>Access this and all courses with a subscription</p>