美文网首页
自定义console.log字体样式

自定义console.log字体样式

作者: AmazingMax | 来源:发表于2017-09-04 10:09 被阅读35次

    我看到有意思的网站喜欢按下F12去看下页面的内容,偶然会在控制台发现一些字有的大有的小,有的红有的绿。哇!他们怎么做到的?好神奇!我要学会它!QAQ于是充满好奇心的我,又打开了度娘(●'◡'●)

    改变控制台的字体样式

    直接分享给你们我理解后的方法啦~
    代码很简单:

    1.最简单的例子

    改变单个句子的颜色:



    代码如下:

    console.log("%c 我怎么红了?", "color:red")
    

    2.改变多个样式

    改变多个句子的颜色:



    代码如下:

    console.log('%c橙' + '%c绿' + '%c蓝', 'color:orange', 'color:green', 'color:blue');
    

    这个方法不仅仅限于改变字体颜色,还可以改变字体大小,背景颜色,背景图片、文字描边等等。
    从此我们的控制台不再单调~(●'◡'●)

    相关文章

      网友评论

          本文标题:自定义console.log字体样式

          本文链接:https://www.haomeiwen.com/subject/shbsjxtx.html