通过chrome inspector css查找图像的根路径

时间:2016-02-03 09:42:00

标签: jquery html css wordpress

我正在编辑一个wordpress模板,我需要找到html class / id" .navbar-header"所以我可以在html中看到它链接到的图像。所以我可以将图像更改为双倍大小。

如何找到此图片的根路径?所以我可以改变图像。我正在使用chrome检查工具找到当前的css部件。

/* MADS EDIT sticy nav from 100% to 215%

orignal code here:
.sticky-nav .navbar-header img {
    max-height: 100%;
    -webkit-backface-visibility: hidden;

*/

.sticky-nav .navbar-header img {
    max-height: 100%;
    -webkit-backface-visibility: hidden;

3 个答案:

答案 0 :(得分:0)

转到chrome dev工具的网络面板
转到里面的图像面板
重新加载页面并在其中找到您的图像 检查图片网址:)

答案 1 :(得分:0)

这很简单:

  1. 将鼠标移到图像上。
  2. 右键单击并选择检查。
  3. 现在,在元素标签中,您可以看到已经检查过的图像&#s; src。
  4. 我在SO签名的图片上进行了测试。

答案 2 :(得分:0)

  

如何找到此图片的根路径?所以我可以改变图像。

找到" root path(目录路径)"服务器上的文件,在前端上是不可能的,除非该网站使用apache(server)root作为自己的root。

我为什么这么说,

服务器可能正在使用位于服务器根文件夹深处的文件夹来为网站提供服务,但图像链接仍然只是相对于域显示。

例如。

The url of the website is say 
http://example.com

Web root folder on server:
/var/www/html/websites/myprojects/2016/example/

The Path to the image would be
/var/www/html/websites/myprojects/2016/example/images/myimg.jpeg`

The location of the image shown on frontend would be.
http://example.com/images/myimg.jpeg