サッカーシューズすぐダメになる
高いんだよ〜。(´д｀lll)
いつもいいね！ありがとうございます(*'▽'*)
育休明けから在宅でPC仕事しているあか子と申します。
小4・小1・1歳半の子どもたちの為、家計改善を決意！
お得大好き！家計簿苦手…。貯金頑張ります(；ω；)
おすすめ記事
ヘッダー画像を一番簡単に作る方法
新CSS対応＊ヘッダーの変更方法②
見出しを正しく使う①
ランキングに参加してます。
ポチっとしてもらえたら嬉しすぎます♡
育休明けから在宅でPC仕事しているあか子と申します。
小4・小1・1歳半の子どもたちの為、家計改善を決意！
お得大好き！家計簿苦手…。貯金頑張ります(；ω；)
おすすめ記事
ヘッダー画像を一番簡単に作る方法
新CSS対応＊ヘッダーの変更方法②
見出しを正しく使う①
ランキングに参加してます。
ポチっとしてもらえたら嬉しすぎます♡
囲み枠ってどうやるの？にお応えして
コピペで使える囲み枠のデザインを紹介します
お知らせやサイドバーなど
目立たせたいところに使ってください♡
必ずHTML表示にしてから貼り付けてね！
コピペで簡単♡囲み枠デザイン
追記
Androidだと<div>タグが認識されないようです。
くろさわさんが
<div> → <p>
に書き換えることでAndroidでも使える
と教えてくださいましたよ♫
1.シンプル影つき
シンプル影つき
<div style="border: 1px #ccc solid; padding: 20px; box-shadow: 0 2px 3px 0 #ddd; background: #fff; font-size: 90%;">シンプル影つき</div>
2.角丸ピンク
角丸ピンク
<div style="border: 2px solid #ffc0cb; padding: 10px; background: #ffffff; border-radius:10px;">角丸ピンク</div>
3.角丸背景グレー
角丸背景グレー
<div style="color: #fff; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; background: #708090; padding: 20px; font-size: 90%;">角丸背景グレー</div>
4.ふせん風
ふせん風
<div style="border: #ffb6c1 solid 1px; border-left: #ffb6c1 solid 10px; padding: 20px; background: #fff; font-size: 90%;">ふせん風</div>
5.ぼかし
ぼかし
<div style="padding: 10px 20px; margin: 10px; background: #ffe4e1; box-shadow: #ffe4e1 0 0 10px 10px; -webkit-box-shadow: #ffe4e1 0 0 10px 10px; -moz-box-shadow: #ffe4e1 0 0 10px 10px; font-size: 90%;">
6.ステッチ風
ステッチ風
<div style="color: #fff;background: #47a89c;padding: 20px;border: 2px dashed rgba(255,255,255,0.5); border-radius: 6px; box-shadow: 0 0 0 5px #47a89c, 0 2px 3px 5px rgba(0,0,0,0.5);">ステッチ風</div>
7.2重線
2重線
<div style="padding: 20px;margin: 40px 0;; border: 4px double #85C1E9;border-radius: 4px; color: #80888D;padding: 20px;">2重線</div>
8.見出し付き①
<fieldset><legend>見出し</legend>内容</fieldset>
9.見出し付き②
見出し
内容
<div style="background:#F7C9CE;padding:5px;color:#FFF;font-weight:bold;">見出し</div>
<div style="border: 1px solid #F7C9CE; padding: 10px; background: #ffffff;">内容</div>
解説＆参考サイトのご紹介
- 解説 -
background: #F7C9CE:
→ 背景 色コード
border: 1px solid #F7C9CE;
→ 線 太さ1px 実線 色コード
WEBカラー見本を参考に、
お好みの色に変更できます。
WEBカラー見本
とてもオシャレで配色のヒントになります
→→ LITERALLY
気になってた方はぜひお試しを☆-( ^-ﾟ)v