如何查看网页的某张图片的宽高？

待我称王封你为后i 2022-12-30 11:58 153阅读 0赞

# 如何查看网页的某张图片的宽高？ #

打开chrome的开发工具(F12)，用指针工具选中需要看的图片，查看Properties，选中img，详细步骤如图

1.  选中

![在这里插入图片描述][resize_w_600]

1.  选中Properties，并找到img

![在这里插入图片描述][resize_w_800]

![在这里插入图片描述][resize_w_600 1]

1.  查看clientWidth/clientHeight/naturalWidth/naturalHeight
    
    clientXxxx 是客户端，即浏览器所显示的图片的宽高，
    
    naturalXxxx是图片实际的宽高，即从服务器下载到本地的图片的宽高，同时也是保存图片时图片文件的宽高。
    
    两者可能是不一样的值，clientXxxx 是通过css得到的值，是看到的大小尺寸。
    
    ![在这里插入图片描述][resize_w_600 2]

![在这里插入图片描述][resize_w_700]

![在这里插入图片描述][resize_w_700 1]

[resize_w_600]: /images/20221120/141b4966dc2541a2b847a3cd4d634ff5.png
[resize_w_800]: /images/20221120/ba5b80b0276a46b7bf559d205f0a9c7c.png
[resize_w_600 1]: https://img-blog.csdnimg.cn/20201225123102394.png?x-oss-process=image/resize,w_600
[resize_w_600 2]: https://img-blog.csdnimg.cn/20201225123309128.png?x-oss-process=image/resize,w_600
[resize_w_700]: https://img-blog.csdnimg.cn/20201225123456772.png?x-oss-process=image/resize,w_700
[resize_w_700 1]: https://img-blog.csdnimg.cn/20201225123619286.png?x-oss-process=image/resize,w_700

发表评论取消回复

表情：

评论列表（有 0 条评论，153人围观）

还没有评论，来说两句吧...

相关阅读

相关 html-docx-js 设置图片宽高导出的图片宽高不生效

导出教程：[ 表格导出成Excel文件或HTML转word文档][_Excel_HTML_word] 如果是通过style或者class加的样式，宽高是不生效的一定要用

谁借莪１个温暖的怀抱￠/ 2024年03月17日 21:53/ 0 赞/ 103 阅读

相关如何查看网页的某张图片的宽高？

如何查看网页的某张图片的宽高？打开chrome的开发工具(F12)，用指针工具选中需要看的图片，查看Properties，选中img，详细步骤如图 1. 选中 !

待我称王封你为后i/ 2022年12月30日 11:58/ 0 赞/ 154 阅读

相关 element上传图片如何获取图片的宽高

html如下： <el-upload action="https://jsonplaceholder.typicode.com/posts/" :before-upl

骑猪看日落/ 2022年12月17日 11:59/ 0 赞/ 997 阅读

相关网页高宽

网页可见区域宽：document.body.clientWidth; 网页可见区域高：document.body.clientHeight; 网页可见区域高：

迈不过友情╰/ 2022年08月07日 03:36/ 0 赞/ 224 阅读

相关 php 如何获得上传图片的宽和高？

用下面的函数就可以实现 getimagesize($_FILES['xxxxx']['tmp_name']); 获得的值是个数组如下： array(7)

本是古典何须时尚/ 2022年08月04日 13:38/ 0 赞/ 176 阅读

相关 js获取原生图片的宽高

var myimage=http://baidu.com/img/data/upload/admin/5a321e69ab0db.jpg;

- 日理万妓/ 2022年06月03日 01:42/ 0 赞/ 279 阅读

相关设置图片的宽高一样大

在移动设备上，我们常常需要将一张图片的宽度设为屏幕的宽度，同时将图片的高度设置成和图片的宽度一样大，下面讲讲用css如何设置。 html如下 <div class=

古城微笑少年丶/ 2022年05月25日 01:47/ 0 赞/ 237 阅读

相关 html设置图片的宽高

一、HTML标签内控制宽度高度 img标签自带的属性：width和height；例如： <img src='图片地址' wid

梦里梦外;/ 2022年05月08日 13:16/ 0 赞/ 2203 阅读

相关 js/jq 获取网页宽高

js获取网页宽高 document.body.clientWidth // BODY对象宽度 document.body.clientHeight

喜欢ヅ旅行/ 2022年04月05日 12:08/ 0 赞/ 318 阅读

相关基于python的多张不同宽高图片拼接成大图

半年前写过一篇将多张图片拼接成大图的博客，是讲的把所有图片先转换为256×256的图片后再进行拼接，今天看到一个朋友的评论说如何拼接非正方形图片，如47×57，之

旧城等待，/ 2022年01月31日 23:29/ 0 赞/ 299 阅读