Сообщество IT-специалистов
Ответы на любые вопросы об IT
Профессиональное развитие в IT
Удаленная работа для IT-специалистов
<!DOCTYPE html><html class="ua_js_no"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><title>БЭМ</title><script>(function(e,c){e[c]=e[c].replace(/(ua_js_)no/g,"$1yes");})(document.documentElement,"className");</script><link rel="stylesheet" href="//fonts.googleapis.com/css?family=Open+Sans:300,600,700&subset=cyrillic"><link rel="stylesheet" href="/index.min.css"><meta name="viewport" content="width=device-width,initial-scale=1"><meta property="og:image" content="https://ru.bem.info/og_image/logo_theme_stripe.png"><meta property="og:url" content="/"><meta property="og:type" content="article"><meta property="og:description" content="БЭМ"><meta property="og:keywords" content=""><link rel="shortcut icon" href="/favicon.ico"></head><body class="page"><div class="header i-bem" data-bem='{"header":{}}'><div class="header__layout"><span class="logo header__logo"><svg class="logo__logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 101.7 84"><path d="M0 13h23.8v7H0zM0 0h23.8v7H0zm42.7 25.9H0v7h41.1c4.5 0 15 .1 18.9 6.4v-3.9c-1.9-6.2-7.5-9.5-17.3-9.5zm.1 13H0v7h41.1c10 0 16.3.4 18.9 1.8v-3.1c-2-4.9-10.4-5.7-17.2-5.7zm-.1 33H0v-7h41.1c4.5 0 15-.1 18.9-6.4v3.9c-1.9 6.2-7.5 9.5-17.3 9.5zm.1-13H0v-7h41.1c10 0 16.3-.4 18.9-1.8v3.1c-2 4.9-10.4 5.7-17.2 5.7zM70.4 84h31.4v-4.3H71.3c-2.7 0-9.1-.1-11.4-3.8v2.4C61 82 64.4 84 70.4 84zm-.1-7.9h31.4v-4.3H71.3c-6.1 0-9.9-.2-11.4-1.1v1.9c1.2 3 6.3 3.5 10.4 3.5z"/></svg></span><ul class="lang-switcher header__lang"><li class="lang-switcher__item"><a class="lang-switcher__link" href="//en.bem.info/">en</a></li><li class="lang-switcher__item lang-switcher__item_current">ru</li><li class="lang-switcher__item"><a class="lang-switcher__link" href="//uk.bem.info/">uk</a></li></ul><a class="header__forum" href="/forum/">Форум</a></div><div class="search header__search i-bem" data-bem='{"search":{}}'><form class="form search__form i-bem" data-bem='{"form":{}}' action="https://yandex.ru/sitesearch"><span class="input input_type_search i-bem" data-bem='{"input":{}}'><span class="input__box"><input class="input__control" name="text" placeholder="Искать" autocomplete="off" type="search"></span></span><input type="hidden" name="reqenc"><input type="hidden" name="searchid" value="1944806"><input type="hidden" name="l10n" value="ru"><div class="search-icon search__submit"><svg viewBox="0 0 17 17" xmlns="http://www.w3.org/2000/svg"><circle cx="7" cy="7" r="6"/><path d="M11 11l5 5"/></svg></div></form></div><div class="header__menu"><ul class="breadcrumbs header__breadcrumbs"></ul></div><div class="header__toggle search-icon"><span class="header__toggle-line"></span></div></div><div class="sitemap"><div class="sitemap__section sitemap__section_site_methodology"><h1 class="sitemap__title sitemap__title_site_methodology"><a class="sitemap__link" href="/methodology/">Методология</a></h1><ul class="sitemap__tree"><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/methodology/quick-start/">Быстрый старт</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/methodology/key-concepts/">Основные понятия</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/methodology/naming-convention/">Соглашение по именованию</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/methodology/css/">CSS</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/methodology/js/">JavaScript</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/methodology/js-principles/">Особенности JavaScript</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/methodology/filestructure/">Файловая структура</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/methodology/build/">Сборка</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/methodology/declarations/">Декларации</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/methodology/solved-problems/">Какие проблемы решает</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/methodology/history/">История создания</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/methodology/articles/">Статьи</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/methodology/faq/">FAQ</a></li></ul></div><div class="sitemap__section sitemap__section_site_toolbox"><h1 class="sitemap__title sitemap__title_site_toolbox"><a class="sitemap__link" href="/toolbox/">Инструментарий</a></h1><ul class="sitemap__tree"><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/toolbox/enb/">ENB</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-bem-techs/">enb-bem-techs</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-js/">enb-js</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-modules/">enb-modules</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-css/">enb-css</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-stylus/">enb-stylus</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-bemxjst/">enb-bemxjst</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-bh/">enb-bh</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-bem-i18n/">enb-bem-i18n</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-borschik/">enb-borschik</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-bem-specs/">enb-bem-specs</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-bem-tmpl-specs/">enb-bem-tmpl-specs</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-bem-examples/">enb-bem-examples</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-bem-docs/">enb-bem-docs</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-magic-platform/">enb-magic-platform</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/enb/enb-magic-factory/">enb-magic-factory</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/toolbox/bemhint/">bemhint</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/bemhint/css-naming/">CSS именование</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/bemhint/fs-naming/">Именование файлов</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/bemhint/deps-schema/">DEPS схема</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/bemhint/deps-specification/">DEPS спецификация</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/toolbox/bem-tools/">bem-tools</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/toolbox/bemmet/">bemmet</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/toolbox/sdk/">SDK</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/sdk/bem-naming/">bem-naming</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/sdk/bem-config/">bem-config</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/sdk/bem-fs-scheme/">bem-fs-scheme</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/sdk/bem-deps/">bem-deps</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/toolbox/sdk/bem-walk/">bem-walk</a></li></ul></div><div class="sitemap__section sitemap__section_site_platform"><h1 class="sitemap__title sitemap__title_site_platform"><a class="sitemap__link" href="/platform/">Платформа</a></h1><ul class="sitemap__tree"><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/platform/bemjson/">Данные (BEMJSON)</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/platform/bem-xjst/">Шаблоны (BEMHTML, BEMTREE)</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/bem-xjst/quick-start/">Быстрый старт</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/bem-xjst/api/">API</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/bem-xjst/templates-syntax/">Синтаксис шаблонов</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/bem-xjst/templates-context/">Контекст</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/bem-xjst/runtime/">Runtime</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/platform/i-bem/">Клиентский JavaScript (i-bem.js)</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/i-bem/overview/">Общие сведения</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/i-bem/html-binding/">Привязка JS-блоков к HTML</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/i-bem/declaration/">Декларация блока</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/i-bem/parameters/">Передача параметров</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/i-bem/dom/">Работа с DOM-деревом</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/i-bem/states/">Состояния блока</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/i-bem/collections/">Коллекции</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/i-bem/events/">События</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/i-bem/init/">Инициализация</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/i-bem/interaction/">Взаимодействие блоков</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/i-bem/context/">Контекст</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/i-bem/extras/">Что дальше?</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/platform/deps/">Зависимости</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/platform/deps-spec/">Спецификация DEPS</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/platform/project-stub/">Заготовка проекта</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/platform/libs/">Библиотеки</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/libs/bem-core/">bem-core</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/libs/bem-components/">bem-components</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/libs/bem-history/">bem-history</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/libs/principles/">Принципы разработки БЭМ-библиотек</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/platform/tutorials/">Учебные материалы</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/tutorials/quick-start-static/">Собираем статическую страницу</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/tutorials/start-with-project-stub/">Создаём свой проект на БЭМ</a></li><li class="sitemap__tree-item-2"><a class="sitemap__link" href="/platform/tutorials/i-bem/">Справочное руководство по i-bem.js</a></li></ul></div><div class="sitemap__section sitemap__section_site_community"><h1 class="sitemap__title sitemap__title_site_community"><a class="sitemap__link" href="/community/">Сообщество</a></h1><ul class="sitemap__tree"><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/blog/">Блог</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/events/">События</a></li><li class="sitemap__tree-item-1"><a class="sitemap__link" href="/forum/">Форум</a></li></ul></div></div><div class="content"><h1 class="index-title"><strong class="bem">БЭМ</strong></h1><div class="promo-crossroad"><dl class="promo-crossroad__item"><dt class="promo-crossroad__title"><a class="promo-crossroad__title-link" href="methodology/"><img class="promo-crossroad__img" src="/S3zKVZJcFfltyiAz-bWVmw4o3IU.svgd">Методология</a></dt><dd class="promo-crossroad__text">Идея и архитектура</dd></dl><dl class="promo-crossroad__item"><dt class="promo-crossroad__title"><a class="promo-crossroad__title-link" href="toolbox/"><img class="promo-crossroad__img" src="/f-jE7H4ljUTNv_ivcH5gSvV2h2U.svg">Инструментарий</a></dt><dd class="promo-crossroad__text">Инструменты и SDK</dd></dl><dl class="promo-crossroad__item"><dt class="promo-crossroad__title"><a class="promo-crossroad__title-link" href="platform/"><img class="promo-crossroad__img promo-crossroad__img_type_round" src="/UkC0yRpjS421DGQJVLY7NzcCQT0.svgd">Платформа</a></dt><dd class="promo-crossroad__text">Готовая реализация</dd><dd class="promo-crossroad__text"><a class="promo-crossroad__text-link" href="platform/tutorials/quick-start-static/">Быстрый старт</a></dd></dl><dl class="promo-crossroad__item"><dt class="promo-crossroad__title"><a class="promo-crossroad__title-link" href="community/"><img class="promo-crossroad__img promo-crossroad__img_type_out-of-box" src="/MM1-tuvSlHrNkiFtyWjYeNVfvBM.svgd">Сообщество</a></dt><dd class="promo-crossroad__text">Люди и события</dd></dl></div></div><footer class="footer"><div class="legos legos_inverted_white"><div class="legos__lego legos__lego_height_4 legos__lego_width_2"></div><div class="legos__lego legos__lego_height_3 legos__lego_width_2"></div><div class="legos__lego legos__lego_height_2 legos__lego_width_2"></div><div class="legos__lego legos__lego_height_3 legos__lego_width_2"></div><div class="legos__lego legos__lego_height_2 legos__lego_width_6"></div><div class="legos__lego legos__lego_height_3 legos__lego_width_6"></div><div class="legos__lego legos__lego_height_4 legos__lego_width_6"></div><div class="legos__lego legos__lego_height_2 legos__lego_width_4"></div><div class="legos__lego legos__lego_height_3 legos__lego_width_2"></div><div class="legos__lego legos__lego_height_2 legos__lego_width_4"></div><div class="legos__lego legos__lego_height_3 legos__lego_width_7"></div><div class="legos__lego legos__lego_height_1 legos__lego_width_4"></div><div class="legos__lego legos__lego_height_3 legos__lego_width_3"></div><div class="legos__lego legos__lego_height_2 legos__lego_width_2"></div><div class="legos__lego legos__lego_height_4 legos__lego_width_3"></div><div class="legos__lego legos__lego_height_3 legos__lego_width_3"></div><div class="legos__lego legos__lego_height_2 legos__lego_width_1"></div><div class="legos__lego legos__lego_height_3 legos__lego_width_4"></div><div class="legos__lego legos__lego_height_2 legos__lego_width_6"></div><div class="legos__lego legos__lego_height_3 legos__lego_width_4"></div><div class="legos__lego legos__lego_height_4 legos__lego_width_3"></div><div class="legos__lego legos__lego_height_2 legos__lego_width_4"></div><div class="legos__lego legos__lego_height_1 legos__lego_width_2"></div><div class="legos__lego legos__lego_height_2 legos__lego_width_4"></div><div class="legos__lego legos__lego_height_3 legos__lego_width_7"></div><div class="legos__lego legos__lego_height_1 legos__lego_width_4"></div><div class="legos__lego legos__lego_height_3 legos__lego_width_3"></div><div class="legos__lego legos__lego_height_4 legos__lego_width_2"></div></div><div class="footer__layout"><ul class="footer__community"><li class="footer__channel"><a class="footer__channel-link" href="https://web-standards.slack.com/messages/bem/">Slack</a></li><li class="footer__channel"><a class="footer__channel-link" href="https://telegram.me/bem_ru">Telegram</a></li><li class="footer__channel"><a class="footer__channel-link" href="https://www.facebook.com/groups/bem.info/">Facebook</a></li><li class="footer__channel"><a class="footer__channel-link" href="https://twitter.com/bem_ru/">Twitter</a></li></ul><div class="footer__domain">Ядвига и Яцек Даниц — спасибо за домен!</div><div class="footer__copyright"><strong class="bem">БЭМ</strong> с гордостью сделан в <a class="footer__copyright-ya" href="https://yandex.ru/company/">Яндексе</a></div></div></footer><script>(function (d, w, c) { (w[c] = w[c] || []).push(function() { try { w.yaCounter16972024 = new Ya.Metrika({"id":"16972024","webvisor":true,"clickmap":true,"trackLinks":true,"accurateTrackBounce":true}); } catch(e) { } }); var n = d.getElementsByTagName("script")[0], s = d.createElement("script"), f = function () { n.parentNode.insertBefore(s, n); }; s.type = "text/javascript"; s.async = true; s.src = (d.location.protocol == "https:" ? "https:" : "http:") + "//mc.yandex.ru/metrika/watch.js"; if (w.opera == "[object Opera]") { d.addEventListener("DOMContentLoaded", f, false); } else { f(); } })(document, window, "yandex_metrika_callbacks");</script><noscript><div><img src="//mc.yandex.ru/watch/16972024" style="position:absolute; left:-9999px;"></div></noscript><script src="/index.ru.min.js"></script></body></html>
