如何在浏览器控制台(console)里输出彩色样式调试信息
console.log(XX,XX,XX)
log 的第一个参数声明第二、第三个参数的作用，第二个参数就是样式，第三个参数是要输出的字符串
console.log("%c%s",
"color: green; font-size: 100px;font-weight:bolder",
"ABC");
console.log('\n ██████\n ██ ██\n ██ ██\n ██ ██ ████\n ██████ ██ ██\n ██ ██ ████████\n ██ ██ ██\n ██ ██ ████\n\n');
var t="%c%s",i="color:green;text-shadow:15px 15px 5px #fff, 15px 15px 10px #373E40, 15px 15px 15px #A2B4BA, 15px 15px 30px #82ABBA;font-weight:bolder;font-size:15px";
var a="color:#495A80;text-shadow: 0 1px 0 #ccc,0 2px 0 #c9c9c9,0 1px 0 #bbb;font-size:20px";
var s=" iiii QQQQQQQQQ iiii iiii\n"+"i::::i QQ:::::::::QQ i::::i i::::i\n"+" iiii QQ:::::::::::::QQ iiii iiii\n"+" Q:::::::QQQ:::::::Q\n"+"iiiiiii Q::::::O Q::::::Q iiiiiii yyyyyyy yyyyyyy iiiiiii\n"+"i:::::i Q:::::O Q:::::Q i:::::i y:::::y y:::::y i:::::i\n"+" i::::i Q:::::O Q:::::Q i::::i y:::::y y:::::y i::::i\n"+" i::::i Q:::::O Q:::::Q i::::i y:::::y y:::::y i::::i\n"+" i::::i Q:::::O Q:::::Q i::::i y:::::y y:::::y i::::i\n"+" i::::i Q:::::O Q:::::Q i::::i y:::::y y:::::y i::::i\n"+" i::::i Q:::::O QQQQ:::::Q i::::i y:::::y:::::y i::::i\n"+" i::::i Q::::::O Q::::::::Q i::::i y:::::::::y i::::i\n"+"i::::::i Q:::::::QQ::::::::Q i::::::i y:::::::y i::::::i\n"+"i::::::i QQ::::::::::::::Q i::::::i y:::::y i::::::i\n"+"i::::::i QQ:::::::::::Q i::::::i y:::::y i::::::i\n"+"iiiiiiii QQQQQQQQ::::QQ iiiiiiii y:::::y iiiiiiii\n"+" Q:::::Q y:::::y\n"+" QQQQQQ y:::::y\n"+" y:::::y\n"+" y:::::y";
console.log(t,i,s);
var i="";
var t="%c";
var zhihu=" _____ _____ _____ _____ \n /\\ \\ /\\ \\ /\\ \\ /\\ \\ \n /::\\____\\ /::\\ \\ /::\\ \\ /::\\ \\ \n /:::/ / \\:::\\ \\ /::::\\ \\ /::::\\ \\ \n /:::/ / \\:::\\ \\ /::::::\\ \\ /::::::\\ \\ \n /:::/ / \\:::\\ \\ /:::/\\:::\\ \\ /:::/\\:::\\ \\ \n /:::/____/ \\:::\\ \\ /:::/__\\:::\\ \\ /:::/__\\:::\\ \\ \n /::::\\ \\ /::::\\ \\ /::::\\ \\:::\\ \\ /::::\\ \\:::\\ \\ \n /::::::\\ \\ _____ ____ /::::::\\ \\ /::::::\\ \\:::\\ \\ /::::::\\ \\:::\\ \\ \n /:::/\\:::\\ \\ /\\ \\ /\\ \\ /:::/\\:::\\ \\ /:::/\\:::\\ \\:::\\____\\ /:::/\\:::\\ \\:::\\ \\ \n/:::/ \\:::\\ /::\\____\\/::\\ \\/:::/ \\:::\\____\\/:::/ \\:::\\ \\:::| |/:::/__\\:::\\ \\:::\\____\\\n\\::/ \\:::\\ /:::/ /\\:::\\ /:::/ \\::/ /\\::/ |::::\\ /:::|____|\\:::\\ \\:::\\ \\::/ /\n \\/____/ \\:::\\/:::/ / \\:::\\/:::/ / \\/____/ \\/____|:::::\\/:::/ / \\:::\\ \\:::\\ \\/____/ \n \\::::::/ / \\::::::/ / |:::::::::/ / \\:::\\ \\:::\\ \\ \n \\::::/ / \\::::/____/ |::|\\::::/ / \\:::\\ \\:::\\____\\ \n /:::/ / \\:::\\ \\ |::| \\::/____/ \\:::\\ \\::/ / \n /:::/ / \\:::\\ \\ |::| ~| \\:::\\ \\/____/ \n /:::/ / \\:::\\ \\ |::| | \\:::\\ \\ \n /:::/ / \\:::\\____\\ \\::| | \\:::\\____\\ \n \\::/ / \\::/ / \\:| | \\::/ / \n \\/____/ \\/____/ \\|___| \\/____/ \n";
console.log(t,i,zhihu);
如何在浏览器控制台(console)里输出彩色样式调试信息的更多相关文章
- IntelliJ IDEA控制台Console里没有查找快捷键
问题描述:之前的项目一直用的 Eclipse,习惯了其快捷键的使用,现在的项目换到IntelliJ IDEA,为了尽快上手,就把快捷键Keymap修改为Eclipse方式.发现在控制台Console里 ...
- 浏览器控制台console的使用
前天在团队项目中因为产品需求在提交订单的时候需要多个页面的数据作为提交接口的参数,这种需求让人醉醉的,项目用angular来做的,没办法只能用全局变量来定义要交互的值和localStorage来临时的 ...
- ASP.NET后台怎么输出方法中间调试信息?
后台方法,不止是aspx.cs,而是页面调用的一些其它方法.想调试这些方法,我以前winform都是MessageBox.Show一些中间结果,现在我也想用这种方式.但想想,网页会触发 Message ...
- 浏览器控制台console
console对象 console对象代表浏览器的JavaScript控制台.虽然它还不是标准,但是各大浏览器都原生支持,已经成为事实上的标准. console对象主要有两个作用: 显示网页代码运行时 ...
- 有趣的console.log（console.log输出彩色字，图片等）
亲们支持我的新博客哦==>原文地址 ) 逛网站的时候经常发现很多网站控制台打印了很好玩的内容 比如我的网站 →calamus 或者知乎→ 平时是不是只用console调试或者打印别的信息了,没有 ...
- Eclipse CDT 调用printf/cout 控制台(console)无输出
转摘自:http://blog.csdn.net/dj0379/article/details/6940836 症状描述: 用Eclipse调试程序,执行printf和cout函数,但是console ...
- chrome浏览器控制台 console不打印信息问题解决办法
谷歌浏览器控制台不能显示consle打印的东西,我记得之前可以正常打印,代码没问题,可能是你在浏览器中无意间点到了fifter,我们2可以使用最简单粗暴的方法---->恢复默认值. 按下F12, ...
- Node.js中的console.log()输出彩色字体
转自:https://www.jianshu.com/p/cca3e72c3ba7 console.log('\033[42;30m DONE \033[40;32m Compiled success ...
- chrome浏览器控制台 console不打印信息问题解决办法。
转自:https://blog.csdn.net/wang17866603359/article/details/79083776 最近换了安装chrome,想按F12调试下代码,发现控制台什么信息都 ...
随机推荐
- transitionFromViewController方法的使用
转自:http://blog.sina.com.cn/s/blog_7b9d64af0101c2vm.html 1.背景 iOS 5.0 以前 ,我们在一个视图控制器中会用addSubView方法 ...
- [self.view addSubview:vc2.view]程序崩溃的解决办法
- (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view. UIButt ...
- 使用vim-latex排版
前几天在某个群上看到了一篇简历,内容不重要,一看排版很漂亮的说.一问才知道是用latex排版工具排版的.一想到我都大三下学期的,也快大四了,是不是要准备一份简历.于是就想使用latex这个排版工具来排 ...
- iptables允许一个ip访问本机的某个端口
需求是redis允许特定客服端连接: -A INPUT -s .xx.xx.xxx/ -p tcp --dport -j ACCEPT
- 递归查询SQL语句
USE [DB] GO /****** Object: View [dbo].[v_menus] Script Date: 02/24/2014 15:55:45 ******/ SET ANSI_N ...
- C++11 long long使用及输出
相比于C++98标准,C++11整型的最大改变就是多了 long long.分为两种:long long 和unsigned long long.在C++11中,标准要求long long 整型可以在 ...
- vue2.0的学习
vue-router 除了使用 <router-link> 创建 a 标签来定义导航链接,我们还可以借助 router 的实例方法,通过编写代码来实现. 1)router.push(loc ...
- Markdown 11种基本语法【转】
[转自:http://www.cnblogs.com/hnrainll/p/3514637.html] 1. 标题设置(让字体变大,和word的标题意思一样)在Markdown当中设置标题,有两种方式 ...
- 通过Windows PowerShell远程管理计算机（精简版）
现在你手中有一台server(主控端),你打算通过主控端远程管理多台server(被控端).这个过程可以通过Windows PowerShell来完成. 首先在被控端上以管理员权限打开PowerShe ...
- .NetCore简介
引用:https://docs.microsoft.com/zh-cn/dotnet/articles/core/index .NET Core 是一个通用开发平台,由 Microsoft 和 Git ...