Hatena::ブログ(Diary)

ミショニポー このページをアンテナに追加 RSSフィード

Feedback

Menu Tags

2012-03-29

less に関する子ネタ

f:id:tenman:20120329130335p:image:medium:left

lessPHP を搭載したWordPressテーマ obandesでless を使うとこんな事が出来るよというスニペットを書いたのですが、その件について、


obandes0.99のアップデートで、それぞれの投稿から、その投稿を表示された時にだけ適用されるless スタイルを書く事が出来るようになりました。

lessという名前のカスタムフィールドを作成して、値にlessのコードを書く事が出来ます。



テーマオプションパネルのCSSエディタに、ブログ全体で使うようなmix inなどを記述しておいて、個別ページで使いまわす事が出来るよという考え方です。


CSSで、特殊なグラデーションを書いたりすると、ベンダープレフィックスを含んだスタイルルール一々書かなくてはなりません、再利用性も乏しいものですが、lessを使うと

.examples{
.bg-arrow();
.title-entry();
width:100%;
height:168px;
padding-top:100px;

}

.bg-arrow();と書くだけで、スタイルをピンポイントで充てられます。

画像を、background:url(http://....);と書く感覚で、ふくざつなCSSを使いまわせますよ。


さらに、bodyには、ブラウザ名のクラスが自動的に入ってしまうので、例示のようなやんちゃなスタイルを書いても、IEレイアウトがぶっ飛んでしまうという事も、何とかなってしまうわけです。


ということで、obandes テーマ使ってちょーだい


TOP
keywordcloud
人力検索はてな はてなアンテナ はてなブックマーク はてなダイアリー はてなフォトライフ はてなグループ はてなグラフ はてなアイデア はてなスター はてなメッセージ はてなワールド はてなハイク Rimo
ページビュー
703796

サービス

メモや備忘

ナンダーリン カンダリーン

カレンダー
<< 2012/03 >>
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31
プロフィール

最近のコメント

砂場