Интеграция стилей CSS с PHP: варианты решений

Как создать отдельный CSS файл, который генерируется PHP?

Альтернативный вариант - создание файла style.php, который выводит CSS с правильным заголовком Content-Type: text/css. Это позволяет браузеру кэшировать стили отдельно от HTML.

Пример файла style.php:

<?php
header('Content-Type: text/css; charset=utf-8');
// Параметры можно получать через GET
$primary_color = isset($_GET['primary']) ? $_GET['primary'] : '#336699';
$secondary_color = isset($_GET['secondary']) ? $_GET['secondary'] : '#66ccff';
// Экранирование для CSS (удаление недопустимых символов)
$primary_color = preg_replace('/[^#0-9a-fA-F]/', '', $primary_color);
$secondary_color = preg_replace('/[^#0-9a-fA-F]/', '', $secondary_color);
?>
body {
    background-color: <?php echo $primary_color; ?>;
    color: <?php echo $secondary_color; ?>;
}
h1 {
    border-bottom: 2px solid <?php echo $secondary_color; ?>;
}

В HTML подключается как обычный CSS:

<link rel="stylesheet" href="style.php?primary=%23336699&secondary=%2366ccff">

Цели: разделение стилей и контента, кэширование, возможность использовать GET-параметры для настройки темы.

Как применить уникальные стили к каждому элементу через атрибут style?

Inline-стили удобны для быстрой настройки отдельных элементов, но злоупотребление ведёт к нечитаемому коду. В PHP можно генерировать атрибуты динамически.

Пример: отображение товаров с разной ценой и соответствующим цветом.

<?php
$products = [
    ['name' => 'Товар 1', 'price' => 100],
    ['name' => 'Товар 2', 'price' => 250],
    ['name' => 'Товар 3', 'price' => 50],
];
foreach ($products as $product) {
    $style = 'color: ' . ($product['price'] > 200 ? 'red' : 'green') . ';';
    echo "<p style=\"$style\">{$product['name']} - {$product['price']} руб.</p>";
}
?>

Когда применимо: для виджетов с уникальными размерами, цветовыми индикаторами, анимациями, которые нельзя задать через классы.

Как использовать препроцессоры Less/Sass в PHP-проекте без внешнего сборщика?

Библиотеки, такие как lessphp или scssphp, позволяют компилировать Less/Sass непосредственно в PHP. Это полезно, когда нужно менять переменные препроцессора динамически.

Пример с scssphp:

<?php
require 'vendor/autoload.php'; // если используется Composer
use ScssPhp\ScssPhp\Compiler;

$compiler = new Compiler();
$compiler->setImportPaths('path/to/scss/');

// Переменные, которые можно менять
$variables = [
    '$primary-color' => '#336699',
    '$font-stack' => 'Helvetica, sans-serif',
];
$compiler->setVariables($variables);

$scss_content = file_get_contents('style.scss');
$css = $compiler->compileString($scss_content)->getCss();

// Вывести или сохранить
header('Content-Type: text/css');
echo $css;
?>

Случаи использования: динамические темы, сборка стилей на сервере при отсутствии Node.js, быстрые прототипы.

Как присваивать CSS-классы элементам в зависимости от условий?

Это не генерация стилей, а управление классами. Однако это важная часть применения CSS в PHP - правильное использование классов упрощает стилизацию.

Пример: выделение текущей страницы в навигации.

<?php
$current_page = basename($_SERVER['PHP_SELF']);
$menu_items = ['index.php', 'about.php', 'contact.php'];
foreach ($menu_items as $item) {
    $class = ($current_page === $item) ? 'active' : '';
    echo "<a href=\"$item\" class=\"$class\">$item</a> ";
}
?>

В CSS затем: .active { font-weight: bold; }

Существуют ли библиотеки CSS-in-PHP, похожие на CSS-in-JS?

Прямых аналогов styled-components для PHP нет, но можно реализовать подобный подход с помощью генерации CSS-объектов и последующего рендеринга в <style>. Например, класс CssBuilder.

Пример самодельной библиотеки:

<?php
class CssBuilder {
    private array $rules = [];
    
    public function addRule(string $selector, array $properties): self {
        $this->rules[$selector] = $properties;
        return $this;
    }
    
    public function render(): string {
        $css = '';
        foreach ($this->rules as $selector => $props) {
            $css .= "$selector {\n";
            foreach ($props as $prop => $value) {
                $css .= "  $prop: $value;\n";
            }
            $css .= "}\n";
        }
        return $css;
    }
}

$builder = new CssBuilder();
$builder->addRule('.my-class', [
    'background' => 'blue',
    'color' => 'white',
    'padding' => '10px',
]);
echo '<style>' . $builder->render() . '</style>';
?>

Такой подход изолирует стили для компонентов, что улучшает поддерживаемость.