一般情况下我们用来输入信息的方法主要如下四个:

1、console.log 用于输出普通信息

2、console.info 用于输出提示性信息

3、console.error用于输出错误信息

4、console.warn用于输出警示信息

5、console.debug用于输出调试信息

console对象的上面5种方法,都可以使用printf风格的占位符。不过,占位符的种类比较少,只支持字符(%s)、整数(%d或%i)、浮点数(%f)和对象(%o)四种

今天无意间在打开www.runoob.com这个网站时,F12后发现控制台中输出了类似图片的东东(一开始认为是图片),后来查看源码发现不是图片,而是使用css写出来的

console.log("%cdddd.COM","background: rgba(252,234,187,1);background: -moz-linear-gradient(left, rgba(252,234,187,1) 0%, rgba(175,250,77,1) 12%, rgba(0,247,49,1) 28%, rgba(0,210,247,1) 39%,rgba(0,189,247,1) 51%, rgba(133,108,217,1) 64%, rgba(177,0,247,1) 78%, rgba(247,0,189,1) 87%, rgba(245,22,52,1) 100%);background: -webkit-gradient(left top, right top, color-stop(0%, rgba(252,234,187,1)), color-stop(12%, rgba(175,250,77,1)), color-stop(28%, rgba(0,247,49,1)), color-stop(39%, rgba(0,210,247,1)), color-stop(51%, rgba(0,189,247,1)), color-stop(64%, rgba(133,108,217,1)), color-stop(78%, rgba(177,0,247,1)), color-stop(87%, rgba(247,0,189,1)), color-stop(100%, rgba(245,22,52,1)));background: -webkit-linear-gradient(left, rgba(252,234,187,1) 0%, rgba(175,250,77,1) 12%, rgba(0,247,49,1) 28%, rgba(0,210,247,1) 39%, rgba(0,189,247,1) 51%, rgba(133,108,217,1) 64%, rgba(177,0,247,1) 78%, rgba(247,0,189,1) 87%, rgba(245,22,52,1) 100%);background: -o-linear-gradient(left, rgba(252,234,187,1) 0%, rgba(175,250,77,1) 12%, rgba(0,247,49,1) 28%, rgba(0,210,247,1) 39%, rgba(0,189,247,1) 51%, rgba(133,108,217,1) 64%, rgba(177,0,247,1) 78%, rgba(247,0,189,1) 87%, rgba(245,22,52,1) 100%);background: -ms-linear-gradient(left, rgba(252,234,187,1) 0%, rgba(175,250,77,1) 12%, rgba(0,247,49,1) 28%, rgba(0,210,247,1) 39%, rgba(0,189,247,1) 51%, rgba(133,108,217,1) 64%, rgba(177,0,247,1) 78%, rgba(247,0,189,1) 87%, rgba(245,22,52,1) 100%);background: linear-gradient(to right, rgba(252,234,187,1) 0%, rgba(175,250,77,1) 12%, rgba(0,247,49,1) 28%, rgba(0,210,247,1) 39%, rgba(0,189,247,1) 51%, rgba(133,108,217,1) 64%, rgba(177,0,247,1) 78%, rgba(247,0,189,1) 87%, rgba(245,22,52,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#f51634', GradientType=1 );font-size:5em");

结果如下:

console使用方法的更多相关文章

  1. console.time方法与console.timeEnd方法

    在Node.js中,当需要统计一段代码的执行时间时,可以使用console.time方法与console.timeEnd方法,其中console.time方法用于标记开始时间,console.time ...

  2. javascript jquery console调试方法说明

    控制台(Console)是Firebug的第一个面板,也是最重要的面板,主要作用是显示网页加载过程中产生各类信息. 一.显示信息的命令 Firebug内置一个console对象,提供5种方法,用来显示 ...

  3. virsh console使用方法

    How to use virsh console virsh 是libvirt 开源函数库中的一个命令行工具,用来在命令行下通过libvirt发布管理虚拟机的各种命令,现在介绍一下其中一个命令的使用方 ...

  4. Laravel的console使用方法

    适用场景:分析数据(日志) php artisan make:console 你的命令类名 示例: php artisan make:console Check 在\app\Console\Comma ...

  5. console.log()方法中%s的作用

    一.console.log("log信息"); 二.console.log("%s","first","second") ...

  6. [转]Web程序员必须知道的 Console 对象里的九个方法

    一.显示信息的命令 01 1: <!DOCTYPE html> 02  2: <html> 03  3: <head> 04  4:     <title&g ...

  7. IE中console的正确使用方法

    本文出处原文链接 转载请注明出处 http://www.cnblogs.com/havedream/p/4519538.html 问题来源:最近在学习easyui,观看的视频教程是孙宇的<EAS ...

  8. JS之console.log详解以及兄弟姐们邻居方法扩展

    console.log() 基本用法 console.log,前端常用它来调试分析代码,你可以在任何的js代码中调用console.log(),然后你就可以在浏览器控制台看到你刚才打印的常量,变量,数 ...

  9. .Net中的AOP系列之《方法执行前后——边界切面》

    返回<.Net中的AOP>系列学习总目录 本篇目录 边界切面 PostSharp方法边界 方法边界 VS 方法拦截 ASP.NET HttpModule边界 真实案例--检查是否为移动端用 ...

随机推荐

  1. tr命令

    tr命令是linux下一个字符处理命令,用途:    字符替换    字符删除    字符压缩形式:tr [OPTION]... SET1 [SET2]接口:输入输出都是标准流,所以要通过管道来调用这 ...

  2. 【JavaEE企业应用实战学习记录】struts2登录

    <%-- login.jsp Created by IntelliJ IDEA. User: Administrator Date: 2016/10/6 Time: 16:26 To chang ...

  3. 39-tar 打包压缩

    将文件存储到归档文件中或者从归档文件中获取原始文件,以及为文件创建归档文件 tar [option] [modifiers] [file-list] 参数 file-list是tar进行归档和提取的文 ...

  4. Intent和Intent Filters

    什么是Intent     Intent是android开发中的重要对象,它作为一个信息承载对象存在.     我们可以在使用其他一些组件的时候从Intent获取行为响应的准则(即应该做什么东西,如何 ...

  5. less sass学习总结(——待续哦——)

    一:less.sass是为了解决什么?  为什么要让css以编程语言来书写呢?

  6. webservice的常用注解

    定义说明书的显示方法1.@WebService(serviceName="PojoService", portName="PojoPort", name=&qu ...

  7. MyBatis学习--简单的增删改查

    jdbc程序 在学习MyBatis的时候先简单了解下JDBC编程的方式,我们以一个简单的查询为例,使用JDBC编程,如下: Public static void main(String[] args) ...

  8. springMVC之AOP

    AOP(Aspect-Oriented Programming,面向切面编程) 切面(Aepect):横切关注点(跨越应用程序多个模块的功能)被模块化的对象: 通知(Advice):切面必须要完成的工 ...

  9. Java 测试代码模板

    package com.robert.service; import org.apache.commons.logging.Log; import org.apache.commons.logging ...

  10. hdu3410 单调队列

    Passing the Message Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Othe ...