How to get background image from internal css using xpath?


Tags: php,html,css,xpath,domxpath

Problem :

I want to get background-image URL that is in internal css. I'm using xpath in php

Here is the html structure

<div id="plugin-title" class="with-banner">
<div class="vignette"></div>

<style type="text/css">
#plugin-title { width:772px; height:250px; background-size:772px 250px; background-image: url(//ps.w.org/jetpack/assets/banner-772x250.png?rev=1279667); }
</style>
<h2 itemprop="name">Jetpack by WordPress.com</h2>
</div>


Solution :

If you want the links for background-image, then you can use this RegExp.

background-image.*?url\((.*?)\)

Example implementation:

$html = <<<EOT
<div id="plugin-title" class="with-banner">
    <div class="vignette"></div>
    <style type="text/css">
    #plugin-title { width:772px; height:250px; background-size:772px 250px; background-image: url(//ps.w.org/jetpack/assets/banner-772x250.png?rev=1279667); }
    </style>
    <h2 itemprop="name">Jetpack by WordPress.com</h2>
</div>
EOT;

preg_match_all('/background-image.*?url\((.*?)\)/mi', $html, $matches);

$matches contains all the background-image urls.


    CSS Howto..

    How to make an inline-block box stick to the top? [duplicate]

    How do I properly add a scrollbar to a jQuery Mobile popup using iScrollview?

    How can I stay organized when writing CSS? [duplicate]

    How to make last element of second level of menu to drop up?

    How can I force a css flex child to be the only on its row?

    How to add a css transition color change for a link/div background

    Infuriating gap: How do you get rid of a gap between IMG and surrounding content

    How to edit the CSS of a selector in Polymer 1.0

    How to get css and django working on live server

    How to fix background Opacity css

    How to make HTML pages print at a consistent size from Chrome?

    how to clear all css styles

    How to make this css readable?

    How to draw half-opened line in CSS? [closed]

    How to overlay a form field over an image with a fixed width?

    HTML: slideshow is not recognised as an element in the main content of the page

    How to get rid of text form borders in Chrome and Firefox?

    How to load local copy of bootstrap css when the cdn server is down?

    How to change the Fill color of an SVG path via CSS

    how to get the value of css style using jquery

    How do you keep zoom between pages consistent? via CSS?

    How do I tell what are the ids and classes of a rail html.erb component?

    How to add pixels to a current position of an element?

    Showing :before but hiding element with CSS only

    How to display thumbnail in dropdown CSS list along with other styling of text

    How to select a great grandchild of an element by its id

    How can that view be achieved? Collage / Magazine Products

    How to center CSS Navigation Menu

    How to get rid of spaces between images in CSS?

    how to make div background image responsive