Menu
Coddy logo textTech

Настройка

Урок 2 из 11 курса Круговой прогресс-бар | Front-end проект на Coddy.

Давайте настроим заголовок и внешнюю оболочку нашего элемента.

challenge icon

Задание

Легко
  1. Создайте тег и добавьте текст по вашему выбору.</li><li>Внутри тега <body> создайте div с именем класса container.</li></ol></div></div></div><div class="LearnLessonView_editorCol__Sc3p1"><div class="LearnLessonView_editorSticky__jL1qj"><p class="LearnLessonView_editorTitle__nvy6h">Попробуйте сами</p><div class="LearnEditorPanel_container__4pPMz" dir="ltr"><div class="LearnEditorPanel_header__MqTTZ"><div class="LearnEditorPanel_tabs__Hcd0w"><button type="button" class="LearnEditorPanel_tab__vveHp LearnEditorPanel_tabActive__2aB2C">index.html</button><button type="button" class="LearnEditorPanel_tab__vveHp">styles.css</button><button type="button" class="LearnEditorPanel_tab__vveHp">script.js</button></div><div class="LearnEditorPanel_headerActions__OGBjk"><div class="LearnEditorPanel_viewToggle__x66KN"><button type="button" class="LearnEditorPanel_viewToggleButton__06UR_ LearnEditorPanel_viewToggleActive__88n12">Код</button><button type="button" class="LearnEditorPanel_viewToggleButton__06UR_">Просмотр</button></div><button type="button" class="LearnEditorPanel_runButton___Nfhs"><img loading="lazy" decoding="async" src="/icons/play.svg" alt="play icon" class=" " width="20" height="20"/><span>Запустить код</span></button><div class="LearnEditorPanel_turnstileSlot__oWMi9" aria-hidden="true"></div></div></div><div class="LearnEditorPanel_editorArea__ahQw4"><pre class="LearnEditorPanel_ssrCode__rgaJT" dir="ltr"><code class="language-html"><!DOCTYPE html> <html> <head> <link rel="stylesheet" href="styles.css"> </head> <body> <!-- Write HTML code here --> <script src="script.js"></script> </body> </html></code></pre></div></div></div></div></div><nav class="LearnLessonView_pagination__EW8li" aria-label="Уроки"><a class="LearnLessonView_pageNavLink__xe9cp" href="/learn/ru/courses/circular_progress_bar__frontend_project/what_are_you_going_to_make"><small>Предыдущий урок</small><span>Что вы создадите?</span></a><a class="LearnLessonView_pageNavLink__xe9cp LearnLessonView_pageNavNext__4xsVk" href="/learn/ru/courses/circular_progress_bar__frontend_project/finish_html"><small>Следующий урок</small><span>Завершение HTML</span></a></nav><section class="LearnLessonView_allLessons__7vTLw"><h2 class="LearnLessonView_sectionHeading__FgJW5">Все уроки раздела Круговой прогресс-бар | Front-end проект</h2><div class="LearnLessonView_chapterGrid__JYgUK"><div class="LearnLessonView_chapterColumn__8jlNw"><div class="LearnLessonView_chapterCard__0Kxod"><p class="LearnLessonView_chapterTitle__RKDBF"><span class="LearnLessonView_chapterNumber__9Xjl1">1</span>Введение</p><a class="LearnLessonView_chapterLesson__wg_Jg" href="/learn/ru/courses/circular_progress_bar__frontend_project/what_are_you_going_to_make"><span class="LearnLessonView_lessonIndicator__lX4BG"></span><span class="LearnLessonView_lessonRowName___wgKo">Что вы создадите?</span></a></div><div class="LearnLessonView_chapterCard__0Kxod"><p class="LearnLessonView_chapterTitle__RKDBF"><span class="LearnLessonView_chapterNumber__9Xjl1">4</span>JavaScript</p><a class="LearnLessonView_chapterLesson__wg_Jg" href="/learn/ru/courses/circular_progress_bar__frontend_project/make_it_work"><span class="LearnLessonView_lessonIndicator__lX4BG"></span><span class="LearnLessonView_lessonRowName___wgKo">Заставь это работать!</span><img loading="lazy" decoding="async" src="/icons/project-lesson.svg" alt="Урок-проект" class=" LearnLessonView_projectIcon__jgNIZ"/></a></div></div><div class="LearnLessonView_chapterColumn__8jlNw"><div class="LearnLessonView_chapterCard__0Kxod"><p class="LearnLessonView_chapterTitle__RKDBF"><span class="LearnLessonView_chapterNumber__9Xjl1">2</span>HTML</p><span class="LearnLessonView_chapterLesson__wg_Jg LearnLessonView_chapterLessonCurrent__Ge8kg" aria-current="page"><span class="LearnLessonView_lessonIndicator__lX4BG"></span><span class="LearnLessonView_lessonRowName___wgKo">Настройка</span></span><a class="LearnLessonView_chapterLesson__wg_Jg" href="/learn/ru/courses/circular_progress_bar__frontend_project/finish_html"><span class="LearnLessonView_lessonIndicator__lX4BG"></span><span class="LearnLessonView_lessonRowName___wgKo">Завершение HTML</span><img loading="lazy" decoding="async" src="/icons/project-lesson.svg" alt="Урок-проект" class=" LearnLessonView_projectIcon__jgNIZ"/></a></div></div><div class="LearnLessonView_chapterColumn__8jlNw"><div class="LearnLessonView_chapterCard__0Kxod"><p class="LearnLessonView_chapterTitle__RKDBF"><span class="LearnLessonView_chapterNumber__9Xjl1">3</span>CSS</p><a class="LearnLessonView_chapterLesson__wg_Jg" href="/learn/ru/courses/circular_progress_bar__frontend_project/universal_selector"><span class="LearnLessonView_lessonIndicator__lX4BG"></span><span class="LearnLessonView_lessonRowName___wgKo">Универсальный селектор</span><img loading="lazy" decoding="async" src="/icons/project-lesson.svg" alt="Урок-проект" class=" LearnLessonView_projectIcon__jgNIZ"/></a><a class="LearnLessonView_chapterLesson__wg_Jg" href="/learn/ru/courses/circular_progress_bar__frontend_project/body"><span class="LearnLessonView_lessonIndicator__lX4BG"></span><span class="LearnLessonView_lessonRowName___wgKo">Селектор body</span><img loading="lazy" decoding="async" src="/icons/project-lesson.svg" alt="Урок-проект" class=" LearnLessonView_projectIcon__jgNIZ"/></a><a class="LearnLessonView_chapterLesson__wg_Jg" href="/learn/ru/courses/circular_progress_bar__frontend_project/container_class"><span class="LearnLessonView_lessonIndicator__lX4BG"></span><span class="LearnLessonView_lessonRowName___wgKo">Класс контейнера</span><img loading="lazy" decoding="async" src="/icons/project-lesson.svg" alt="Урок-проект" class=" LearnLessonView_projectIcon__jgNIZ"/></a><a class="LearnLessonView_chapterLesson__wg_Jg" href="/learn/ru/courses/circular_progress_bar__frontend_project/circular_progress_class"><span class="LearnLessonView_lessonIndicator__lX4BG"></span><span class="LearnLessonView_lessonRowName___wgKo">Класс кругового индикатора</span><img loading="lazy" decoding="async" src="/icons/project-lesson.svg" alt="Урок-проект" class=" LearnLessonView_projectIcon__jgNIZ"/></a><a class="LearnLessonView_chapterLesson__wg_Jg" href="/learn/ru/courses/circular_progress_bar__frontend_project/circular_progress_before"><span class="LearnLessonView_lessonIndicator__lX4BG"></span><span class="LearnLessonView_lessonRowName___wgKo">Псевдоэлемент ::before для кругового индикатора</span><img loading="lazy" decoding="async" src="/icons/project-lesson.svg" alt="Урок-проект" class=" LearnLessonView_projectIcon__jgNIZ"/></a><a class="LearnLessonView_chapterLesson__wg_Jg" href="/learn/ru/courses/circular_progress_bar__frontend_project/progress_value_class"><span class="LearnLessonView_lessonIndicator__lX4BG"></span><span class="LearnLessonView_lessonRowName___wgKo">Класс значения прогресса</span><img loading="lazy" decoding="async" src="/icons/project-lesson.svg" alt="Урок-проект" class=" LearnLessonView_projectIcon__jgNIZ"/></a><a class="LearnLessonView_chapterLesson__wg_Jg" href="/learn/ru/courses/circular_progress_bar__frontend_project/text_class"><span class="LearnLessonView_lessonIndicator__lX4BG"></span><span class="LearnLessonView_lessonRowName___wgKo">Класс текста</span><img loading="lazy" decoding="async" src="/icons/project-lesson.svg" alt="Урок-проект" class=" LearnLessonView_projectIcon__jgNIZ"/></a></div></div></div></section><p class="LearnLessonView_practiceLine__Rq__3">Потренируйтесь самостоятельно:<!-- --> <a class="LearnLessonView_practiceLink__uhEXB" href="/playground/ru/html">Песочница Web</a></p></div></main><footer class="BottomSection_container__sSNi1"><div class="BottomSection_topContainer__W3hy5 "><div class="BottomSection_innerContainer__Wnx0k BottomSection_first__GE6kv"><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Компания</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/">Главная</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/about">О нас</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/affiliate">Партнерская программа</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/teachers/ru">Преподаватели</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/press">Пресса</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/careers/ru">Карьера</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl Link_withIcon__zA_Pl " target="_blank" rel="noreferrer" href="https://coddy.tech/build">Coddy Build<img loading="lazy" decoding="async" src="/icons/open-in-new-tab.svg" alt="new tab" class=" Link_openNewTabIcon__tk57Z" width="16" height="16"/></a><div class="BottomSection_socialLinksContainer__DBmjI"><a href="https://www.instagram.com/coddy.tech/" target="_blank" rel="noopener noreferrer" aria-label="Coddy on Instagram"><img loading="lazy" decoding="async" src="/icons/instagram.svg" alt="Coddy on Instagram" class=" "/></a><a href="https://www.facebook.com/coddylearn" target="_blank" rel="noopener noreferrer" aria-label="Coddy on Facebook"><img loading="lazy" decoding="async" src="/icons/facebook.svg" alt="Coddy on Facebook" class=" "/></a><a href="https://www.linkedin.com/company/coddy-tech" target="_blank" rel="noopener noreferrer" aria-label="Coddy on LinkedIn"><img loading="lazy" decoding="async" src="/icons/linkedin.svg" alt="Coddy on LinkedIn" class=" "/></a><a href="https://www.tiktok.com/@coddy.tech" target="_blank" rel="noopener noreferrer" aria-label="Coddy on TikTok"><img loading="lazy" decoding="async" src="/icons/tiktok.svg" alt="Coddy on TikTok" class=" "/></a><a href="https://x.com/coddy_tech" target="_blank" rel="noopener noreferrer" aria-label="Coddy on X (Twitter)"><img loading="lazy" decoding="async" src="/icons/twitter.svg" alt="Coddy on X (Twitter)" class=" "/></a><a href="https://www.youtube.com/@coddytech" target="_blank" rel="noopener noreferrer" aria-label="Coddy on YouTube"><img loading="lazy" decoding="async" src="/icons/youtube.svg" alt="Coddy on YouTube" class=" "/></a></div><div class="BottomSection_storeButtonsContainer__eFVqR"><button class="ButtonBase_button__OiByR StoreButton_storeButton__qaw8_ buttonPrimary"><div class="StoreButton_iconContainer__i4YTc"><img loading="lazy" decoding="async" src="/icons/app-store.svg" alt="App Store icon" class="dark_themeAwareIcon__tUZpr StoreButton_icon__7j6re"/></div><div class="StoreButton_textContainer__1iwc3"><span class="StoreButton_topText__UaZg1">Загрузите в</span><span class="StoreButton_bottomText__Qj2tq">App Store</span></div></button><button class="ButtonBase_button__OiByR StoreButton_storeButton__qaw8_ buttonPrimary"><div class="StoreButton_iconContainer__i4YTc"><img loading="lazy" decoding="async" src="/icons/google-play.svg" alt="Google Play icon" class="dark_themeAwareIcon__tUZpr StoreButton_icon__7j6re"/></div><div class="StoreButton_textContainer__1iwc3"><span class="StoreButton_topText__UaZg1">Доступно в</span><span class="StoreButton_bottomText__Qj2tq">Google Play</span></div></button></div></div></div><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Ресурсы</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/learn-to-code/ru">Научиться программировать</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/free-coding-websites/ru">Бесплатные сайты для программирования</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru">Все курсы</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/apps">Мобильное приложение</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/blog/ru">Блог</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certifications/ru">Сертификации</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/docs">Справочник</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/python">Playground</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru">Инструменты</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/embed/ru">Встроить редактор</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/cheat-sheets/ru">Шпаргалки</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru">Визуализации</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru">Команды Git</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/pseudocode/ru">Редактор псевдокода</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/ai_assistant">ИИ-ассистент</a></div><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Поддержка</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/contact/ru">Контакт</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/faqs/ru">FAQ</a></div></div></div><div class="BottomSection_divider__7XlJt"></div><div class="BottomSection_innerContainer__Wnx0k BottomSection_second__7xOvP"><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Языки</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru">Смотреть все</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/python">Python</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/javascript">JavaScript</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/typescript">TypeScript</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/react">React</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/nextjs">Next.js</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/java">Java</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/cpp">C++</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/csharp">C#</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/sql">SQL</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/html">HTML</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/css">CSS</a></div></div><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX "> </p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/c">C</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/go">Golang</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/php">PHP</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/r">R</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/dart">Dart</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/rust">Rust</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/lua">Lua</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/luau">Luau</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/excel">Excel</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/git">Git</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/landing/ru/docker">Docker</a></div></div><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Пространства</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/chess/ru">Chess</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/math/ru">Math</a></div></div><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Playground</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/python">Python</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/javascript">JavaScript</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/java">Java</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/typescript">TypeScript</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/cpp">C++</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/c">C</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/csharp">C#</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/sql">SQL</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/html">HTML</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/golang">Golang</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/php">PHP</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/ruby">Ruby</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/rust">Rust</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/playground/ru/r">R</a></div></div><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Сертификаты</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certifications/ru">Смотреть все</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/python">Python</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/javascript">JavaScript</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/java">Java</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/cpp">C++</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/csharp">C#</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/sqlite">SQL</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/html">HTML & CSS</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/go">Go</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/rust">Rust</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/php">PHP</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/ruby">Ruby</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/swift">Swift</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/dart">Dart</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/certification/ru/c">C</a></div></div><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Инструменты</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru">Смотреть все</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/ascii-art-generator">ASCII Art Generator</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/json-formatter">JSON Formatter</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/sql-formatter">SQL Formatter</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/regex-tester">Regex Tester</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/markdown-editor">Markdown Editor</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/base64">Base64 Encoder</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/url-encoder">URL Encoder</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/jwt-decoder">JWT Decoder</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/diff-checker">Diff Checker</a></div></div><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX "> </p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/hash-generator">Hash Generator</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/uuid-generator">UUID Generator</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/password-generator">Password Generator</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/case-converter">Case Converter</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/color-converter">Color Converter</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/cron-expression">Cron Expression</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/timestamp-converter">Timestamp Converter</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/tools/ru/qr-code-generator">QR Code Generator</a></div></div><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Документация</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/docs/ru">Вся документация</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/docs/ru/python">Python</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/docs/ru/javascript">JavaScript</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/docs/ru/java">Java</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/docs/ru/cpp">C++</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/docs/ru/sqlite">SQL</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/docs/ru/verilog">Verilog</a></div></div><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Блог</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/blog/ru">Последние публикации</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/blog/ru/tag/software-development">Software Development</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/blog/ru/tag/web-development">Web Development</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/blog/ru/tag/coding-for-beginners">Coding for Beginners</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/blog/ru/tag/artificial-intelligence">Artificial Intelligence</a></div></div><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Обзоры и сравнения</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/vs/ru">Смотреть все</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/vs/ru/coursera">Coursera</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/vs/ru/udemy">Udemy</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/vs/ru/codecademy">Codecademy</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/vs/ru/datacamp">DataCamp</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/vs/ru/leetcode">LeetCode</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/vs/ru/boot-dev">Boot.dev</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/vs/ru/freecodecamp">freeCodeCamp</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/vs/ru/udemy-vs-coursera">Udemy vs Coursera</a></div></div><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Визуализации</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru">Смотреть все</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/sorting">Сортировка</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/data-structures">Структуры данных</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/graphs">Алгоритмы на графах</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/searching">Поиск</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/concepts">Core Concepts</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/sorting/merge-sort">Merge Sort</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/sorting/quick-sort">Quick Sort</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/sorting/bubble-sort">Bubble Sort</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/sorting/selection-sort">Selection Sort</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/searching/binary-search">Binary Search</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/data-structures/binary-search-tree">Binary Search Tree</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/data-structures/linked-list">Linked List</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/data-structures/hash-table">Hash Table</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/graphs/depth-first-search">Depth-First Search</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/graphs/breadth-first-search">Breadth-First Search</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/visualize/ru/graphs/dijkstras-algorithm">Dijkstra's Algorithm</a></div></div><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Команды Git</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru">Смотреть все</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/setup">Настройка и конфигурация</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/staging-committing">Индексация и коммит</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/branching">Ветвление</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/undoing">Отмена изменений</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/merging-rebasing">Слияние и перебазирование</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/remotes">Удалённые репозитории</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/inspecting">Просмотр и очистка</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/git-rebase">git rebase</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/git-worktree">git worktree</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/git-stash">git stash</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/git-merge">git merge</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/git-reset">git reset</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/git-undo-commit">git undo commit</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/git-cherry-pick">git cherry-pick</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/git-commands/ru/git-rebase-vs-merge">git rebase vs merge</a></div></div><div class="BottomSection_linksGroupContainer__paEJl"><p class="Text_normal__n3ZPv Text_colorPrimary__iIPFl Text_bold__3aheX ">Псевдокод</p><div class="BottomSection_linksContainer__yByN_"><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/pseudocode/ru">Смотреть все</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/pseudocode/ru/cie">Cambridge (IGCSE / A-Level)</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/pseudocode/ru/aqa">AQA (GCSE / A-level)</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/pseudocode/ru/ocr">OCR (Exam Reference Language)</a><a class="Link_link__o93CI Text_normal__n3ZPv Text_colorPrimary__iIPFl " target="_self" href="/pseudocode/ru/edexcel">Pearson Edexcel (GCSE)</a></div></div></div></div><div class="BottomSection_bottomContainer___SPK4"><div class="BottomSection_innerBottomContainer__BxhcG"><a class="Link_link__o93CI Text_small__H1pZB Text_colorPrimary__iIPFl " target="_self" href="/privacy">Политика конфиденциальности</a><p class="Text_small__H1pZB Text_colorPrimary__iIPFl ">|</p><a class="Link_link__o93CI Text_small__H1pZB Text_colorPrimary__iIPFl " target="_self" href="/terms">Условия</a><p class="Text_small__H1pZB Text_colorPrimary__iIPFl ">|</p><a class="Link_link__o93CI Text_small__H1pZB Text_colorPrimary__iIPFl " target="_self" href="/cookie-policy">Политика использования файлов cookie</a><p class="Text_small__H1pZB Text_colorPrimary__iIPFl ">|</p><a class="Link_link__o93CI Text_small__H1pZB Text_colorPrimary__iIPFl " target="_blank" rel="noreferrer" href="https://coddy.tech/sitemap.xml">Карта сайта</a><p class="Text_small__H1pZB Text_colorPrimary__iIPFl ">|</p><a class="Link_link__o93CI Text_small__H1pZB Text_colorPrimary__iIPFl " target="_self" href="/attributions">Источники</a><div class="BottomSection_languageSwitcher__CxMx4"><p class="Text_small__H1pZB Text_colorSecondary__IcneE ">Язык: </p><select aria-label="Язык" class="BottomSection_languageSelect__qoGop"><option value="en">English</option><option value="es">Español</option><option value="pt">Português</option><option value="tr">Türkçe</option><option value="fr">Français</option><option value="de">Deutsch</option><option value="ru" selected="">Русский</option><option value="ja">日本語</option><option value="ko">한국어</option><option value="ar">العربية</option></select></div></div><p class="Text_small__H1pZB Text_colorPrimary__iIPFl ">Сделано с ❤️ © 2026 Coddy</p></div></footer></div></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"variant":"course","homeId":"courses","journeyId":null,"sectionId":"circular_progress_bar__frontend_project","lessonId":"set_up","uiLang":"ru","hubCrumb":{"name":"Учиться","href":"/landing/ru"},"languageTitle":"Курсы","sectionTitle":"Круговой прогресс-бар | Front-end проект","sectionLandingHref":"/landing/ru/courses/circular_progress_bar__frontend_project","titleContext":"Круговой прогресс-бар | Front-end проект","isPartOfName":"Круговой прогресс-бар | Front-end проект","displayName":"Настройка","description":"Давайте настроим заголовок и внешнюю оболочку нашего элемента.","lesson":{"id":"set_up","title":"Set up","body":"\u003cp\u003eДавайте настроим заголовок и внешнюю оболочку нашего элемента.\u003c/p\u003e","theoryHtml":"","extendedTheory":[],"quizQuestionsNum":0,"boardChallenge":null,"mathChallenge":null,"chessChallenge":null,"isProject":false,"isMultiFile":true,"lastUpdated":null,"task":{"body":"\u003col\u003e\u003cli\u003eСоздайте тег \u003ctitle\u003e и добавьте текст по вашему выбору.\u003c/li\u003e\u003cli\u003eВнутри тега \u003cbody\u003e создайте div с именем класса container.\u003c/li\u003e\u003c/ol\u003e","type":"web","diff":1,"languages":["html"],"primaryLang":"html","starter":{"files":[{"path":"index.html","code":"\u003c!DOCTYPE html\u003e\n\u003chtml\u003e\n\u003chead\u003e\n \u003clink rel=\"stylesheet\" href=\"styles.css\"\u003e\n\u003c/head\u003e\n \u003cbody\u003e\n \u003c!-- Write HTML code here --\u003e\n \u003cscript src=\"script.js\"\u003e\u003c/script\u003e\n \u003c/body\u003e\n\u003c/html\u003e","main":true},{"path":"styles.css","code":"/* Write CSS code here */","main":false},{"path":"script.js","code":"// Write JavaScript code here","main":false}]}}},"prevLesson":{"id":"what_are_you_going_to_make","name":"Что вы создадите?","isProject":false},"nextLesson":{"id":"finish_html","name":"Завершение HTML","isProject":true},"sectionChapters":[{"name":"Введение","lessons":[{"id":"what_are_you_going_to_make","name":"Что вы создадите?","isProject":false}]},{"name":"HTML","lessons":[{"id":"set_up","name":"Настройка","isProject":false},{"id":"finish_html","name":"Завершение HTML","isProject":true}]},{"name":"CSS","lessons":[{"id":"universal_selector","name":"Универсальный селектор","isProject":true},{"id":"body","name":"Селектор body","isProject":true},{"id":"container_class","name":"Класс контейнера","isProject":true},{"id":"circular_progress_class","name":"Класс кругового индикатора","isProject":true},{"id":"circular_progress_before","name":"Псевдоэлемент ::before для кругового индикатора","isProject":true},{"id":"progress_value_class","name":"Класс значения прогресса","isProject":true},{"id":"text_class","name":"Класс текста","isProject":true}]},{"name":"JavaScript","lessons":[{"id":"make_it_work","name":"Заставь это работать!","isProject":true}]}],"lessonsTotal":11,"lessonIndex":1,"journeyLang":"html","progressKey":"circular_progress_bar__frontend_project"},"initialLang":"ru","initialBundles":{"comp/topbar":{"choose_courses_tailored":"Выберите курсы, идеально соответствующие вашему уровню знаний.","completed":"Завершено","course_type":"Тип курса","courses":"Курсы","difficulty":"Сложность","explore_courses_by_language":"Изучайте курсы по языку программирования.","get_started":"НАЧАТЬ","hide_finished":"Скрыть завершённые","journey":"Путь","learn_challenge_build":"Учитесь, соревнуйтесь или создавайте портфолио через практику.","let_us_know":"сообщите нам","level_of_knowledge":"Уровень знаний","login":"Войти","no_notifications":"Нет уведомлений для отображения.","notifications":"Уведомления","or_try_search_part1":"Или попробуйте ","or_try_search_part2":" любой курс. Всё ещё не нашли? ","programming_language":"Язык программирования","search":"поиск","search_courses":"Поиск курсов","select_language":"Выберите...","what_missing":" что вам не хватает!"},"comp/topbar_links":{"about":"О нас","blog":"Блог","bootcamps":"Bootcamps","contact":"Контакты","courses":"Курсы","journey":"Путь","playground":"Песочница"},"comp/user_button":{"get_started":"НАЧАТЬ","start_learning":"НАЧАТЬ УЧИТЬСЯ"},"comp/bottom_section":{"about_link":"О нас","affiliate_link":"Партнерская программа","ai_assistant_link":"ИИ-ассистент","all_courses_link":"Все курсы","app_store":"App Store","attributions_link":"Источники","blog_col_title":"Блог","blog_latest_posts":"Последние публикации","blog_link":"Блог","build_link":"Coddy Build","businesses_link":"Преподаватели","calculators_link":"Калькуляторы","careers_link":"Карьера","certifications_col_title":"Сертификаты","certifications_link":"Сертификации","cheat_sheets_link":"Шпаргалки","company_title":"Компания","concepts_link":"Понятия","contact_link":"Контакт","cookie_policy_link":"Политика использования файлов cookie","copyright_text":"Сделано с ❤️ © {{year}} Coddy","docs_browse_all":"Вся документация","docs_col_title":"Документация","download_on_the":"Загрузите в","embed_link":"Встроить редактор","faqs_link":"FAQ","free_coding_websites_link":"Бесплатные сайты для программирования","get_it_on":"Доступно в","git_commands_cat_branching":"Ветвление","git_commands_cat_inspecting":"Просмотр и очистка","git_commands_cat_merging-rebasing":"Слияние и перебазирование","git_commands_cat_remotes":"Удалённые репозитории","git_commands_cat_setup":"Настройка и конфигурация","git_commands_cat_staging-committing":"Индексация и коммит","git_commands_cat_undoing":"Отмена изменений","git_commands_col_title":"Команды Git","git_commands_link":"Команды Git","google_play":"Google Play","home_link":"Главная","language_label":"Язык: ","languages_title":"Языки","learn_to_code_link":"Научиться программировать","mobile_app_link":"Мобильное приложение","numbers_link":"Числа","openings_link":"Дебюты","play_link":"Играть с компьютером","playground_link":"Playground","playgrounds_title":"Playground","press_link":"Пресса","privacy_policy_link":"Политика конфиденциальности","pseudocode_col_title":"Псевдокод","pseudocode_link":"Редактор псевдокода","reference_link":"Справочник","resources_title":"Ресурсы","sitemap_link":"Карта сайта","spaces_title":"Пространства","support_title":"Поддержка","terms_link":"Условия","tools_col_title":"Инструменты","tools_link":"Инструменты","view_all":"Смотреть все","visualize_cat_data-structures":"Структуры данных","visualize_cat_graphs":"Алгоритмы на графах","visualize_cat_searching":"Поиск","visualize_cat_sorting":"Сортировка","visualize_col_title":"Визуализации","visualize_link":"Визуализации","vs_col_title":"Обзоры и сравнения","vs_view_all":"Смотреть все"},"comp/docs_topbar":{"all_courses_inline":"все курсы","all_docs_inline":"все документы","catalog":"Каталог","docs_button_aria":"Открыть документацию {lang}","explore_docs_by_language":"Просматривайте справочные страницы по языку программирования.","landing_button_aria":"Открыть главную страницу {lang}","playground_button_aria":"Попробовать {lang} в песочнице","programming_language":"Язык программирования","see_all_courses_part2":"или выберите язык выше, чтобы начать обучение.","see_all_part1":"Посмотреть","see_all_part2":"или выберите язык выше, чтобы начать чтение."},"comp/resources_menu":{"about":"О нас","affiliate":"Партнёрская программа","ai_assistant":"ИИ-ассистент","blog":"Блог","businesses":"Бизнес","calculators":"Калькуляторы","certifications":"Сертификаты","cheat_sheets":"Шпаргалки","concepts":"Понятия","contact":"Контакты","courses":"Все курсы","desc_about":"Узнайте о Coddy и команде, стоящей за ним.","desc_affiliate":"Продвигайте Coddy и получайте комиссионные за рефералов.","desc_ai_assistant":"Персональный ИИ-наставник, который объясняет код, помогает с ошибками и даёт подсказки.","desc_blog":"Уроки, руководства и истории от команды Coddy.","desc_businesses":"Coddy для команд - адаптация, обучение и отслеживание инженеров.","desc_certifications":"Получайте сертификаты, которыми можно поделиться, проходя курсы.","desc_cheat_sheets":"Таблицы быстрой справки по языкам и инструментам, которые вы используете.","desc_concepts_chess":"Каждое правило и тактика объяснены на доске, где вы их разыгрываете.","desc_concepts_math":"Каждая идея объясняется тем, что можно потянуть, построить или попробовать.","desc_contact":"Свяжитесь со службой поддержки, отделом партнёрств или прессой.","desc_courses":"Бесплатные интерактивные курсы для каждого языка.","desc_docs":"Справочная документация для каждого поддерживаемого языка.","desc_embed":"Добавьте на свой сайт бесплатный запускаемый редактор кода с помощью одного iframe.","desc_git_commands":"Каждая команда Git, которая вам нужна, с синтаксисом, флагами и примерами.","desc_numbers_math":"Делители, разложение на простые множители и кратные: по странице на число.","desc_openings_chess":"Каждый дебют на доске, на которой вы играете: главная линия, планы и ловушки.","desc_play_chess":"Шесть ботов от новичка до мастера и режим для двоих - бесплатно, с разбором партии.","desc_playground":"Пишите и запускайте код в браузере без настройки.","desc_tools":"Бесплатные утилиты для разработчиков - форматтеры, конвертеры и другое.","desc_tools_chess":"Интерактивные доски и справочники, которые можно попробовать сразу.","desc_tools_math":"Бесплатные калькуляторы с полным пошаговым решением.","desc_visualize":"Смотрите, как алгоритмы и структуры данных работают пошагово.","docs":"Документация","embed":"Встроить редактор","git_commands":"Команды Git","heading":"Ресурсы","numbers":"Числа","openings":"Дебюты","play":"Играть с компьютером","playground":"Песочница","resources":"Ресурсы","tools":"Инструменты","visualize":"Визуализации"},"comp/company_menu":{"about":"О нас","affiliate":"Партнёрская программа","apps":"Мобильное приложение","build":"Coddy Build","businesses":"Преподаватели","careers":"Карьера","company":"Компания","contact":"Контакты","desc_about":"Узнайте о Coddy и команде, стоящей за ним.","desc_affiliate":"Продвигайте Coddy и получайте комиссионные за рефералов.","desc_apps":"Учитесь программировать на iPhone и Android, бесплатно в обоих магазинах.","desc_build":"Создавайте full-stack приложения с ИИ - чат, предпросмотр и публикация.","desc_businesses":"Coddy для преподавателей: назначайте уроки, отслеживайте прогресс и оценивайте автоматически.","desc_careers":"Открытые вакансии, наша миссия и то, каково работать в Coddy.","desc_contact":"Свяжитесь со службой поддержки, отделом партнёрств или прессой.","desc_press":"Логотипы, фирменные цвета, биографии основателей и контакт для прессы.","heading":"Компания","press":"Пресса"},"comp/spaces_menu":{"beta":"Бета","chess":"Шахматы","coding":"Программирование","desc_chess":"Правила, тактика и дебюты, шаг за шагом на доске.","desc_coding":"Пишите и запускайте настоящий код прямо в браузере - от первой строки до готового проекта.","desc_math":"Решайте уравнения ход за ходом и стройте графики от руки: каждый шаг проверяется на интерактивной доске.","math":"Математика","spaces":"Пространства"},"comp/space_catalog":{"catalog":"Каталог","footer_chess":"все курсы по шахматам","hub_heading_chess":"Все курсы по шахматам","hub_paths_heading_chess":"Учебные пути","hub_paths_subheading_chess":"Каждый путь - это маршрут: его курсы в том порядке, в каком их дал бы тренер, а ваш прогресс переносится от одного к другому.","hub_subheading_chess":"Каждый курс проходит на настоящей доске, которая проверяет каждый ход. Начните с правил или сразу перейдите к нужной тактике или эндшпилям.","section_beginner_chess_strategy":"Игра в реальные партии","section_checkmate_patterns":"Матовые шаблоны I","section_chess_rules":"Основы","section_chess_tactical_motifs":"Основные тактические мотивы","section_chess_tactics_for_beginners":"Тактика","section_how_to_checkmate":"Базовые матовые позиции","section_king_and_pawn_endgames":"Король и пешка","see_all_part1":"Смотрите","see_all_part2":"или выберите курс выше, чтобы начать."},"page/learn":{"ai_cta":"Начните это задание с ИИ-наставником Coddy","all_lessons":"Все уроки раздела {section}","aria_breadcrumb":"Хлебные крошки","aria_lessons":"Уроки","board_aria":"Шахматная доска, нажмите на клетку, чтобы ответить","board_check":"Проверить ответ","challenge":"Задание","chess_board_aria":"Шахматная доска, начальная позиция этого задания","chess_checkmate":"Мат!","chess_engine_error":"Движок не смог проверить этот ход здесь. Откройте урок, чтобы сыграть его против заданного соперника.","chess_good_move":"{move}: {why}","chess_kind_find":"Найдите","chess_kind_play":"Играйте","chess_kind_show":"Смотрите","chess_next_move":"Следующий ход","chess_next_position":"Следующая позиция","chess_outline":"Все {count} позиций","chess_position_n":"Позиция {n} из {total}","chess_prev_move":"Предыдущий ход","chess_promote_to":"Преврати пешку в:","chess_prompt_find":"Нажмите на правильное поле.","chess_prompt_play":"Найди лучший ход.","chess_prompt_show":"Пройдите по линии ход за ходом.","chess_reply":"{move}. Ваш ход.","chess_restart":"Начать заново","chess_show_start":"Начальная позиция.","chess_solved_all":"Решено - это был весь набор. Продолжите в уроке, чтобы сохранить прогресс.","chess_solved_more":"Решено. Следующая позиция готова.","chess_start":"Продолжить в уроке","chess_stuck":"Застряли? В уроке есть подсказки и полное решение.","chess_thinking":"Проверяем ваш ход…","chess_wrong":"Здесь есть ход сильнее. Попробуйте ещё раз.","chess_wrong_capture":"Осторожно: {move} заберёт твою фигуру ({piece}).","chess_wrong_mate":"Осторожно: у соперника есть мат ходом {move}.","colour_black":"чёрный","colour_white":"белый","context_line":"Часть раздела {section} путешествия по {language} на Coddy. Урок {i} из {n}.","context_line_course":"Урок {i} из {n} курса {course} на Coddy.","crosslink_playground":"Песочница {language}","crosslink_playground_compiler":"Онлайн-компилятор {language}","editor_title":"Попробуйте сами","list_and":"и","math_goal_choice":"Выберите правильный ответ","math_goal_expand":"Раскройте скобки","math_goal_factor":"Разложите выражение на множители","math_goal_find":"Реши на доске","math_goal_graph":"Постройте график","math_goal_simplify":"Упростите выражение","math_goal_solve":"Выразить {target}","math_start":"Решите шаг за шагом","next_lesson":"Следующий урок","next_section":"Следующий раздел","no_challenge":"В этом уроке нет задания по программированию.","piece_bishop":"слон","piece_king":"король","piece_knight":"конь","piece_pawn":"пешка","piece_queen":"ферзь","piece_rook":"ладья","practice_prompt":"Потренируйтесь самостоятельно:","prev_lesson":"Предыдущий урок","prev_section":"Предыдущий раздел","project_lesson":"Урок-проект","quiz_card_text":"В этом уроке есть небольшой тест. Начните урок, чтобы ответить на вопросы и сохранить прогресс.","quiz_card_title":"Проверьте себя","run_code":"Запустить код","sq_capture":"взятие","sq_correct":"верно","sq_legal":"возможный ход","sq_selected":"выбрано","sq_wrong":"неверно","start_card_text":"Начните урок, чтобы читать его в интерактивном плеере и сохранять прогресс.","start_lesson":"Начать урок","tab_code":"Код","tab_preview":"Просмотр","target_on":"{piece} на {square}","terminal_label":"Терминал","why_captures":"Забирает {piece} на {square}.","why_castles_long":"Делает длинную рокировку и укрывает короля на ферзевом фланге.","why_castles_short":"Рокировкой уводит короля в безопасность.","why_centre":"Занимает {square} — одно из четырёх центральных полей.","why_check":"Он даёт шах, поэтому ответ вынужден.","why_defends":"Защищает {piece} на {square}, которая стояла без прикрытия.","why_develops":"Выводит {piece} с {from} в игру.","why_en_passant":"Берёт пешку на {square} на проходе.","why_escapes_check":"Он отвечает на шах.","why_fork":"{piece} на {square} атакует сразу две цели: {targets}.","why_mate":"Форсирует мат в {moves}.","why_mated":"Проигрывает всё: этот ход держится дольше всех, до мата {moves} ходов.","why_pin":"{piece} на {square} связана: её уход откроет {behind} за ней.","why_promotes":"Пешка превращается в {piece}.","why_quiet":"Силой здесь ничего не взять: это ход, сохраняющий больше всего, и позиция улучшается тихо.","why_sacrifice":"Отдаёт {giving} за {piece} на {square} — движок всё равно считает получившуюся позицию лучшей.","why_saves_piece":"{piece} на {from} была под ударом; {to} — безопасное поле.","why_skewer":"Наносит сквозной удар по {piece} на {square}: как только она уйдёт, падает {behind} за ней.","why_threatens":"Создаёт угрозу {piece} на {square}, которую никто не защищает.","why_wins_piece":"Забирает {piece} на {square}, и взять обратно нечем."},"comp/lesson_dynamic":{"always_skip_quizzes":"Всегда пропускать тесты","challenge":"Челлендж","change_in_settings":"Вы можете изменить это в настройках","completed":"Завершён","diff_beginner":"Новичок","diff_easy":"Легко","diff_expert":"Эксперт","diff_hard":"Сложно","diff_medium":"Средне","dismiss":"ОТМЕНИТЬ","explain_challenge":"Объяснить задание","go_to_block_questions":"Перейти к вопросам блока","go_to_challenge":"Перейти к заданию","go_to_code":"ПЕРЕЙТИ К КОДУ","hide":"Скрыть","hide_audio":"Скрыть аудио","lesson":"Урок","listen":"Слушать","minimize":"Свернуть","minimize_player":"Свернуть плеер","navigate_to_board":"Открыть доску","navigate_to_code_editor":"Перейти в редактор кода","navigate_to_math_workspace":"Открыть рабочую область математики","navigate_to_quiz":"Перейти к тесту","next":"Далее","not_enough_energy":"Недостаточно энергии!","not_enough_tokens":"Недостаточно токенов!","of":"из","pause":"Пауза","play":"Воспроизвести","playback_speed":"Скорость воспроизведения","points":"Очки","prev":"Предыдущий","progress_not_saved":"Ваш прогресс не будет сохранён","question":"Вопрос","questions":"Вопросов","quiz":"Тест","quiz_required":"Пройдите тест, чтобы завершить этот урок","ready_to_start_quiz":"Готовы начать тест?","rehearsal":"Повторение","reset":"Начать сначала","restart_quiz":"ПЕРЕЗАПУСТИТЬ ТЕСТ","restore_player":"Показать аудиоплеер","show":"Показать","show_audio":"Показать аудио","skip":"ПРОПУСТИТЬ","skip_block_questions":"Пропустить тест","skip_confirm_title":"Вы уверены, что хотите пропустить этот тест?","skip_error":"Произошла ошибка","skip_failed":"Не удалось пропустить блоки","skip_quiz":"ПРОПУСТИТЬ ТЕСТ","skipped":"Пропущен","skipping":"Пропускаем...","start_quiz":"НАЧАТЬ ТЕСТ","theory":"Теория","tldr_tooltip":"Слишком длинно; не читал","tts_voice":"Голос TTS","unlock_all_questions":"Разблокируйте все вопросы с Plus","voice_female":"Женский","voice_male":"Мужской","what_is_it":"Что это?"},"comp/bottom_cta":{"continue_coding":"ПРОДОЛЖИТЬ КОДИТЬ","continue_learning":"ПРОДОЛЖИТЬ ОБУЧЕНИЕ","get_started":"НАЧАТЬ","learn_to_code":"Учитесь программировать с Coddy"}},"initialSessionLogged":false,"__N_SSP":true},"page":"/learn/[homeId]/[sectionId]/[lessonId]","query":{"lang":"ru","homeId":"courses","sectionId":"circular_progress_bar__frontend_project","lessonId":"set_up"},"buildId":"TBkg52r-y7WJ1L-iqTcxy","isFallback":false,"isExperimentalCompile":false,"gssp":true,"appGip":true,"scriptLoader":[]}</script></body></html>