火狐 Firefox 70 浏览器将引入 “非活跃 CSS”,快速排查 CSS 属性

2019/9/13 12:03:45 来源:开源中国 作者:h4cd 责编:骑士

在最新的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工具对于前端工程师或者故障排查都能提供极大的便利。

相关文章

关键词:火狐浏览器

软媒旗下网站: IT之家 辣品 - 超值导购,优惠券 IT圈(Win10/WP8.1/Win7论坛) 最会买 - 返利返现优惠券 6655网址之家 Win10之家 Win8之家 Win7之家 Vista之家

软媒旗下软件: 魔方 旗鱼浏览器(极速内核) 云日历 酷点桌面 闪游浏览器(IE内核) Win7优化大师 Win8优化大师 Win10优化大师 软媒手机APP应用