为什么Sass或LESS可以直接使用PHP？ [关闭]

So I've been looking at Sass and LESS for a PHP project. I've always thought that CSS needed some 'programability' to conform to decent software engineering practices (define it once and use it everywhere etc.)

So years ago I started writing CSS using PHP to generate the CSS. Here's a (semi-contrived) snippet: [myCSS.css.php]

<?php
    header('Content-Type: text/css');
    require_once 'Config.php';
    echo <<<CSS
#container        {
                width: $containerWidth$widthUnits;
                min-height: $containerHeight$heightUnits;
                height: auto !important;
                height: $containerHeight$heightUnits;
                color: $containerFG;
                background-color: $containerBG;
                border-color: $containerBorder;
                }
CSS
?>

Why go down the Sass/LESS, Compass path when you can carry on using PHP and share the definitions across your code and CSS? It also avoids using a lot of extra tools that increase the complexity of support, maintenance, updates and training.

One obvious objection is that there is a run-time overhead on the server of generating the CSS output. That's easily answered by having the PHP code generate and serve the CSS only if the .CSS.PHP file has changed - a simple form of cacheing.

I have a more complex form of caching where the single CSS.PHP file merges content from multiple CSS source files, handles all of the includes and flings them back to the client. This saves on multiple HTTP GETs, improving page load times considerably. I'm happy to share the code if anybody is interested. It's about 50 lines (of code, not including comments) long.

I can see that you might be forced to use Saas/LESS if you want or have to use Foundation or Bootstrap or similar but I think that the answer to that is to have a decent PHP-based responsive framework.

So, why would I chose Saas or LESS instead?

It'd probably be worth you reading up on the separation of concerns. Without going into to much detail, separating style andcontent means that they are loosely coupled and can be changed without impacting the other.

In your example, SASS or LESS are styling languages that extend CSS and allow for additional capability. While what they provide could be done in PHP, that means a designer now needs to understand PHP to be able to make changes to the style of the page.

For a personal project, a roll-your-own PHP solution might be suitable, but as a project grows and more people become involved, having a clear separation of roles becomes important.

With regards to SASS and LESS specifically, they provide hierarchical ways to define styles, as a short example:

ul {
    color: green;

    >li {
        color:red;
    }
    a {
        colour:blue;
    }
}

is equivalent to:

ul      { color:green }
ul > li { color:red   }
ul   a  { color:blue  }

They are designed around the cascading hierarchy of HTML and CSS in a way that PHP isn't.