每一天我们都在使用浏览器，用它来搜索、学习、阅读、查邮件……但是，你或许从来都不知道，在你的浏览器中隐藏着一个无比强大的工具：「检查元素」。
在任何网页点击右键，点击「检查」，你会通过这个窗口看到整个网页内部结构：网页的源代码、设计图、样式表、使用的字体、图标，酷炫的网页动画脚本代码等等。你还可以看到你打开这个网页花了多少时间，以及每一段文本使用了什么样的颜色值。
以上这些，听起来似乎都是属于「程序员」的事情。但是，对于大多数的「非程序圈」人来说，你可能对于网页代码根本不感兴趣，但是你可能更想知道的是，如何用「检查元素」来做一些更接地气的事：
- 设计师：你想要看一下网页在移动设备预览的外观是怎么样的？或者想要看一下如果把按钮的颜色修改为绿色效果如何？你可以通过「检查元素」在几秒钟内完成。
- 营销者：你想知道竞争对手在其网站标题中使用了哪些关键字，或者想知道你的网站为什么加载速度这么慢？「检查元素」都可以帮助你完成。
- 写作者：厌倦了每一次都要在屏幕截图中模糊你的名字和电子邮件？借助「检查元素」，你可以在一秒钟内更改网页上的任何文本。
我想对于绝大多数人来说，你可能最感兴趣的应该是「把任意的网页修改成你想要的样子」这一点了。让我们来看一下这到底是怎么回事。
比如，在某一刻，半撇有道儿的公众号粉丝数量是这样的：
如果，你希望在这些数字短时间能够翻10倍甚至100倍，它也可以是这样的：
让我们来看看这个是如何实现的吧！
打开桌面浏览器
无论你是写过代码的开发人员还是完全不懂代码的营销者，如果你正在手机上阅读这一篇文章，现在你可以切换到笔记本电脑，打开 Google Chrome 就可以准备开始了。
大多数Web浏览器（包括Mozilla Firefox和Apple的Safari）都包含一个「检查元素」的工具，而Microsoft的Internet Explorer和Edge浏览器也包含一组类似的开发工具。本文重点介绍Google Chrome的「检查元素」工具，但大多数功能在其他浏览器中也都具备。
打开开发者工具
你有有几种方式可以访问 Google Chrome 的检查元素。只需打开一个想要尝试编辑的网站（按照本教程进行操作，打开www.bpteach.com），然后以以下三种方式之一打开「检查元素」工具：
- 右键单击网页上的任意位置，在弹出的菜单底部，你会看到「检查」，点击这个按钮。
- 点击 Google Chrome 工具栏最右侧的汉堡菜单（带有3个堆积点的图标），点击「更多工具」，然后选择「开发者工具」。或者，在文件菜单中，单击查看 – >开发人员 – >开发人员工具。
- 喜欢键盘快捷键？在Mac或PC 上按下
CMD+Option+I，或者F12，你可以在无需单击任何内容的情况下打开「检查元素」工具。
如果你的屏幕底部的检查元素没有足够的空间，因此单击检查元素窗格右上角“X”旁边的三个垂直点，将窗格放置到屏幕的右侧。
修改网页元素
现在，你到了「检查元素」的窗口，你当然可以拿它来修改背景图片、颜色、文本、字体等等，但是在本文中我们着重介绍文本的修改。
-
双击选中你想要修改的文字，点击鼠标右键，你会看到这个部分变成了蓝色突出的文本块：
-
你会看到右侧的对应的文字也被选中了，双击“开发人员工具”窗格中呈蓝色突出显示的部分（比如这里的“做是最好的学”），它将变为可编辑的文本字段。
-
这时候，你就可以自由地修改文本了，然后按回车！网页就会呈现出你修改后的样子了：
当然，这都只是暂时性的修改，当你刷新页面，一切都将恢复正常。
「检查元素」作为浏览器非常重要的一个开发工具，当然能量要远远大于这一点，如果你希望深入的研究，你可以阅读 Google 的官方指南。
写到这里，我想说的是：虽然我们总是相信「数据背后的道理」，但是永远不要轻易地相信「图片就是数据背后的真相」。
最后小广告，「半撇的创业手记」社群（知识星球）试运营开始了，在这个星球里，我会把创业过程中解决问题的方法和失败的经验都收录到里面，每一个季度的新课程内测也会在这里完成，如果你感兴趣，可以回复「社群」加入（当然，它是付费的）。
