Disallow overqualified elements (不允许 过度定义选择器)

文章为csslint中文版译文,点击原文可查看英文版,如遇到翻译错误或错别字啥的,请留言指出~ 译文内容不定期更新~ 返回目录

编写如li.active选择器是不必要的,除非 不同的元素名称,在使用相同类名下 需要展示不同的样式。多数情况下,在选择器中移除元素名称更为妥当,不仅减小了CSS文件的体积,同时也提升了选择器的性能(不须再次匹配元素)。

移除元素名称也同时降低了CSS与HTML的耦合度,允许你改变元素使用的样式类,而不需要更新CSS样式文件。

规则详情

规则 ID: overqualified-elements

此规则意在 移除冗余不必的选择器总而减少数据大小。为此,警告出现在 元素名称与类名同时使用时(如 li.active)。如果,两个不同的元素使用了相同的类名(如 li.active p.active) 将 不会提示警告。

以下示例 提示警告:

div.mybox {
    color: red;   
}

.mybox li.active {
    background: red;
}

以下示例将 不提示警告:

/* Two different elements in different rules with the same class */
li.active {
    color: red;
}

p.active {
    color: green;
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1.CSS 元素选择器 最常见的 CSS 选择器是元素选择器。换句话说,文档的元素就是最基本的选择器。如果设置 H...
    饥人谷_小侯阅读 885评论 0 1
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,009评论 19 139
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,815评论 1 92
  • 本文转载自:众成翻译译者:为之漫笔链接:http://www.zcfy.cc/article/239原文:http...
    极乐君阅读 7,417评论 1 62
  • 在2016年以前,我想在网上找到优质课程很难。即使有,也局限于传播范围小而无缘遇到。自从2016年开始,网络上各种...
    小英成长手札阅读 631评论 2 9