日曜日と昨日と、復元に苦戦して改めて感じたバックアップの大切さ。
そこばかり熱弁してしまいましたが、バックアップの大切さは感じていても、方法がわからない…という場合もありますね。
バックアップ方法の記事、只今準備中
その前に今日は、
先日ご紹介した影付きの囲み枠、「丸い枠もあればなぁ~」ってコメントいただきましたので、角丸バージョンやってみます
影のついた角丸囲み枠
~ グリーングラデーション ~
~ グリーングラデーション ~
<div style="padding: 25px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; background: #fff; box-shadow: 0 0 50px #A1D784 inset, 5px 5px 0 #cecece; -moz-box-shadow: 0 0 50px #A1D784 inset, 5px 5px 0 #cecece; -webkit-box-shadow: 0 0 50px #A1D784 inset, 5px 5px 0 #cecece;">★★★好きな言葉を入れてくださいね★★★</div>
影のついた角丸囲み枠
~ ピンクグラデーション ~
~ ピンクグラデーション ~
<div style="padding: 25px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; background: #fff; box-shadow: 0 0 50px #FFB0D8 inset, 5px 5px 0 #cecece; -moz-box-shadow: 0 0 50px #FFB0D8 inset, 5px 5px 0 #cecece; -webkit-box-shadow: 0 0 50px #FFB0D8 inset, 5px 5px 0 #cecece;">★★★好きな言葉を入れてくださいね★★★</div>
影なし角丸囲み枠
~ グリーングラデーション ~
~ グリーングラデーション ~
<div style="padding: 25px;-moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; background: #fff; box-shadow: 0 0 50px #A1D784 inset; -moz-box-shadow: 0 0 50px #A1D784 inset; -webkit-box-shadow: 0 0 50px #A1D784 inset;">★★★好きな言葉を入れてくださいね★★★</div>
影なし角丸囲み枠
~ ピンクグラデーション ~
~ ピンクグラデーション ~
<div style="padding: 25px;-moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; background: #fff; box-shadow: 0 0 50px #FFB0D8 inset; -moz-box-shadow: 0 0 50px #FFB0D8 inset; -webkit-box-shadow: 0 0 50px #FFB0D8 inset;">★★★好きな言葉を入れてくださいね★★★</div>
角丸タイプ、ぷっくり感
前日のブログにも書きましたが、赤い文字になっている「#A1D784」がグリーンのカラーコードです。
好きな色に変えたい時は、その赤い文字の3箇所を好きな色のカラーコードにします。
それから、
紫の文字の「20px」が角丸の大きさの設定です。
数字を大きくすると角の丸みが大きくなります。
数字を小さくすると角の丸みが小さくなります。
お好みにアレンジしてみてくださいね
「Happy Clover」って
「Happy Clover」の
「パソコン操作個別レッスン」
つながってくださる方、募集中
よろしくお願いします