preg_replace remove style text/css tag

Viewed 1410

I need some help with my PHP as I have a hard time of getting rid of the style type="text/css" tag. I want to remove the style tag to replace it with the empty string.

When I try this:

if (strpos($inbox_message, '<style type="text/css">') !== false) {
    echo (preg_replace('/<style[^>]*>(([^<]|[<[^\/]|<\/[^s]|<\/s[^t])*)<\/style>/i','',$inbox_message));
}

It will still showing the style tag in the html page.

Here is what it is showing:

<style type="text/css"> body {position: relative; font-family: Segoe UI; font-size: 12px; } .pageHeader {color: #9C9C9C; font-size: 160%; padding: 0px 0px 6px 0px} .pageHeaderLogo {padding-right: 15px;} .pageHeaderTitle{border-left: 1px solid #CCCCCC; padding: 5px;} .pageFooter {width: 100%; background-color: #f2f2f2; font-size: 12px; font-family: Segoe UI; padding:4px 4px 4px 4px; } .pageFooterLogo {text-align:right; width:100%} .padCells { padding: 0px 6px 0px 0px; } .preHeader {display: none !important; visibility:hidden; opacity:0; color:transparent; height:0; width:0; }</style>

Can you please show me an example how I could use preg_replace to find the style type=text/css tag so I can be able to remove them?

Thank you.

EDIT: Sorry I realised that I only need to remove the body in the style tags as I want to keep the other tags in the style.

/*GENERAL*/
    table{width:100%}
    body{background-color:#ebebeb; width: 100%; margin:0; padding:0; -webkit-font-smoothing: antialiased;font-family: "Segoe UI",SegoeUI,"Helvetica Neue",Helvetica,sans serif; -webkit-text-size-adjust: 100%;}
    div.ms-article-container #emailbodyouter .emailbodyinner section{margin:0}
    div.ms-article-container #emailbodyouter .emailbodyinner table div {margin:0}
    div.content-article #emailbodyouter .emailbodyinner section{margin:0}
    div.content-article #emailbodyouter .emailbodyinner table div {margin:0}
1 Answers

Literal answer:

$inbox_message = preg_replace('#<style type="text/css">.*?</style>#s', '', $inbox_message);

You don't need to check whether it exists or not — if not, preg_replace will not do anything. You don't need to worry about what's inside the tag — the non-greedy quantifier takes care of it (as long as you don't by any chance have a nested <style> tag, which would be kind of extraordinary). And you don't need to worry about escaping slashes, if you choose another delimiter.

Non-literal answer: Beware Zalgo.

$doc = new DOMDocument();
$doc->loadHTML($inbox_message);
$xpath = new DOMXpath($doc);
$styles = $xpath->query('//style[@type="text/css"]');
if ($styles) {
  foreach ($styles as $style) {
    $style->parentNode->removeChild($style);
  }
}
$inbox_message = $doc->saveHTML();

EDIT after the question changed: Since there is no CSS parser by default, we end up having to use regexp anyway. Something like this should be okay. Zalgo method:

$inbox_message = preg_replace_callback('#<style type="text/css">.*?</style>#s', function($match) {
  return preg_replace('#body\s*{(?:[^"}]|"[^"]*")*}#', '', $match[0]);
}, $inbox_message);

Anti-Zalgo method:

$doc = new DOMDocument();
$doc->loadHTML($inbox_message);
$xpath = new DOMXpath($doc);
$styles = $xpath->query('//style[@type="text/css"]');
if ($styles) {
  foreach ($styles as $style) {
    $style->textContent = preg_replace('#body\s*{(?:[^"}]|"[^"]*")*}#', '', $style->textContent);
  }
}
$inbox_message = $doc->saveHTML();
Related