利用审查元素这个神器去修改任何想要修改的网页图片或者元素

很多刚接触网站建设的用户总是不知道如何去找修改想要修改的地方，有的是一张图片，有的是一个DIV或者一个其他网页元素，这里魔趣吧讲一下如何利用浏览器自带的【审查元素】功能去定位想要修改的地方！

1，审查元素在哪里？很多小白甚至不知道【审查元素】是什么意思，也不会去使用这个功能。审查元素是很多浏览器都有的一个功能！百度百科是这样解释的：审查元素是Google Chrome浏览器提供的一项服务功能，用户只需右键点击“审查元素”（名字），即可打开Chrome Inspector，获得网页各种元素的加载时间、Javascript函数、Object等信息。当然，现在很多浏览器都有这个功能了，不过仍然推荐使用Chrome浏览器进行相关的学习修改！Chrome浏览器打开审查元素的方法如下：
& a9 |( r3 @2 u" T  S3 b
8 a- O) X" E. U0 |2 K0 _" w
（1）在需要修改的页面单击鼠标右键，在弹出的对话框中选择【检查】，如下图：

" T) C" G0 d! p+ E: D


这样就打开了【审查元素功能】，其效果如下图：
  c# m+ h+ }7 d+ {" A

) {& L" X- Y1 C( a2 |' k
（2）为了方便审查，我们点击如图位置，选择【左右】审查模式，方便修改！如下图：
+ n$ |. X" w* K: q

1 f& A9 \$ J5 e3 F! R

. ?+ E! O2 q8 S2 o0 G0 G( N' h2，使用审查元素功能去定位想要修改的图片！既然打开了审查元素，那么就要用！这里我们以一个很多小白经常询问的问题来演示使用方法！那就是查找页面的一个图片并定位修改！如下图，我们尝试去修改这个LOGO图片，那么首先要找到LOGO图片的位置：

, m6 a' K, \0 v: C
3 y) S+ \9 s- w# k/ c3 g
6 P; I- D7 e, i& r: R; K  R8 j( J
0 E: B7 ^2 d6 L" @1 U
这里我们在这个图片上面单击鼠标右键，然后选择【审查】，可以看到，在右侧的审查窗口出现了图片的路径！
7 N) p: u% v1 k3 q* f* x1 k. D

我们在这个路径上单击鼠标右键，在弹出的窗口选择【在新窗口打开】，如下图：


) ~+ j( Z( M. H) d5 E
/ O6 x+ F  g5 M0 ~2 h6 j可以看到，图片在新窗口被打开了（当然，你也可以直接在图片上单击鼠标右键，选择在新窗口打开图片，不过一些图片可能是用CSS调用，那么就可以用这种方法来获取路径！），此时我们已经看到了这个图片的具体路径，只需要替换这个图片即可！




# O3 b7 O3 x, f0 q3 I4 q以上就是利用审查元素的方法来获取任意页面图片真实路径的方法！当然，部分网站可能添加了防鼠标右键的功能，这个就不是本教程的范围了！

3，使用审查元素来定位需要修改的元素或者DIV！实际上方法和第二步的图片定位是相似的，只不过修改的对象变成了其他元素，想要修改哪里，就在哪里单击鼠标右键，审查元素！比如想修改图中的部分，就对这块审查元素，可以获取到这里的DIV class名称，然后下载对应的插件或者模板全部文件，进行全文搜索class即可定位（全文搜索操作教程）：
  m  M# M: l, P% c' J- l

+ l/ L6 R- k" M/ x


* y6 S5 ]- W' I* z2 U  f然后做针对性修改即可，这个需要长期的实践才能熟练，多练习即可！



' C2 g$ ]/ g6 t) p* R, N审查元素功能强大！除了定位需要修改的元素，还可以查看页面是否有JS错误等，这些可以自己多多研究！魔趣吧也会不断的推出相关的教程！
% T3 `3 m4 o! z1 G* c2 t

支持，虽然讲的太牵线了，不够用