CSS backrgound-image

Hi there - I'm trying to extract an image from a blog post. It's a bit odd how the image is stored in the page. The img tag has a style class applied to it which populates the image as a background-image. I tried a different methods (from others in the forum) but can't get it to work. Ultimately, I need the background image url "/images/blogs/blog-img-3.jpg".

Here is the div with the image I need:

<div class="post-img">
<img itemprop="image" content="http://www.moorelaw.com/images/blogs/blog-img-1.jpg" class="default img-0" src="[/Shared/images/spacer.gif](https://www.moorelaw.com/Shared/images/spacer.gif)" alt="Drunk Driver Causes Crazy crash Scene In Dayton" title="Drunk Driver Causes Crazy crash Scene In Dayton">
</div>

Url: Drunk Driver Causes Crazy crash Scene In Dayton

Sitemap:

{"_id":"test","startUrl":["https://www.moorelaw.com/blog/2011/june/drunk-driver-causes-crazy-crash-scene-in-dayton/#~a4l2963"],"selectors":[{"id":"blog_image","type":"SelectorHTML","parentSelectors":["_root"],"selector":"img.default.img-2","multiple":false,"regex":"(?<=background-image: url\\()[^\\)]+","delay":0}]}

You're on the right track. To get the first image, you can use:

Type: HTML

Selector: section#PostPageMoreList ul > li:nth-of-type(1)

Regex: (?<=background-image\:url\(')[^']+

To get the subsequent images, just change the number after nth-of-type to 2, 3, 4,...

Alternatively, you can get them all in one go, but on multiple lines by changing the selector to section#PostPageMoreList ul > li
and enabling Multiple.

You'd still need to prefix the main URL to the results though. Refer to:

Thanks for the reply.

Using your method grabs the first image from the bottom of the page – from the links to the additional blog posts. I'm trying to grab the main image for the post, "https://www.moorelaw.com/images/blogs/blog-img-2.jpg".