gpt4 book ai didi

css - BEM 与命名元素的混淆

转载 作者:技术小花猫 更新时间:2023-10-29 11:09:57 34 4
gpt4 key购买 nike

<分区>

我一直在一个元素中使用 BEM 来使我的 CSS 更加模块化,并且遇到了一些我觉得需要澄清的情况:

上下文相关的样式。我不断遇到需要更改依赖于父项上的类的模块/组件的样式。

假设我正在设计产品列表。我有我的 .product-list组件和里面我所有的.product-list__item的。 .product-list__item然后可能有一个 <h3>里面作为产品标题。

我的问题是:

  • 应该 .product-list__item还有一类 .item ?

  • 产品中的标题是否应具有以下类:

    • .item__title
    • .product-list__item__title

假设该元素还有一个描述框,其中包含价格:

  • 描述是否应该:
    • .item__description
    • .product-list__item__description
  • 价格应该有:

    • .item__description__price
    • .description__price
    • .price

我做子组件需要单独添加它们自己的组件名称,即:.item.description .我猜他们需要它们,因为他们还能在哪里应用他们的样式?

另外,如果我有上面的,我会得到一个 .product-list组件 whcihsounds 不错,但如果子组件将自己的组件名称添加为类,例如 .item那么这不是很能描述它本身吗?

我知道它们听起来可能很复杂,但我很认真地在这里感到困惑,并且很想听听您的意见。我已经阅读了大量关于 BEM 的文章,但没有一篇解释这类事情。

尼尔

34 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com