在PHP中将多个CSS文件合并为一个

Question

我正在研究一种将多个CSS生成一个的脚本。 这是脚本。

    $full_string = "";

    foreach($allfiles as $curfile => $file) {           
        $file = $PATH[$curfile] . $file;
        $file_open = fopen($file , 'r');
        $concat = "\n" . fread($file_open , filesize($file)) . "\n";
        $full_string .= $concat;
        fclose($file_open);
    }

    return $full_string;

在这里，我将所有CSS文件合并为一个。 但是现在的问题是我必须将当前的CSS（$ file）与另一个CSS进行比较（让我们将其视为overrider.css ）。 如果$ file具有类似的样式，

h1 {
    color: white; 
    background: teal; 
    FONT-FAMILY: arial, helvetica, lucida-sans, sans-serif; 
    FONT-SIZE: 18pt; 
    FONT-STYLE: normal; 
    FONT-VARIANT: normal;
}

body 
{
    font-family: arial;
    FONT-SIZE: 14px; 
}

如果overrider.css具有类似的样式，

body 
{
    font-family: Calibri;
    color: #3E83F1; 
}

然后生成的最终CSS（output.css）应该是，

h1 {
    color: white; 
    background: teal; 
    FONT-FAMILY: arial, helvetica, lucida-sans, sans-serif; 
    FONT-SIZE: 18pt; 
    FONT-STYLE: normal; 
    FONT-VARIANT: normal;
}

body 
{
    font-family: Calibri;
    FONT-SIZE: 14px;
    color: #3E83F1;
}

在这里，由于override.css body的样式具有font-family ，它替换了原始CSS中的font-family属性，并且由于color是一个新属性，而该属性在原始CSS文件的（$ file）中不存在，因此应该将该属性添加到原始CSS文件中。 那么如何在PHP中实现此目标，因为我对解析CSS没有任何想法。 任何想法，将不胜感激。

请注意，我需要通过将输入指定为file1（$ file）和file2（override.css）来生成一个新的CSS文件，并且我们需要使用覆盖的样式生成output.css。

提前致谢。

Answer 1

有几个CSS解析器可用（谷歌“的PHP解析器的CSS”），像这一次 ，我没有尝试，但似乎有趣。 但是我个人会自己解析-遵循这种伪PHP算法

• 将所有文件读入一个字符串Str ，用空格替换所有“ \\ n”，“ \\ r”和“ \\ t”（使解析（稍微容易一点））

然后，函数进行处理（选择器=>规则）

func deal with selectors and rules:

rules = array()
do {
  S = string from current pos to next `{` excluded (selectors)
  R = string from '{' to next '}' (rules)
  r = explode(';', R) 
  lr = make array of rules from r trimmed elements
  s = explode (',', S)
  ls = make array of [selector => lr]

  // same sel: latest rule overwrite existing, added if not exist
  merge ls into rules 
} while (not '}' and not '@' and not EOF); // the '}' would be the closing media

return rules

主要功能是处理媒体，然后调用上面的功能

medias = array();

func deal with Str
do {
  if (first non blank char is @) {
     media = array of listed medias
     eat fist '{'
  }
  else {
     media = array ('GLOBAL')
  }
  selectorsrules = deal with selectors and rules(rest of Str)

  foreach (media as m) {
    merge in medias(m) selectorsrules, same procedure as above
  }
} while (not EOF);

有趣的项目，但我没有时间充分实施它。 结果在medias数组中。

Answer 2

如果您想要font-family: arial; 要应用，然后将其添加为font-family: arial !important;

您无需担心合并它们，因为浏览器会自动将颜色从第二个CSS中的第二个CSS添加到body标签中，然后用第二个CSS覆盖它。

Answer 3

您有2个选择：

1. 简单的方法是更改​​您的css文件，并在重要的位置添加！important。 例如，在CSS中多次包含“ body”是正确的。 每当您要覆盖的样式都保留时。 当然，这种方法大部分是手动的。 您必须知道它将在何处被覆盖以及在何处不会被覆盖。

2. 第二种方法需要字符串解析，正则表达式，我的意思是您应该了解字符串广告的解析方式。 您应该获取每个文件的内容，将它们保存到字符串中，并且应该使用正则表达式比较它们是否存在标签，然后合并标签内容。 这种方法很容易说，但很难实现。