携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第十六天，点击查看活动详情
前言
在element面板我们往往都是选择相应节点，对样式进行调试。不过，在这个面板中，其实还藏着一些小技巧的，让你的调试更加方便。下面我就给大家把我所收集的一一介绍下。
快速插入样式
当把鼠标放到相应的样式选择器上时，右下角会出现一个⋮图标，移过去或出现三个按钮，可以对样式进行快速的添加。
- Add text-shadow：添加字体阴影。
text-shadow: 0 0 black;
- Add box-shadow：添加盒子阴影。
box-shadow: 0 0 black;
- Add color：添加字体颜色。
color: black;
- Add background-color: 添加背景色。
background-color: white;
- Insert Style Rule Below：插入样式选择器。
一键隐藏DOM节点
可能有些时候，我们想隐藏页面的一部分内容，比如说截图什么的。这个时候只需要按下h键，就可以一键隐藏，在按下就会显示。
shadow editer（阴影编辑器）
当鼠标靠近box-shadow 或者 text-shadow旁的阴影方形图标时，点击，即可打开阴影编辑器，可以快速的对阴影进行调整。
快速展开dom节点
当elements面板中，选择的节点层级较多时，我们一个一个的点击展开是比较繁琐的，我们可以右键选择expand recursively命令进行一键展开。
尤其在用一些ui组件库的时候，dom层级结构就比较深，通过 expand recursively 展开很大程度上，帮助我们省去很多不必要的麻烦。
