naming nav dropdown with bem

∥☆過路亽.° 提交于 2020-01-07 06:56:07

问题


which it is the best way to naming a dropdown menu with bem ?? use children nav-main__sub or modifier nav-main--sub ??

<ul class="nav nav-main">
<li class="nav__item">
    <a href="#" class="nav__link is-active">home</a>
</li>
<li class="nav__item nav__item--sub-nav">
    <a href="#" class="nav__link">About</a>
    <ul class="nav nav-main--sub">             
        <li class="nav-main--sub__item">
            <a href="#" class="nav-main--sub__link">Company</a>
        </li>
    </ul>
<li class="nav__item">
        <a href="#" class="nav__link">Contact</a>
</li>


回答1:


IMHO nav-main__sub, because it is not modifier.

<ul class="nav nav--main">
    <li class="nav__item nav__item--sub-nav">
        <a href="#" class="nav__link">About</a>
        <ul class="nav nav-main__sub">             
            <li class="nav-main__sub-item">
                <a href="#" class="nav-main__sub-link">Company</a>
            </li>
        </ul>
    </li>
</ul>

or easier:

<ul class="nav nav--main">
    <li class="nav__item nav__item--sub-nav">
        <a href="#" class="nav__link">About</a>
        <ul class="sub">             
            <li class="sub__item">
                <a href="#" class="sub__link">Company</a>
            </li>
        </ul>
    </li>
</ul>


来源:https://stackoverflow.com/questions/32297501/naming-nav-dropdown-with-bem

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!