[CSS3,影]よく使う影(box-shadow)をまとめてメモっとく ※オレ用に

久しぶりの更新ですがな。
今回はbox-shadowでよく使うものをメモっておこうと思います。
ググれば似たようなものがたくさん出てきますけど、オレルールでプロパティを整理してメモっとこってお話です。

まずはbox-shadowのブラウザ対応はどうなってるかを見てみましょう。
box-shadow
はい。IE9位上ですね。はい。

では早速。

下に四角でサイズちょっと小さめ

box-shadow
htmlは共通なんですけど一応
html

SASS

CSS

下の角が両方ともめくれた感じ

box-shadow
html

SASS

@mixinを使ってますん。
CSS

ゲロ長いけどコピペでいけるはずですん。

右下がめくれた感じ

box-shadow
html

SASS

CSS

右下がめくれた感じ

box-shadow
html

SASS

CSS

真下にまるっこい影

box-shadow
html

SASS

@mixin使ってますん。
CSS

これもゲロ長いけどコピペね。

まとめ

ボクがよく使うのはこの5つです。ウソです。5つ目はあまり使わないです。てか使ったことないです。ごめんなさい。
とりあえずメモなので、どれもコピペで使えるはずです。

それはそうと、明日は市内に用事を作って直帰しまーすのノリでレイトショー行きたいんだけどどうでしょー。
恐竜がガブガブするやつ見たいのよね。←ジュラシックワールド

スポンサーリンク
  • このエントリーをはてなブックマークに追加
  • Evernoteに保存Evernoteに保存
スポンサーリンク