CSSで白抜き文字を作る方法。text-shadowで囲んでみよう。（CSS おれおれ Advent Calendar 2012 – 03日目） | Ginpen.com
また影をカンマ,で区切って複数指定する事ができるので、ぼかしなしの影で囲ってやると、白抜きにしたり縁取りしたり出来ます。 割とよく使えるんじゃないかなーって思います。 実例 手前味噌ではありますが、過去に作ったサービスのロゴのところ、この方法でスタイルしてます。 外面さん 注意点 複数指定できるんですが、継承は全体でひとつです。 つまり白抜き文字でスタイルされている要素にクラスを追加して影付きにした場合、白抜きで使用していた元の影は消えてしまいます。 当たり前といえば当たり前なのですが、ついついやってしまいがちなので、気を付けましょう。 下が切れる問題 ちなみにGoogle Chromeで”g”などの下の部分がうまく影が付かないようです。 真下（x 0px, y 1px）の指定を先頭に付けると、うまく行く場合があるみたい。うーん、なんだろう。他にも影の指定数があまり多いと駄目だったりします
HTML5カンファレンス2012の資料まとめ
HTML5カンファレンス2012の講演資料のまとめです。 HTML5カンファレンスは非常に有意義なものでした。講演頂いた方、スタッフの皆様ありがとうございます。 HTMLとかCSSとかAPIとか -2012秋編-（矢倉眞隆さん） HTML5 や CSS3 の新しいタグやプロパティについての解説。 でもその前に、W3C と WHATWG についての話。 一部のメディアで、W3C と WHATWG が決裂したかのような報道がされたが、実際は問題ないとのこと。 W3C と WHATWG の Editor を務めていた Ian Hickson氏は WHATWG の HTML に集中し、バグ修正が加速しそうです。 セッションでは紹介されていませんでしたが、こちらの記事に Ian Hickson氏からのメールの邦訳など載っています。 HTML5仕様をめぐるW3CとWHATWGについて、Ian Hick
border-image を利用したボックスデザイン
border-image を利用したボックスデザイン border-image プロパティは装飾の幅を広げてくれそう。使うにあたっていろいろ調べたので、サンプルなどを用意して整理しておくことにした。 まずは現在の草案（2009年10月15日版）を読んで、関連プロパティや、設定できる値など、仕様の概要を簡単に整理したものを箇条書きにしてみる。 要素の border-style?プロパティと background-image プロパティの代りに使う画像を設定する。画像は四辺それぞれには必要なくて、ひとつだけ用意すればよい (border-image-source) 画像の四辺それぞれから内側にスライスする位置を設定、画像は四つの辺、四つの角、中央の9つに分ける。中央は背景画像のように使われる (border-image-slice) 四つの辺の高さを設定する (border-image-wid
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
