☆ツートンの見出し枠作ってみた | 魔導師の庭 ~自分という土壌からあふれでるモノ、コト

 

こんにちは。ミドリーヌでっす!! 

前の記事の再アップです。

 

面白がって作ってみたらいがいと良い感じなので自分用にいくつかのパターンを作っておくことにしたわ。これもやりたがり魂だろうか・・・・・(笑)

 

使いたい時にササッとコピペで使えるので楽。

 

置いておくのでもし良かったらコピペで使ってみてくださいな~。

 

貼り付けるのは通常表示からHTML表示にして下のソースを張り付けるだけよ~。

 

 

■ ツートン見出し枠シリーズ ■


 

 

ブーゲンビリアとチャイニーズピンク

 

 

点線枠の中のソースだけ右クリックでコピペしてね。

 

<div style="border-left:#F16682 8px solid; border-bottom:#F9c1cf 2px solid; padding:0px 0px 1px 5px;font-size:1.2em;font-weight:bold;">ブーゲンビリアとチャイニーズピンク</div>

 

 

 

 

アザレアピンクと薄紅

 

 

 

<div style="border-left:#FF3399 8px solid; border-bottom:#F69896 2px solid; padding:0px 0px 1px 5px;font-size:1.2em;font-weight:bold;">アザレアピンクと薄紅</div>

 

 

 

 

薔薇色とはねず色

 

 

 

<div style="border-left:#F0566E 8px solid; border-bottom:#FAC7C1 2px solid; padding:0px 0px 1px 5px;font-size:1.2em;font-weight:bold;">薔薇色とはねず色</div>

 

 

 

 

朱とかんぞう色

 

 

 

<div style="border-left:#ED1A3D 8px solid; border-bottom:#FCBB76 2px solid; padding:0px 0px 1px 5px;font-size:1.2em;font-weight:bold;">朱とかんぞう色</div>

 

 

 

 

 

赤紫色と紫水晶

 

 

 

<div style="border-left:#EC008C 8px solid; border-bottom:#9E76B4 2px solid; padding:0px 0px 1px 5px;font-size:1.2em;font-weight:bold;">赤紫色と紫水晶</div>

 

 

 


 

 

■ ツートン見出し付き囲い枠シリーズ ■

 

 

同じ配色でこんなのも作ってみた。

 

■ タイトルはこちら ■

<div style="height:12px;"><span style="margin-left:8px; padding:6px 10px; background:#F16682; color:#ffffff; font-weight:bold;border-radius:5px;">■ タイトルはこちら ■</span></div>
<div style="border:2px solid #F9c1cf; padding:25px 12px 10px; font-size:1em;border-radius:5px;">
<p>ソースはコピペで(ここは消してね)</p></div>

 

 

 

 

 

■ タイトルはこちら ■

<div style="height:12px;"><span style="margin-left:8px; padding:6px 10px; background:#FF3399; color:#ffffff; font-weight:bold;border-radius:5px;">■ タイトルはこちら ■</span></div>
<div style="border:2px solid #F69896; padding:25px 12px 10px; font-size:1em;border-radius:5px;">
<p>ソースはコピペで(ここは消してね)</p></div>

 

 

 

 

 

■ タイトルはこちら ■

<div style="height:12px;"><span style="margin-left:8px; padding:6px 10px; background:#F0566E; color:#ffffff; font-weight:bold;border-radius:5px;">■ タイトルはこちら ■</span></div>
<div style="border:2px solid #FAC7C1; padding:25px 12px 10px; font-size:1em;border-radius:5px;">

<p>ソースはコピペで(ここは消してね)</p></div>

 

 

 

 

 

■ タイトルはこちら ■

<div style="height:12px;"><span style="margin-left:8px; padding:6px 10px; background:#ED1A3D; color:#ffffff; font-weight:bold;border-radius:5px;">■ タイトルはこちら ■</span></div>
<div style="border:2px solid #FCBB76; padding:25px 12px 10px; font-size:1em;border-radius:5px;">

<p>ソースはコピペで(ここは消してね)</P></div>

 

 

 

 

 

■ タイトルはこちら ■

<div style="height:12px;"><span style="margin-left:8px; padding:6px 10px; background:#EC008C; color:#ffffff; font-weight:bold;border-radius:5px;">■ タイトルはこちら ■</span></div>
<div style="border:2px solid #9E76B4; padding:25px 12px 10px; font-size:1em;border-radius:5px;">

<p>ソースはコピペで(ここは消してね)</p></div>

 

 

 

 

自分でもいつ使うか判らないけど(笑)何かの折に使うかも知れないので。

 

赤紫色&紫水晶とかツートンきつめのは緊急のお知らせとかに向いてそう。

 

別色シリーズで作るのも楽しいかも。次はブルーシリーズかなあ♪

 

*もし、上手く表示されないとかあったら、ソースコードの不具合かもしれないので連絡くださいね。

 

 

 

 

 

 

 

 

ここまで読んでくれて

Danke schön ダンケシェーン 

                                                         

Ich liebe dich イッヒ リーベ ディッヒ (日本語で愛してる~)

 

私はこう生きる!!貴女はどうする?!