モノラルログ

マツオ ( @matsuoshi / monaural.net ) のざっくりしたブログです

css

カスタム・プロパティと cssnext

先日、勉強会 CSS Talk で話したので、そのときのスライドを Speaker Deck から貼り付けるテスト。 speakerdeck.com イベントレポート的な記事は、会社のブログに書きました。 www.tam-tam.co.jp

Glyphicons などのアイコンフォントを CSS の before とかで表示させる

アイコンフォントの表示のさせ方。 たとえば Twitter Bootstrap にも入っている Glyphicons とかだと空の span 要素にクラスつけて表示させる感じですね <span class="glyphicon glyphicon-map-marker"></span> それを CSS だけでやりたい場合。フレームワークが吐き出す html に、CSS の after やら before やら…

foundation 5 の CDN

css

foundation 5 の CDN、これが公式なのかな、ドメインが zurb.com だしそうだよね <link href="//cdn.foundation5.zurb.com/foundation.css" rel="stylesheet"/> <script src="//cdn.foundation5.zurb.com/foundation.js"></script> ※ foundation は、Twitter bootstrap みたいな CSS フレームワークのひとつ</link>

Zen-Coding の CSS のチートシート

Zen Coding で html をパパっと書くのはけっこう慣れてきたんですが、CSS をパパっと書くのはほとんどやったことなかったなあ、ちゃんと覚えたいなあと思いまして、とりあえずチートシートを探してみました。 Zen-Coding のオフィシャルに PDF があったんで…

「CSSだけで作れる吹き出しボックス」の簡易版 (空span無し)

css

先日話題になってた、css だけで吹き出しボックスを作るやつですけど、 これは驚きの、CSSだけで作れる吹き出しボックス:phpspot開発日誌http://phpspot.org/blog/archives/2009/04/css_84.htmlFun With CSS Shapes - Nettuts+http://net.tutsplus.com/video…

IE用のスタイルシートの話

css

恥ずかしながら最近知ったんですけど、もうIE6用に css をどうのこうのするのはこの方法でいいかなと思っています。 <link rel="stylesheet" href="基本スタイルシート.css" type="text/css" media="screen" /> (注:なぜか記事個別ページだとうまく表示されないので、その場合はこちらを見てね)IE独自の条件付コメ…</link>