控制台：控制台艺术字 & 为控制台输出增加样式（console.log( )）

控制台/代码文档LOGO

除了知乎的控制台，大部分的代码文档都有这样的字符logo。

下面这个网站可以自动生成符号艺术字：

控制台输出通过多行 log 语句或者 \n 转义字符换行，如果用的是联想功能强大的编码工具，只需 CTRL CV 就好了

如果是放在代码里直接用注释符包裹即可

控制台输出样式

通过 %c 来开始一个结点，可以理解为一个样式生效的元素标签，%c没有结束符，如果后半节需要使用控制台默认样式，只需要在后半节的开始部分加上 %c ，并加上一个空的CSS字符串 console.log(\'%c ho %c me\', \'color: red\', \' \')

再以类似数组指针的方式，在log语句中加入css代码，用引号包裹。

console.log(\'%c 应急食品的百种烹饪方式 \n\' +
        \'%c                       ——正义人 \', \'color: #333\', \'color: #999\')

除了color以外可以还可以使用任何非浏览器内核提供的CSS、CSS3样式，甚至可以将自己的照片输出在控制台。

需要注意的是几个开始符就写几套样式，否则后面未定义样式的节段都会应用最后一个定义的样式，且未定义样式的 %c 也会被当成字符输出打印出来。

console.log(\'%c _____________________________\n\' +
        \'%c   ______     %c______     %c__  __    \n\' +
        \'%c  /\\___  \\   %c/\\___  \\   %c/\\_\\_\\_\\   \n\' +
        \'%c  \\/_/  /__  %c\\/_/  /__  %c\\/_/\\_\\/_  \n\' +
        \'%c    /\\_____\\   %c/\\_____\\   %c/\\_\\/\\_\\ \n\' +
        \'%c    \\/_____/   %c\\/_____/   %c\\/_/\\/_/\n\' +
        \'%c       _____________________________\n\' +
        \'   \',\'color:#ff0000\',\'color:#ff0000\',\'color:#ff3b00\',\'color:#ff7500\',\'color:#ff7800\',\'color:#FD7B00\',\'color:#FFAD00\',\'color: #FEDA00\',\'color:#D0FD00\',\'color:#93FF00\',\'color:#80FF00\',\'color:#1AFF00\',\'color:#00FF2E\',\'color:#00FF3B\',\'color:#00FFB1\',\'color:#00F2F9\',\'color:#00E0F9\')

控制台/代码文档LOGO

控制台输出样式

- END -