Обязательно ли применять имя класса к каждому элементу в HTML при использовании соглашения о присвоении имен BEM (Block, Element, Modifiers)? - PullRequest
0 голосов
/ 27 декабря 2018

Я пытаюсь привести в действие соглашение об именах BEM, но у меня возникли некоторые затруднения с именами элементов HTML.Я действительно хочу понять, нужно ли мне предоставлять имя класса для каждого элемента HTML.

Допустим, у меня есть следующий код, например:

<ul class="nav">
    <li class="nav__list"><a href="#" class="nav__link>Home</a></li>
    <li class="nav__list"><a href="#" class="nav__link>Services</a></li>
</ul>

Я не хочуприменить CSS к элементам <li>.Итак, в этом случае мне нужно использовать имя элемента для тега <li>.то есть <li class="nav__list">...</li>?

Могу ли я просто использовать имя элемента для тега привязки без указания имени элемента nav__list для элемента <li>?

Вот что я думаю сделать, потому что я нехотите применить стили к CSS для <li>:

<ul class="nav">
    <li><a href="#" class="nav__link>Home</a></li>
    <li><a href="#" class="nav__link>Services</a></li>
</ul>

1 Ответ

0 голосов
/ 27 декабря 2018

Прежде всего, вы должны следовать БЭМ большинству разработчиков, которые следуют БЭМ только потому, что БЭМ хорош в соглашении об именах и показывает стандартное соглашение об именах для кодирования.это зависит от вас, если вы хотите использовать БЭМ, который вы можете использовать, или же это ваше желание, но я советую вам следовать БЭМ, это хорошо в стандарте.

вы также можете использовать это

<ul class="nav">
  <li class="nav__list"><a href="#" class="nav__link>Home"></a></li>
  <li class="nav__list"><a href="#" class="nav__link>Services"></a></li>
</ul>

как этот

<ul class="nav">
  <li><a href="#" class="nav__link>Home"></a></li>
  <li><a href="#" class="nav__link>Services"></a></li>
</ul>

теперь вы не хотите придавать стиль li, но в будущем клиент скажет, что вы хотите придать li стиль в то время, что вы будете делать снова, вы измените код, поэтому вам придетсяиспользуйте это ниже HTML code

<ul class="nav">
  <li class="nav__list"><a href="#" class="nav__link>Home"></a></li>
  <li class="nav__list"><a href="#" class="nav__link>Services"></a></li>
</ul>
...