Font Awesome 图标的 CSS 特性

标签 css sass

我正在从 icon--apply 而不是 .classname__icon--apply 中选取我的图标颜色。这不违反 CSS 特异性规则吗?我在这里遗漏了什么吗?

最佳答案

您将 BEM 与特定性混淆了。

不要把特异性想成一套规则,它更像是一种机制。一种决定哪条规则应该比其他规则更重要的机制。

There's a whole bunch of selectors but for our purposes, we can break it down into three types, of increasing importance:

  1. Element selectors (and pseudo-element selectors) Eg. p {color:red;}
  2. Class selectors (and attribute selectors) Eg. .myclass {color:red;}
  3. ID selectors. Eg. #myid {color:red;}

https://snook.ca/archives/html_and_css/understanding_c

BEM 是 CSS 类的命名约定。 您可以决定是否要使用它。这是可选的。

The Block, Element, Modifier methodology (commonly referred to as BEM) is a popular naming convention for classes in HTML and CSS. Developed by the team at Yandex, its goal is to help developers better understand the relationship between the HTML and CSS in a given project.

https://css-tricks.com/bem-101/

另一个命名约定是 Atomic CSS,您可以在其中使用许多小型的单一用途类 - 例如 .color-red。 您可以在这里阅读更多相关信息:https://css-tricks.com/lets-define-exactly-atomic-css/

关于Font Awesome 图标的 CSS 特性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48794060/

相关文章:

css - 如何使用预建的 Angular Material 主题的颜色?

html - 在触摸设备上 : Apply a background color change when user touches heading

html - 如何在悬停时为元素设置动画

html - Bootstrap 不佳的网站页脚

html - 匹配 anchor 和 div 悬停状态的选择器不匹配超链接

html - BEM 与全局重置

sass - Sass 可以计算包含数学表达式的字符串吗?

html - IFrame响应问题

ruby-on-rails - Rails 为什么需要 .css.scss 和 .html.haml?

css - 是否可以将空字符串设置为 sass 中的类选择器?