ボーダーで三角形などを作るときには transparent ではなく rgba() で | Unformed Building

2012/10/03 66 users border-width borde div height

よく CSS のボーダーを使った三角形の作り方が紹介されていますが、あれに使われている透明なボーダーのことで少し。 たとえば、こういう HTML と CSS で三角形を作るとしましょう。よく見るタイプだと思います。 <div class="test1"></div> .test1 { width: 0; height: 0; border-width: 0 200px 200px 0; borde... 続きを読む

CSS でつまづいたポイント ― transparent, transition, box-sizing | Unformed Building

2011/11/24 84 users Ｔｒａｎｓｉｔｉｏｎ box-sizing CSS 過去 自分

CSS でつまづいたポイント ― transparent, transition, box-sizing 過去に CSS でつまづいたポイントとかメモしておこうと思います。 このくらい分かっとけと言われそうですが、まあ自分はその程度だということで。 transparent について CSS グラデーションで何か黒くなるなーと思ったら、transparent を使っていないかどうか見てみましょう。 ... 続きを読む

[CSS]テキストに面白いエフェクトを与えたデモと実装の注意点 | コリス

2011/04/26 77 users コリス CSS text-shadow 実装 デモ

下記は各ポイントを意訳したものです。 テキストにブラー効果を与える方法と注意点 テキストにブラー効果を与えたデモ テキストにブラー効果を与える方法と注意点 テキストにぼんやりとさせるブラー効果を与えるのは、簡単です。テキストのcolorを透明にし、text-shadowを使用します。 .blurry-text { color: transparent; text-shadow: 0 0 5px r... 続きを読む