让chrome的控制台更高大上(装B用)

作为一名屌丝前端程序员,在装B的道路上是越走越远了!废话不多说,直接先上几张图:
我的Element是这样的:

我的console是这个样子的:

我的Timeline是这个样子的:

---------------------------正文在这里--------------------------------------

1. 你的有一个chrome浏览器

2. 你得在chrome的扩展程序里下载这个插件:  ZeroDarkMatrix Theme for Chrome
  
(1)  如果你不能FQ,打不开扩展程序,那点这里,这是它的github地址

  (2) 当然你也可以看github上的教程来走

  (3) 一个FQ的软件:lantern

3. (这里默认你已经下载好了这个软件),在chrome的地址栏处输入:

4. 找 开发者工具实验性功能  这一栏,启用它,变成下面这个样子

  温馨提示:chrome里的启用和停用显示按钮是:显示的是停用,说明这个功能正在启用中;显示的是启用,说明这个功能正在停用中

5. 点击左下方的立即重新启动

6. 按f12(或者右键->u审查元素),调出控制台

7. 

8. 

好了,到这里,你关闭控制台,再打开控制台,就会看到一开始的截图的效果了!

附件赠送:

1:  插件名字:DevTools Author这个插件可以自定义各种主题,包括颜色,字体,字体大小什么的,都可以设置。视频教程(不是我录的)

2:  国内chrome插件代理网站(不是我做的):http://getcrx.cn/,可惜刚才讲的那个插件在这里面没有的
如果对你有用,记得打赏一下,不在乎多少的,你们得支持才是我努力的动力

  

时间: 2024-11-09 17:18:21

让chrome的控制台更高大上(装B用)的相关文章

1.Google Chrome浏览器 控制台全解析

Google Chrome浏览器 控制台全解析 在Google Chrome浏览器出来之前,我一直使用FireFox,因为FireFox的插件非常丰富,更因为FireFox有强大的Firebug,对于前端开发可谓神器. 在Chrome出来的时候,我就喜欢上它的简洁.快速,无论是启动速度还是页面解析速度还是JavaScript执行速度(现在的FireFox4也比之前的FireFox3有很大的进步).不过当时由于Chrome的开发者工具还不是很完善,而我又不是很熟悉,加之对于Firebug的好感和依

直播APP开发助您搭建更高大上的直播平台

直播的火爆让无数企业为之倾倒,在直播市场中脱颖而出也成为企业获利的首要任务,如何搭建更高大上的直播平台呢,云豹直播有办法. 未来更好的服务企业,满足企业搭建高大上直播平台的想法,云豹直播的直播APP开发这次增加以下方案: 一.在线视频直播1.电脑网页直播,用户不用下载,打开就可直接看:2.手机直播,安卓.苹果 看直播,不需要支付第三方视频流费用,完全免费直播:3.平板电脑看直播:用平板电脑的浏览器打开直播间就可以看直播:4.可直播讲师摄像头,可直播行情软件,可用专业摄像器材直播:5.自由可控的清

多了解一下Chrome开发者控制台

多了解一下Chrome开发者控制台 2017年10月14日 ? Tools, Web前端 ? 1.0k views ? 暂无评论 作为一名前端开发者,Chrome内置的控制台是必须了解的,它拥有非常丰富的特性功能,对我们的开发帮助灰常大! 1.元素选择器($) 如果你接触过JQuery,那么对$()肯定不陌生,这是元素选择器,用来选择HTML元素,但现在,我们要了解的是控制台中的$(). 打开百度,按F12打开控制台 $() 相当于JavaScript中的 document.querySelec

Chrome开发者控制台的这些功能你都知道吗?

Chrome内置了一些开发者工具,这些工具提供了很多的功能.今天,我们将会专注于JavaScript控制台. 在我编程的过程中,这个控制台为我提供了大量的帮助. 如果你正在电脑端阅读这篇文章,你可以在阅读的同时打开Chrome来实践一下. 1. 选择DOM元素 如果你熟悉jQuery,你一定知道$('.class')和$('#id')选择器有多重要.它们会通过类或是与其相关的ID来选择DOM元素. 但是其实在开发者控制台中,即使你无法在DOM中使用jQuery,你一样可以这样选择. $('tag

Firebug & Chrome Console 控制台使用指南

转自:http://visionsky.blog.51cto.com/733317/543789 Console API 当打开 firebug (也包括 Chrome 等浏览器的自带调试工具),window 下面会注册一个叫做 console 的对象,它提供多种方法向控制台输出信息,供开发人员调试使用.下面是这些方法的一个简单介绍,适时地运用它们,对于提高开发效率很有帮助. console.log(object[, object, ...])使用频率最高的一条语句:向控制台输出一条消息.支持

Linux 环境下如何使 Chrome 浏览器字体更漂亮

Windows 就免谈了,本身字体渲染技术 Cleartype 以及 DirectWrite 就稀烂得一塌糊涂.Mac 下面本来字体渲染就很好,所以关键就是在 Linux 下如何使 Chrome 的字体渲染更漂亮?首先要明白一点,Chrome 的字体渲染依赖两点:Linux 操作系统的字体渲染设置以及 Chrome 自身的网页字体渲染控制.在 Fedora 22 GNOME 3.16 环境下,即使用 gnome-tweak-tool 设置了字体渲染微调为 none,抗锯齿为 Rgba 后,对 C

chrome浏览器控制台 console不打印信息问题解决办法。

转自:https://blog.csdn.net/wang17866603359/article/details/79083776 最近换了安装chrome,想按F12调试下代码,发现控制台什么信息都没有. 所以给大家分享下解决办法:  点击就会自动把勾勾上.这样就可以了. 原文地址:https://www.cnblogs.com/sharpest/p/10404373.html

企业LOGO设计,尺规作图让LOGO更高大上

我们经常会看到LOGO设计图上会有各种线.各种圆圈,新手设计师对这些一定是一知半解,其中这是尺规做图的一部分,设计LOGO一般都会用到,那么如何用尺规作图完成高大上的企业LOGO设计呢? 关于尺规作图 国外上世纪大品牌企业LOGO设计都是尺规作图做出来的,因为最开始电脑不发达的时候,制作标志都是手工做的,没有尺规制图,没法制作.后来这些品牌出名了,LOGO成为了典范,尺规作衅也成为了一个LOGO规(值)范(钱)与否的标准. 尺规作图LOGO设计基本步骤 接下来详线讲这三个步骤 1按着和睚己的想法

chrome插件控制台

在manifest.json中添加下面的几行 "background": { "scripts": ["background.js"] }, 在插件项目文件夹下面新建一个 background.js ,内容为空也可以 然后重新加载插件,就可以看到有 inspect view 的字样,点击 background page 就可以打开控制台了. 参考: https://www.raymondcamden.com/2012/06/06/Quick-ti