网页网站您现在的位置是:首页 > 博客日志 > 网页网站

console.log()控制台打印输出样式设置

<a href='mailto:'>微wx笑</a>的头像微wx笑2020-08-05 15:14:18网页网站人已围观关键字: 控制台  CSS  

近日查看某网站控制台输出时,发现输出的内容还是带样式的,于是网上找了一下实现的方法,这里记录一下。先看效果:实现方法:console.log("%c无知人生"," text-shadow: 0 1px 0 #ccc

近日查看某网站控制台输出时,发现输出的内容还是带样式的,于是网上找了一下实现的方法,这里记录一下。eDK编程技术_踩坑日志_进阶指南_无知人生

先看效果:eDK编程技术_踩坑日志_进阶指南_无知人生

image.pngeDK编程技术_踩坑日志_进阶指南_无知人生

实现方法:eDK编程技术_踩坑日志_进阶指南_无知人生

console.log("%c无知人生"," text-shadow: 0 1px 0 #ccc,0 2px 0 #c9c9c9,0 3px 0 #bbb,0 4px 0 #b9b9b9,0 5px 0 #aaa,0 6px 1px rgba(0,0,0,.1),0 0 5px rgba(0,0,0,.1),0 1px 3px rgba(0,0,0,.3),0 3px 5px rgba(0,0,0,.2),0 5px 10px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.2),0 20px 20px rgba(0,0,0,.15);font-size:5em;background:url(https://www.ivu4e.com/thumbs/202006/5Z_65LqO5bid5Zu9Q01T55qE5bu656uZ5pel5b_X.jpeg)");

注意第一个参数前的“%c”,需要加上它,第二个参数的样式才生效。
eDK编程技术_踩坑日志_进阶指南_无知人生

本文由 微wx笑 创作,采用 CC BY-NC 4.0 许可协议。 非商业性使用可自由转载、引用、甚至修改,但需署名作者且注明出处。

很赞哦! () 有话说 ()