gakkieのBlog

wordpressのテーマをYUIで作ろう-その2

このエントリーを含むはてなブックマークはてなブックマーク - wordpressのテーマをYUIで作ろう-その2 この記事をクリップ!Livedoorクリップ - wordpressのテーマをYUIで作ろう-その2 Yahoo!ブックマークに登録 BuzzurlにブックマークBuzzurlにブックマーク @niftyクリップに追加 このエントリをつぶやくこのWebページのtweets Share on Tumblr FC2ブックマークへ追加 newsing it! この記事をChoix! Googleブックマークに追加 Bookmark this on Delicious Digg This FriendFeedで共有

前回は、Wordpressのテンプレートを作成するところまで行いました。

何もない状態

以下では、
(WPをインストールしたディレクトリ)/wp-content/themes/gakkie_original
で作業を行っています。

(本サーバでは該当ディレクトリはほとんど削除致しました。)

というわけで、今回はCSSを適用していきます。

この記事のタイトルには「YUIで作ろう」とあります。
これは、YUIのCSSを使おうという意味です。

今日はYUIのCSS Resetを利用して、ブラウザのデフォルトCSSを擬似的に無効にします。

まず、YUIのCSSをheader.phpで読み込みます。

[css]
\ [/css]YUIはyahooのサーバにあるものをそのまま利用しちゃいます。
これだけで、下のようなデザインになっちゃいました。
h2で表示されるはずの記事のタイトルも、記事内の文章も同じ大きさになってしまっています。YUI CSS Reset

次回は、YUI CSS Gridを適用し、デザインの骨組みを決めようと思います。




Leave a Reply