WordPress テンプレートの XHTML が完成した!

まだ CSS を書いていないのでひとり CSS Naked Day ですが、条件分岐と functions.php をうまくつかって index.php (+ モジュールいくつか)にすべて収めることができました。

つい先日までは PHP なんて意味がわかりません!と拒絶反応が出ていたのに、レベルが低いなりにすごい進歩ですヽ(・ω・)ノ
CSS に例えて言うと、書式がなんとなくわかって、外部 CSS の読み込み方法がわかって、color: red; って書いたら文字が赤くなるんだすげー!と感動しているあたりだと思います。たぶん。
今後の過程も同じだと仮定すると(高度なギャグですいません)、作りたいものやりたいことがあるたびに調べてググって悩んでちょっとずつ覚えていけると妄想。

今のところ PHP で何ができるのかを知らないので WordPress のテンプレートが書けたことで大満足していますが、小さなことからコツコツと頑張ります。
次は MovableType のテンプレート書いちゃうよ!・・・その前に完成した XHTML の CSS を書くよ!

CSS プロパティ記述順とフォントサイズ一覧

CSS プロパティの記述順は CSS2 Specification に挙げられている順番で記述しています。
hail2u.net – Weblog – CSS2 Specificationでのプロパティの出現順序
順番は大体覚えているのですがときどきど忘れしたりすることもあるので確認用メモを作ってありましたが、ボロボロになってきたので作り直しました。

CSSプロパティ+フォントサイズ.pdf
CSSプロパティ+フォントサイズ.pdf

  • 大きさは A4 横で高さが半分くらい、横幅は 5cm くらい余るくらいです。
  • 色は目に優しいグリーン。
  • 角を立てずに角丸で。
  • よく使いそうなプロパティは赤い文字になっています。
  • 33. top ? 36. left が緑の文字になっているのは何かの間違いですが気にしなーい。

よかったらダウンロードしてお使いくださいませ。

p15_001 テンプレートひとまず完成

季節外れ?いいえ8ヶ月くらい先取りです!
外の雪がなくなるまではこれで引っ張ります。

snowsRide

ベースは wp.vicuna で XHTML 部分も少し改造しつつ CSS は自分で一から書きました。
Windows XP: IE7, IE6, Firefox2, Opera9, Netscape7・Mac OSX: Firefox2, Safari3 で確認しています。
IE6 は透過 png が使えない箇所があったりなど、若干表示が異なる部分があります。
表示が変だよ!とか見づらいとかありましたらお知らせくださいませ。粗探しばっちこーい!

今回頑張ったのは右上の navigation open をクリックでメニューがうにょーんとするところ。
メニュー最下部のタグクラウドは Tag Cloudのスタイルを参考にさせていただきました。
まだ全部の記事にタグつけてないのでなんだかさみしー。
JavaScript(jQuery)でいろいろやっていますが JavaScript オフの環境だとメニューが出っぱなしでちゃんと動作するようになっています。

実は一番頑張ったのは完成間近に IE6 と IE7 が共謀して反乱を起こしたのを鎮めることでした。
最近すっかりなついてくれていたと思ったのに騙されたわ!なまら疲れた!

続きを読む p15_001 テンプレートひとまず完成

スタンドアローン版 IE6 で透過 png を背景として表示したい

ユンサンの/???/YungSang’s: 透過PNG と IE と IE7 まとめ
この JavaScript を利用して背景に指定すると通常の IE6 では透過 png が表示されるのですが、スタンドアローン版の IE6 では透過されずに表示されてしまいます。

RedLine Magazine : IE6 standalone の落とし穴
こちらの記事では evolt.org – Browser Archive のスタンドアローン版ではダメだけど Install multiple versions of IE on your PC | TredoSoft のスタンドアローン版だといけるとのこと。
私が愛用していたのは evolt.org の方だったので早速 multiple IE をインストール!が、やっぱり透過されません。
これは・・・日頃の行いが悪いんだろうか(´・ω・`)

続きを読む スタンドアローン版 IE6 で透過 png を背景として表示したい

DOAS で CSS に情報を表示してみる

CSS に DOAS を使ってみることにしました。
のさんの記事 DOASでCSSの概要を記述する – VERSIONFIVE や、神崎さんの解説 ちょっとしたメモ – DOASとTurtle/RDF で導入方法がわかりやすく書かれています。
のさんの記事を見て興味を持ったのがきっかけで、vicuna のスキンでも利用されているのが決定打となりました。
統一規格だと何だか安心なのと、CSS に限らず JavaScript や PHP なども共通のフォーマットで記述できるところがステキです。

DOAS を使いたいがために JavaScript とかやってみたくなりました!
いろんな言語で Hello World! を作って DOAS を書いてみようかな(`・ω・´)