你在浏览网页的时候,是否注意过这些网页的控制台输出了什么?

Console这种东西,其实一般只有前端工作者才会注意到。console在我们实际开发中可是个宝贝,他是各种error和warning的展示窗口,通过console我们才能知道自己的网页出了什么毛病,虽然我想吐槽的是,有的时候没毛病它会爆一堆红,(懵逼脸)有问题的时候又干干净净。不管怎么说,它可以展示信息。并且在很久的一段时间,我对console的理解也就如此,知道有一次我点开百度,想看源码的时候不小心瞄到了:

卧槽,厉害了呀。我咋没想到呢,当时就给机智的百度点个赞。然后下意识的打开了天猫,摁下f12:

惊呆了好吧~~一家比一家脑洞清奇,天猫还良心的给不小心打开控制台的小白警告,业界良心哇!

相似的还有如下:

这样的O__O"…:

12306:

城会玩:

当然也有这样式的,调试用的console.log忘记删了吧:

以前我咋没发现console还能这么玩呢,简直是打开了新世界的大门啊。看了一下这些网站这部分的代码,大概知道怎么个玩法了~~

不过写到这里已经快下班了,就不详细说了,上一张图搞定一切:

这是代码:

    console.log("%c好神奇呀~","font-size:30px;color:white;background:deeppink;border-radius:2px;")
console.log("%c哇哇哇哇哇!","font-size:30px;background:linear-gradient(to bottom,deeppink,pink,orange);;border-radius:4px;")
console.log("%c看兔斯基!!!","font-size:30px;color:white;text-shadow:2px 2px 1px gold") console.log("%c","padding:120px 120px;line-height:100px;background:url('https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1487679947503&di=089b71b243d7805692f6af9fea7247ba&imgtype=0&src=http%3A%2F%2Fimg3.duitang.com%2Fuploads%2Fblog%2F201408%2F20%2F20140820122446_kHVcj.gif') no-repeat")

ok,收工回家~

关于Console控制台输出的玩法的更多相关文章

  1. Spring Boot2解决idea console 控制台输出乱码

    Idea默认配置是采用GBK, 而项目工程文件采用的是UTF-8. 编码不一致,导致idea Console控制台输出乱码. 网上的解决方案,大都是直接修改Settings=>Editor=&g ...

  2. 代码调试console对象的花式玩法

    转自阮一峰http://www.ruanyifeng.com/home.html console.log(),console.info(),console.debug() console.log方法用 ...

  3. Chrome 控制台新玩法-向输出到console的文字加样式

    Chrome 控制台新玩法-向输出到console的文字加样式 有兴趣的同学可以文章最后的代码复制贴到控制台玩玩. Go for Code 在正常模式下,一般只能向console 控制台输出简单的文字 ...

  4. Chrome 控制台新玩法-console显示图片以及为文字加样式

    有兴趣的同学可以文章最后的代码复制贴到控制台玩玩. Go for Code 在正常模式下,一般只能向console 控制台输出简单的文字信息.但为了把信息输出得更优雅更便于阅读,除了cosole.lo ...

  5. 【转】Chrome 控制台新玩法-console显示图片以及为文字加样式

    在正常模式下,一般只能向console 控制台输出简单的文字信息.但为了把信息输出得更优雅更便于阅读,除了cosole.log()方法外还可以调用 cosole.warn() 来输出警告信息,在控制台 ...

  6. js控制台输出console

    介绍: js的console你可以在firefox的firedbug或者ie和google的f12调试模式下看到,这些主流浏览器的调试模式的控制可以输出一些信息,你的一些js代码测试可以直接在cons ...

  7. 控制台屏蔽某console的输出

    有时候需要调试一个在线网站. 打开 chrome 控制台,其中有一些 console.log 不停的输出. 这样的话就影响了我们使用控制台调试页面. 那么怎样不让那一句(或多句)console.log ...

  8. 前端不为人知的一面--前端冷知识集锦 前端已经被玩儿坏了!像console.log()可以向控制台输出图片

    前端已经被玩儿坏了!像console.log()可以向控制台输出图片等炫酷的玩意已经不是什么新闻了,像用||操作符给变量赋默认值也是人尽皆知的旧闻了,今天看到Quora上一个帖子,瞬间又GET了好多前 ...

  9. PHP内置Web Server探究(二)自定义PHP控制台输出console函数

    我们在开发APP的服务器端,当和APP进行联调时通常需要实时跟踪URL请求和参数的接收情况. 但PHP并没有像Python或Java专有的控制台输出函数,Python的print()和Java的Sys ...

随机推荐

  1. Java中的 List Set Map

    类层次关系如下: Collection ├List │├LinkedList │├ArrayList │└Vector │ └Stack └Set Map ├Hashtable ├HashMap └W ...

  2. iOS开发:创建真机调试证书 分类: ios相关 2015-04-10 10:22 149人阅读 评论(0) 收藏

    关于苹果iOS开发,笔者也是从小白过来的,经历过各种困难和坑,其中就有关于开发证书,生产证书,in_house证书,add_Hoc证书申请过程中的问题,以及上架发布问题.今天就着重说一下关于针对于苹果 ...

  3. select into from 和 insert into select 的用法

    SELECT INTO 和 INSERT INTO SELECT 两种表复制语句 Insert是T-sql中常用语句,Insert INTO table(field1,field2,...) valu ...

  4. 初识Google code jam平台

    为了熟悉一下code jam的平台,今天简单试了一下,做了一下Qualification Round Africa 2010的三道题目,都是很基础的. A题:给一个数n和一系列数a[],从a[]中找出 ...

  5. UVa 10667 - Largest Block

    题目大意:这个也是和UVa 836 - Largest Submatrix差不多,修改一下数据就可以套用代码的. #include <cstdio> #include <cstrin ...

  6. Django中扩展Paginator实现分页

    Reference:https://my.oschina.net/kelvinfang/blog/134342 Django中已经实现了很多功能,基本上只要我们需要的功能,都能够找到相应的包.要在Dj ...

  7. ASP.NET常用的控件怎么添加

    http://jingyan.baidu.com/article/d8072ac4224747ec95cefda2.html

  8. arcgis_server_address_note

    arcgis server api下载地址 https://developers.arcgis.com/downloads/ 先前版本的帮助 http://resources.arcgis.com/z ...

  9. C++指针与const

    在C++中,const修饰符一般用于修饰常量.常量在定义的时候必须初始化,而且值一旦定义之后就不能修改,这样就能保证常量的值在程序运行过程中不会发生变换. 1.指向const对象的指针 指向const ...

  10. centos5.5關閉ssh保留運行的程序

    SSH会话关闭时,ssh所关联的pty关闭,系统会给这个pty所关联的session中的所有进程发送SIGHUP信号, SIGHUP的默认信号处理程序是终止进程,除非进程自己处理了SIGHUP. 解决 ...