Chrome控制台生效的CSS样式在Firefox中失效问题咨询

这是Firefox本身的功能限制，不需要额外开启设置。

Firefox控制台对%c指令支持的CSS属性范围比Chromium内核浏览器窄，border-radius、padding-block这类属性目前不在官方支持的列表中。

替代方案 #

• 对于padding-block，可以用padding-top和padding-bottom分别设置上下内边距，Firefox控制台支持这类单方向的padding属性。
• 对于border-radius，目前没有直接替代方案，只能接受Firefox控制台无法渲染圆角的现状，或者改用Chromium内核浏览器调试带这类样式的控制台输出。

测试代码 #

console.log('%c Hello, World!', 'background:linear-gradient(45deg,#FF0099,#493240);padding:5px;font-weight:900;border-radius:5px;')

内容的提问来源于stack exchange，提问作者Abid Hasan