画像に影を付ける(box-shadow examples) | らい氏のブックマーク

らい氏のブックマーク

気になったことを書いているブログです。

画像に影(shadow)を付けたいときに使えるwebツールを紹介します。

 

 

 

 

CSS box-shadow examples

 

 

・CSS box-shadow examplesの使い方

 

一覧リストの中からドロップシャドウを選択、クリックするだけで、コードをコピーできます。

 

 

 

 

コピーしたコード

(box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;

 

サンプルコード

(アメブロ使用 例)

  1. <img alt="" height="320" src="画像URL" style="box-shadow:rgba(0, 0, 0, 0.24) 0px 3px 8px;" width="200">

 

画像URL"の後ろに、さきほどコピーしたのを張り付けます。

「 style="box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;"

 

(イメージ図)