前の記事 ≪:フリーの画像素材が入手できるサイト色々
次の記事 ≫:有用なPDF資料を検索できる「PDF Books Search Engine」

WEBデザイナーな方向けのPHP入門によさそうな、CSS内でPHPで使うサンプル

2009年04月15日-はてなブックマーク

スポンサード リンク
[PR] 英単語を忘却曲線アプリを使って超効率よく記憶する方法

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ヘッダの発行によってブラウザにキャッシュさせたりする方法も必要かもしれません。

関連の記事検索:PHP, CSS, Web制作, Webデザイン, チュートリアル, あとで読む
スポンサード リンク

By.KJ : 2009年04月15日 10:05 livedoor Readerで購読 Twitterに投稿

間違いの指摘をしていただける方はメール、あるいはTwitter/FBでお願いします(クリック)