hr 要素が未だに廃止予定にないので、たまに記事の中で使ってますが、align, noshade, size, width 属性が廃止予定なのと CSS の border 関係のプロパティと見た目が余りに違うので、統一して使用してます。この記事では、その見た目を同じにする CSS の小技を一つ…

1. hr
2. {
3.   padding: 0em;
4.   border-top: 1px solid #dcdcdc;
5.   border-left: none;
6.   border-bottom: none;
7.   border-right: none;
8.   color: #212121;
9.   background-color: #212121;
10. }

斜体部分の色指定はお好みで…因みにこんなのでもいいです

1. hr
2. {
3.   padding: 0em;
4.   border: none;
5.   border-top: 1px solid #dcdcdc;
6.   color: #212121;
7.   background-color: #212121;
8. }

参照

• hr 要素
• border

この件で検索を行っても CSS を PHP のヒアドキュメントとして、記載する方法が見つからなかったのでメモとして記事にします

CSS を記載する方法としては style 要素の中に記述するか、link 要素の中にスタイルシートの URI を記載して UA に読み込ませると言う 2つの方法がありますが、今回、ここで記載するのは後者の方です。何故この様な事を考えたかと言うと、いい加減此処の超カオス気味のスタイルシートを何とかしたいと思った次第です

PHP の公式マニュアルによると PHP: 基本的な構文 - Manual たいていの場合、PHP は HTML ドキュメントの中に埋め込まれます と記載されています。たいていの場合？ では、別に HTML でなくてもいい訳です。参照先にその具体例が記載されています。そこで、まず行ったのが HTML の head 要素内の link 要素を以下の様に修正

<link rel="stylesheet" type="text/css" href="filename.php" media="all" />

スタイルシートを指定しているファイルのサフィックス部分が php になっている所がポイント。で、実際のスタイルシートファイル(.php) は以下の様に記述します

@charset "UTF-8";
<?php
  $color = 'pink';
  $background = 'green';
?>
body {
  color: <?php echo $color; ?>;
  background-color: <?php echo $background; ?>;
}

ブラウザをリロード行っても…真っ白けです。どぎつい配色になるはずなんですが、これはスタイルシートが適用されていないようです。つまり、UA がスタイルシートとして認識しなかったようです。そこで Proxomitron ¹ のログウィンドウを開いて、もう一度リロードを行います。案の定 PHP が HTTP レスポンスヘッダー Content-Type のメディアタイプに text/html として返しています。これが原因の様です。つまり、スタイルシートならばメディアタイプを text/css として返さなければならないのに UA に対して HTML 文書ファイルですよ。と、返してしまっている訳です。これは、PHP の設定 default_mimetype が text/html となっているので正常な動きです。そこで、スタイルシートファイル(.php) を以下の様に修正します

<?php header('Content-Type: text/css; charset=utf-8'); ?>
@charset "UTF-8";
<?php
  $color = 'pink';
  $background = 'green';
?>
body {
  color: <?php echo $color; ?>;
  background-color: <?php echo $background; ?>;
}

どうってことはありません。header 関数にてデフォルトのヘッダーを置き換えてやっているだけです。ブラウザを再度リロードするとスタイルシートが認識されました。本来ならば、ここで終了なんですが、link 要素のファイル名の指定が php となっているのがどうもかっこよくない。そこで、HTTP サーバーのアクセス制御ファイルを以下の様に記述します ²

<FilesMatch "filename\\.css">
  SetHandler application/x-httpd-php
</FilesMatch>

あとは、HTML の head 要素内の link 要素のファイル名指定部分の php を css に変更。実際のファイル名も css に変更。実際にブラウザをリロードしてアクセス制御ファイルが効いているか確認して終わりです

これには色々と応用が効きます。各 UA に対応させる為に UA のバグを逆用して苦労してスタイルシートの読込みの振り分けなどを行っている様ですが、PHP 変数の $_SERVER["HTTP_USER_AGENT"] で判定を行えばいいのです。³ 他には、色を容易に変更できる様に PHP の変数としておけば、変数の値を変更するだけで配色の変更が可能です。などなど…PHP コードが記述できるので、良いと思います ⁴

1. 私が常用している HTTP フィルタリングソフト。参照: Proxomitron-J
2. Apache HTTP Server の場合
3. $_SERVER["HTTP_USER_AGENT"] は UA によっては偽装できるので完全に振り分けることは不可能です
4. PHP が動かせて、なおかつ、HTTP サーバーアクセス制御ファイルが置けない環境じゃないと意味ありませんが…