Fatal编程技术网
  • php/
  • 使用PHP修改img标记的内联CSS

使用PHP修改img标记的内联CSS

php regex

使用PHP修改img标记的内联CSS,php,regex,Php,Regex,我想根据以下标准修改img标签的内联CSS： 如果它包含float:left或float:right，则不进行更改 否则，添加显示：块 另外，修改边距CSS属性。将水平边距更改为“自动”，并保留垂直边距 例如，如果代码如下所示： <img src="ex1.jpg" style="margin:5px 5px;float:left;" /> <img src="ex2.jpg" style="margin:5px 175px;" /> <img src="ex3

我想根据以下标准修改img标签的内联CSS：

  • 如果它包含float:left或float:right，则不进行更改
  • 否则，添加显示：块
  • 另外，修改边距CSS属性。将水平边距更改为“自动”，并保留垂直边距
    • 例如，如果代码如下所示：

    <img src="ex1.jpg" style="margin:5px 5px;float:left;" />

    <img src="ex2.jpg" style="margin:5px 175px;" />

    <img src="ex3.jpg" style="margin-top:5px; margin-left:5px;" />
    那么就不做任何改变了。但如果代码如下所示：

    <img src="ex1.jpg" style="margin:5px 5px;float:left;" />

    <img src="ex2.jpg" style="margin:5px 175px;" />

    <img src="ex3.jpg" style="margin-top:5px; margin-left:5px;" />
    然后应将其修改为：

    <img src="ex2.jpg" style="display:block;margin:5px auto;" />

    <img src="ex3.jpg" style="display:block;margin-top:5px margin-left:auto;" />
    或者像这样：
    然后应将其修改为：

    <img src="ex2.jpg" style="display:block;margin:5px auto;" />

    <img src="ex3.jpg" style="display:block;margin-top:5px margin-left:auto;" />
    编辑：
    对img标签的修改必须在我的CMS获得的HTML代码中进行。

    尝试此模式以匹配
    ，但其中不存在任何
    浮动：
    

    <img(?![^<>]+?\bfloat\s*:\s*(?:left|right))[^<>]+>

    

    

    
解释
    

    

    匹配字符
    。然后准备您的自定义函数来处理其余的函数。
    尝试此模式以匹配
    ，但其中不存在任何
    浮动：
    

    <img(?![^<>]+?\bfloat\s*:\s*(?:left|right))[^<>]+>

    

    

    
解释
    

    

    匹配字符
    。然后准备自定义函数来处理其余部分。
    考虑使用
    preg_match（）

    

    下面是到php.net的快速链接：。您可以在那里看到示例。
    考虑使用
    preg_match（）

    

    下面是到php.net的快速链接：。您可以在那里看到示例。
    定义中的快速脏函数：
    

    function modify_img_css($html) {
    if (strpos($html, 'float:left') !== false || strpos($html, 'float:right') !== false) {
        return $html;
    }
    $html = str_replace('style="', 'style="display:block;', $html);
    if (strpos($html, 'margin-left:') !== false) {
        $html = preg_replace('/margin\-left:[^;]+;/', 'margin-left:auto;', $html);
    }
    if (strpos($html, 'margin:') !== false) {
        $html = preg_replace('/(margin:\s*\S+\s+)\S+;/', '\1auto;', $html);
    }
    return $html;
}

    

    定义中的快速脏函数：
    

    function modify_img_css($html) {
    if (strpos($html, 'float:left') !== false || strpos($html, 'float:right') !== false) {
        return $html;
    }
    $html = str_replace('style="', 'style="display:block;', $html);
    if (strpos($html, 'margin-left:') !== false) {
        $html = preg_replace('/margin\-left:[^;]+;/', 'margin-left:auto;', $html);
    }
    if (strpos($html, 'margin:') !== false) {
        $html = preg_replace('/(margin:\s*\S+\s+)\S+;/', '\1auto;', $html);
    }
    return $html;
}

    
编辑：
    
在我考虑了一会儿之后，如果看到一个使用大量示例html的示例，而不是一个漂亮的img标记列表，那将更有帮助。请参阅下面更新的代码和输出
    
