Я хочу ввести переменные PHP в таблицы стилей (например, CSS).
Я разработал, что я могу напечатать страницу PHP как таблицу стилей, объявив:
header('Content-Type: text/css');
В верхней части страницы CSS.
Однако переменная, которую я передаю, не отображается в таблице стилей.
В этом случае переменная PHP $css
будет '-webkit-'
, '-moz-'
, '-ms-'
или '-o-'
.
И в таблице стилей я хочу повторить его перед CSS3.
Первоначально я достигал этого, имея отдельный CSS-файл для каждого, но это было бы более эффективным и позволяло бы мне проходить подлинный стиль из базы данных, такой как фоновый цвет и шрифт.
Возможное? Как?
ПРИМЕР. PHP-файл называется ссылкой CSS.
<?php global $css; header('Content-Type: text/css'); ?> .wheel { position:absolute; top:50%; left:50%; height:32px; width:32px; margin:-16px; <?php echo $css;?>transition:opacity 0.3s; } .wheel li { width:3px; height:9px; border-radius:2px; background:#555; <?php echo $css;?>animation:loading 1.2s infinite; position:absolute; <?php echo $css;?>transform-origin:2px 16px; left:16px; opacity:0; box-shadow:inset 0 0 2px rgba(255,255,255,0.4); } @<?php echo $css;?>keyframes loading { 0% {opacity:0.2;} 50% {opacity:0.9;} 100% {opacity:0.2;} }
Вы делаете это так же, как и с HTML:
<?php header('Content-Type: text/css'); $css = $_GET['css']; // or wherever your're initializing the variable from... ?> body { <?= $css ?>border-radius: 3px }
Но я не думаю, что это необходимо для вашего случая использования. На самом деле не редкость статически включать все различные опции -*-
в файл css:
body { -moz-border-radius: 3px; border-radius: 3px; }
Просто добавьте все эффективные варианты, и браузер определит, какие из них наиболее эффективны. Это также означает, что вы избегаете скучной и подверженной ошибкам задачи браунинга.
Если вы просто хотите использовать переменные в своем css (не обязательно php), вы можете рассмотреть возможность использования меньше
Расширение SASS CSS позволит вам использовать переменные без фактического использования PHP и нижних сторон, которые приходят с ним. Mixins упростит создание правил стиля для конкретного поставщика.
@mixin vendor-prefix($name, $argument) { -webkit-#{$name}: #{$argument}; -ms-#{$name}: #{$argument}; -moz-#{$name}: #{$argument}; -o-#{$name}: #{$argument}; #{$name}: #{$argument}; } p { @include vendor-prefix(hyphens, auto) }