Использование PHP для улучшения моего CSS

Question

Я хочу внести некоторые изменения в то, как я использую свой CSS. Я хочу иметь возможность использовать переменные для определения цветов или чего-то еще. Так что я мог бы сделать следующее

var red = '#FF0000';

И, конечно, красный будет заменен на '# FF0000' в случае необходимости.

Как я могу это сделать? Я вроде как знаю, я просто не знаю регулярных выражений или даже если это лучший способ сделать это.

Answer 1

Вы можете сделать это. Просто напишите свой php в свои файлы .css так же, как это делает файл HTML, а затем скажите своему веб-серверу (возможно, apache) проанализировать этот файл с помощью php.

Вы можете добавить это в файл .htaccess в вашем каталоге css:

AddHandler php5-script .css

Тем не менее, это плохая техника, поскольку она замедляет загрузку ваших CSS-файлов и предотвращает значительную разницу в скорости кэширования конечного пользователя. Это может быть удобный ярлык для веб-сайтов, которые не заботятся о производительности.

Answer 2

Лучший способ справиться с этим - создать несколько файлов шаблонов, а затем обработать их с помощью php-скрипта и вывести плоские CSS-файлы. Вы можете покопаться в интернете и найти какой-нибудь хороший минимизатор CSS, пока вы в нем, чтобы выжать немного больше производительности. Несколько вещей, которые нужно иметь в виду:

1) Безопасность - если ваш скрипт компоновщика будет запускаться через Интернет, вероятно, разумно было бы хранить файлы шаблонов вне корневого веб-каталога. Если бы это был я, я бы держал и компоновщик, и шаблоны вне веб-корня и запускал скрипт компоновщика из командной строки.

2) Если ваш CSS достаточно сложен, чтобы это действительно стоило, подумайте долго и усердно о «названиях вещей». $ red не особо хорошее имя. Поскольку теперь он переменный, в какой-то момент $ red может на самом деле быть синим (как в # 00F)! Каждый раз, когда я делал это, придумывать описательные имена для переменных, представляющих значения в таблице стилей, было настоящей загадкой.

РЕДАКТИРОВАТЬ: В то время, как я ответил на это, я нашел компас , который решает эту проблему, и более того, довольно удобно. Определенно стоит посмотреть, прежде чем пытаться развернуть свою собственную динамическую систему CSS.

Answer 3

Вы можете сделать что-то вроде:

style.css.php

<?php
    header('Content-type: text/css');

    $red = '#F00';
?>

body {
    background: <?=$red?>
}

Это должно работать нормально.

Answer 4

Возможно, лучший способ сделать то, что вы ищете, это использовать CSS Framework. Взгляните на CSScaffold

Вы можете очень легко определить константы:

@constants {
  red: #f00;
}

Одна из лучших частей - вы можете использовать миксины для включения стилей CSS в любой селектор.

Answer 5

Сначала как Пол Макмиллан сказал добавить это в свой файл .htaccess (код может отличаться в зависимости от того, какую хостинговую компанию вы используете)

AddHandler php5-script .css

Во-вторых, ваш whatever.css файл должен выглядеть примерно так (например, для динамического изменения фона заголовка)

<?php header('Content-type: text/css'); ?>
#header {
  background-image: url("http://myurl.com/images/<?php switch (rand(0,4)) {
case 0:
    echo 'green';
    break;
case 1:
    echo 'red';
    break;
case 2:
    echo 'blue';
    break;
case 3 :
    echo 'purple';
    break;
case 4:
    echo 'orange';
    break;
}
?>.png");
}

Answer 6

Столкнувшись с этой же проблемой, я поместил столько же неизменяемых CSS во внешний файл CSS и повторил CSS, который превратился в заголовок файла HTML / PHP. Это избавляет от желания иметь все ваши css во внешних файлах, но стоимость создания нестандартных конфигураций Apache не стоит догматической необходимости иметь внешние css файлы.