WEBデザイナーな方向けのPHP入門によさそうな、CSS内でPHPで使うサンプル
2009年04月15日-
スポンサード リンク
PHP Tutorials Examples Embedding PHP In CSS
WEBデザイナーな方向けのPHP入門によさそうな、CSS内でPHPで使うサンプル。
CSSファイルをPHPとして実行して共通の値を変数にして使うというチュートリアルが公開されています。
PHPは知ってるという方には当たり前すぎるかもしれないですが、WEBデザイナーの方が最初に入門するにはよいかも。
ステップ1
AddType application/x-httpd-php .css
.htaccess等に、AddTypeを追記して、.cssファイルがphpとしてサーバ側で処理されるように指定
ステップ2
<link rel="stylesheet" href="style.php" media="screen">
linkタグでphpファイルをcssとして扱う
ステップ3
ソースコード記述
<?php
// ヘッダ出力
header("Content-type: text/css");
// 色指定
$para_color = '#0000ff';
// ヘッダサイズ
$heading_size = '2em';
// ヘッダ色指定
$heading_color = '#c0c0c0';
?>
p{
color: <?php echo $para_color; ?>;
font-weight: bold;
font-size: 1.2em;
text-align: left;
}
....
最初に変数を定義しておいて、必要に応じて echo しています。
CSSは知っていて、PHPをやってみたいという方には有用かもしれません。
同じ値を変数で使えるため、CSS開発自体もグッと楽になるはずなので、そういう用途だけでも使えるようになると効率化につながりそうです。
ちょっとずつ覚えていって、if とかも入れていくと、cssだけではできないいろいろなことが可能になるはずです。
もちろん、毎回cssに対してアクセスをおこなうので、多少サーバの負荷は増えます。
気になる方は、Expiresヘッダの発行によってブラウザにキャッシュさせたりする方法も必要かもしれません。
スポンサード リンク
Advertisements
SITE PROFILE
最新のブログ記事(新着順)
- 個性的な明朝フリーフォント「築豊初号明朝OFL」
- CSSで太陽が差し込むようなアニメーション実装
- 可愛くアニメーションする「beautifully crafted animated icons」
- アイソメトリックなアイコンがアイコンがPNG,SVGでゲットできる「Isoicons」
- ユニークなカタカナフォントtorisippo
- 美しいメッシュグラデーションをCSSで簡単に取得できる「MSHR」
- TailwindCSSなサイトで使える100以上のアニメーションエフェクト「animata」
- SVG形式のテック系企業のロゴを簡単にゲットできる「Svgl」
- 統一感のある色味を一括生成できるツール「The good colors」
- くちばしフォント【商用可】
- 過去のエントリ