您的位置:首页 > Web前端 > CSS

CSS不起作用?Firefox 70将引入“非活跃CSS”快速排查CSS属性

2019-09-15 22:12 1726 查看

在最新的 Firefox 70 Beta 版本中,引入了一项名为“Inactive CSS”(非活跃 CSS)的功能,DevTool 新工具将为开发者展示哪些 CSS 属性不会影响所选元素以及原因,这将大大节省开发者的时间。

具体情况是,当选中一个元素时,元素的 CSS 属性如果对其没有影响,那么这个属性旁边会显示一个信息框,说明其不会起作用,并且解释原因。以上图为例:flex-grow 的设置不会在 .outer-wrapper 中生效,因为它不是一个 flex 项。此外,信息框中还会给出改进建议。

此前 Firefox 在 v65 中也引入一项新奇的 CSS 功能  Flexbox Inspector。
Flexbox Inspector 可以帮助开发者了解 CSS Flebox 元素的大小、位置与嵌套情况。只要开发者在标记视图中选定了 Flex 容器或其它元素,那么就会自动出现 Flexbox 信息,开发者可以在布局面板中的 Inspector 标签下看到相应内容。

这些 CSS 工具对于前端工程师或者故障排查都能提供极大的便利,具体情况可以查看「阅读原文」

开源中国征稿啦!


开源中国 www.oschina.net 是目前备受关注、具有强大影响力的开源技术社区,拥有超过 400 万的开源技术精英。我们传播开源的理念,推广开源项目,为 IT 开发者提供一个发现、使用、并交流开源技术的平台。


现在我们开始对外征稿啦!如果你有优秀的技术文章想要分享,热点的行业资讯需要报道等等,欢迎联系开源中国进行投稿。投稿详情及联系方式请参见:我要投稿

推荐阅读

华为 MateBook 预装深度 Linux 操作系统

Dart 2.5 发布,支持 Dart 与 C 相互调用

谷歌开发者大会上,开源了一个超强项目 ElasticDL

Flutter 1.9 稳定版发布:开发跨平台应用更方便

云时代全新编程语言 Ballerina 发布 1.0 版本

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: