如何从网页中提取图像，保留其显示尺寸？

Question

我需要在大型CMS中收集图像，以便将它们分组到单个CSS精灵中。但其中许多都在CMS内的屏幕上调整大小。保存完整的网页始终会为图像提供原始尺寸。因此，CSS精灵生成器使用原始大小渲染它们。 CSS精灵技术基于使用带背景图像的HTML元素，只能以原始大小显示。

是否有人知道可以从网页抓取图像的应用程序或脚本，但是要保存它们的显示尺寸？ （这意味着它还应该保存与各种文件相同图像的各种实例）

Answer 1

我知道这是一个较老的问题 - 但它出现在我的搜索中。

由于网页只是将网址和展示尺寸提供给浏览器，因此浏览器的工作是显示正确的尺寸...但浏览器还会考虑任何缩放设置或其他注意事项等你可能已经设定了。此外，某些元素的相对大小可能会根据您的浏览器视口，桌面与移动设备的不同而有所变化。因此，获取像素下载的精确像素可能会给您带来误报结果，这些结果仅适用于下载软件或浏览器。

你最好的选择（虽然不是你提出的预先编写的软件）可能是下载所有图像资源的列表（使用其他人提到过的工具 - 我喜欢这个：http://www.webalyzing.com/free-seo-tools/image-extraction.php）< / p>

如果您必须具有HTML中给出的确切像素尺寸，那么您可能需要编写一个迭代所有IMG元素的DOM解析脚本。这是PHP中一个简单的（未经测试的）示例。

$dom = new DomDocument();
$dom->loadHTMLFile('http://some-url');
$images = $dom->getElementsByTagName('img'); 
foreach($images as $image){
    $src = $item->getAttribute("src");
    // Get other attributes as needed, styles, width, etc...
}

等等...

Answer 2

我认为你只能手动完成。有一个名为“pixlr grabber”的firefox扩展可以帮助你。

https://addons.mozilla.org/en-US/firefox/addon/pixlr-grabber/

示例图片：

Answer 3

即使是这个小工具也会从网页http://www.prowebguru.com/2011/12/free-online-image-extractor/

中提取图片

即使您可以尝试此http://www.wikihow.com/Download-All-Images-on-a-Web-Page-at-Once