javascript - 如何在 console.log 中设置文本背景颜色的样式?

标签 javascript google-chrome google-chrome-devtools console.log

我正在尝试设置 console.log() 的样式消息,使其看起来更好(背景颜色,文本颜色等......)。

我正在使用以下代码:

console.log('%c Created by' + '%c www.google.com', 'background: #13212E; color: #FFF; padding: 5px 10px;', 'background: #05E5C8; color: #13212E; padding: 5px 10px;');

Chrome 控制台中的输出如下:

Console.log() output

如您所见,它几乎是完美的,但是 color样式未应用于链接('www.google.com'),我还想删除白色背景。

有没有办法为 console.log() 中的链接设置这些属性的样式?信息?

最佳答案

const colors = {
 Reset: "\x1b[0m",
 Bright: "\x1b[1m",
 Dim: "\x1b[2m",
 Underscore: "\x1b[4m",
 Blink: "\x1b[5m",
 Reverse: "\x1b[7m",
 Hidden: "\x1b[8m",
 fg: {
  Black: "\x1b[30m",
  Red: "\x1b[31m",
  Green: "\x1b[32m",
  Yellow: "\x1b[33m",
  Blue: "\x1b[34m",
  Magenta: "\x1b[35m",
  Cyan: "\x1b[36m",
  White: "\x1b[37m",
  Crimson: "\x1b[38m"
 },
 bg: {
  Black: "\x1b[40m",
  Red: "\x1b[41m",
  Green: "\x1b[42m",
  Yellow: "\x1b[43m",
  Blue: "\x1b[44m",
  Magenta: "\x1b[45m",
  Cyan: "\x1b[46m",
  White: "\x1b[47m",
  Crimson: "\x1b[48m"
 }
};

console.log(colors.bg.Blue, colors.fg.White , "'%c Created by' + '%c www.google.com'", colors.Reset);

关于javascript - 如何在 console.log 中设置文本背景颜色的样式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56073946/

相关文章:

javascript - 使用javascript从管道分隔的字符串中提取键和值

javascript - javascript中的拆分方法?

macos - Chrome 开发人员工具不会检查 body 标签中的元素 (mac OSX)

javascript - 从javascript中的对象数组访问绑定(bind)函数

javascript - 自定义 gmap 样式的地形选项?

javascript - getObject 模拟返回 0 字节文件

javascript - 使用 JavaScript 切换/警告浏览器选项卡

javascript - getUserMedia API无法从Chrome扩展程序捕获音频和视频

javascript - 如何使用 Jquery 从其他网站的抓取 HTML 代码中选择所有 div?

javascript - 未捕获的类型错误 : Cannot read property 'chooseEntry' of undefined (while developing a chrome extension using fileSystem API)