被滥用的 inherit

今天调样式，被 inherit 坑了一把。

这份 CSS 样式原来是这样写的

你能想到的所有标签 {
	font: inherit;
}

然后我看了半天一段文字的样式，永远是粗体，但是我从 chrome styles 里怎么也看不出来，这个样式是怎么加上去的，从 computed 里才发现，样式来自这行全局的 font: inherit。（computed 真是神器，特别是代码不规范的情况下）

我第一感觉 inherit 被滥用了。你想，整个页面里的 font 属性都要继承祖先的样式，这算哪门子的逻辑。。。

MDN 的一个例子，就很好

/* 头变绿 */
 h2 { color: green; }

 /* 随爹，头不一定变绿 */
 #sidebar h2 { color: inherit; }

特定的子元素与父级元素保持一致，这种应用场景就好理解多了。

关于作者 🌱

我是来自山东烟台的一名开发者，有敢兴趣的话题，或者软件开发需求，欢迎加微信 zhongwei 聊聊，查看更多联系方式

相关文章 🔍

生活	跑步清单足球鲁班探索孤独的美食家驾驶电视剧收纳奶爸健康 game 电影周末
Geek	健身 Laravel Git Vim MySQL Linux UI Windows SVN 纪录片管理 Shell 游记工具手机 BackboneJS 自建博客 Mac DNS Tornado CDN Django Python AngularJS 理财前端 Nginx 爬虫 Redis Javascript Browser 浏览器推广 OAuth CSS PHP Social Networks 安全运维创业杂记 VueJS Android Image IDE Java ReactJS 数据分析 SQLite RESTful 读书笔记家电 ecshop Vagrant wordpress docker SEO GTD magento mongodb nodejs weex 冷知识 ruby iOS 微信小程序 AI CMS 快应用 backpack 广告联盟 OA 短信 UWP Win CSharp Tampermonkey graphviz 钉钉 WPS 数据字典微信公众号 Fuchsia Adobe XD SQL Server thinkphp 代码规范商业模式 Flutter 头痛的问题 serverless 视频制作国际化 golang 服务器 Kotlin 网站建设 5G 笔记本图片 spark spring 物联网 InfluxDB 图像识别 postgre rust
成长的烦恼	闲言碎语待产不睡觉写作程序员孙心然语录原则大鸿语录
地球	植物时间中文赚钱国家地理烟台一生伏首拜阳明 emoji 弟子规英文国际贸易

生活

跑步清单足球鲁班探索孤独的美食家驾驶电视剧收纳奶爸健康 game 电影周末

Geek

健身 Laravel Git Vim MySQL Linux UI Windows SVN 纪录片管理 Shell 游记工具手机 BackboneJS 自建博客 Mac DNS Tornado CDN Django Python AngularJS 理财前端 Nginx 爬虫 Redis Javascript Browser 浏览器推广 OAuth CSS PHP Social Networks 安全运维创业杂记 VueJS Android Image IDE Java ReactJS 数据分析 SQLite RESTful 读书笔记家电 ecshop Vagrant wordpress docker SEO GTD magento mongodb nodejs weex 冷知识 ruby iOS 微信小程序 AI CMS 快应用 backpack 广告联盟 OA 短信 UWP Win CSharp Tampermonkey graphviz 钉钉 WPS 数据字典微信公众号 Fuchsia Adobe XD SQL Server thinkphp 代码规范商业模式 Flutter 头痛的问题 serverless 视频制作国际化 golang 服务器 Kotlin 网站建设 5G 笔记本图片 spark spring 物联网 InfluxDB 图像识别 postgre rust

成长的烦恼

闲言碎语待产不睡觉写作程序员孙心然语录原则大鸿语录

地球

植物时间中文赚钱国家地理烟台一生伏首拜阳明 emoji 弟子规英文国际贸易