这些规则非常简单，可以在需要时使用preg_replace轻松运行，并且可以使用strpos进行检查以保存正则表达式引擎调用。如果你有任何问题，请告诉我
    
输出：
    

    <html>
  <head></head>
  <body>
    <p> LOLOLOLOLOLOLOL </p>
    <img src="ex1.jpg" style="margin:5px 5px;float:left;" />
    <p> LOLOLOLOLOLOLOL </p>
    <img src="ex2.jpg" style="display:block;margin:5px auto;" />
    <p> LOLOLOLOLOLOLOL </p>
    <img src="ex3.jpg" style="display:block;margin-top:5px; margin-left:auto;" />
    <p> LOLOLOLOLOLOLOL </p>
  </body>
<html>

    

    
洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛
    
洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛
    
洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛
    
洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛
    

    
代码：
    

    编辑：
    
在我考虑了一会儿之后，如果看到一个使用大量示例html的示例，而不是一个漂亮的img标记列表，那将更有帮助。请参阅下面更新的代码和输出
    
这些规则非常简单，可以在需要时使用preg_replace轻松运行，并且可以使用strpos进行检查以保存正则表达式引擎调用。如果你有任何问题，请告诉我
    
输出：
    

    <html>
  <head></head>
  <body>
    <p> LOLOLOLOLOLOLOL </p>
    <img src="ex1.jpg" style="margin:5px 5px;float:left;" />
    <p> LOLOLOLOLOLOLOL </p>
    <img src="ex2.jpg" style="display:block;margin:5px auto;" />
    <p> LOLOLOLOLOLOLOL </p>
    <img src="ex3.jpg" style="display:block;margin-top:5px; margin-left:auto;" />
    <p> LOLOLOLOLOLOLOL </p>
  </body>
<html>

    

    
洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛
    
洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛
    
洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛
    
洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛洛
    

    
代码：
    

    我对各种解决方案都持开放态度。是的，我可能需要正则表达式。但我不知道该怎么办。@Quentin我不认为这是重复的。对于了解正则表达式的人来说，我认为这是一个简单而直接的问题。@Quentin我不是在问一个一般的“如何解析HTML”问题。我问了一个非常具体的问题，关于如何修改内联CSS。我真的不认为这是一个重复，也不认为这个问题的答案对我有帮助。是的，我可能需要正则表达式。但我不知道该怎么办。@Quentin我不认为这是重复的。对于了解正则表达式的人来说，我认为这是一个简单而直接的问题。@Quentin我不是在问一个一般的“如何解析HTML”问题。我问了一个非常具体的问题，关于如何修改内联CSS。我真的不认为这是重复的，或者这个问题的答案对我有帮助。我只是想问，如果使用html文档而不是一个方便的img标记数组，该如何处理。我应该在问题中提到同样的问题，我的错。让我运行一下，看看它是否有效。我想是的。我盯着这个问题看了一会儿，心想：“是的……我的答案并不完整。”我希望我编辑的答案能帮助你。我意识到我已经将html加载到了一个字符串中，因此如果您要从一个文件加载html，您需要先将其加载到一个字符串中，然后才能使用我的示例。希望我至少能把你引向正确的方向。是的，这很好用。HTML是一个字符串，因此这不是一个问题。非常感谢你的帮助。代码和注释非常有用。非常好！很高兴我能帮忙。我只是想问，如果使用html文档而不是一个方便的img标记数组，该如何处理。我应该在问题中提到同样的问题，我的错。让我运行一下，看看它是否有效。我想是的。我盯着这个问题看了一会儿，心想：“是的……我的答案并不完整。”我希望我编辑的答案能帮助你。我意识到我已经将html加载到了一个字符串中，因此如果您要从一个文件加载html，您需要先将其加载到一个字符串中，然后才能使用我的示例。希望我至少能把你引向正确的方向。是的，这很好用。HTML是一个字符串，因此这不是一个问题。非常感谢你的帮助。代码和注释非常有用。非常好！很高兴我能帮上忙。@Prakash你能帮我恢复你的编辑吗。它的原始格式可读性更强。@Prakash请您恢复您的编辑。它的原始格式可读性更强。