賢威+ワードプレスでコピペで使える枠線のHTMLソース

                                        ご訪問有難うございます。

Sex And The City 2 iPad Wallpaper

ワードプレスのテキストエディターで使用する枠線のHTMLソースです。そのままコピペで使用できます。

下のHTMLソースをコピーして、ワードプレスのダッシュボードの投稿の画面で、右上にあるテキストエディターをクリックして表示させペーストします。その後、ビジュアルをクリックすると枠線ができていますので中の文字を削除して、書きたい内容を記入すれば良いです。


枠線のソースです。一気に書いてしまいましたがソースを書く時間がなくなりました。今日はこれでやめます。続きは今後書いていきますので、少しづつやります。よろしくお願いいたします。


枠内の記事本文
<div style="background: #eeeeff; padding: 10px; border: 2px dotted #0000ff;">枠内の記事本文</div>

枠内の記事本文
<div style="background: #eeeeff; padding: 10px; border-radius: 10px; border: 2px dotted #0000ff;">枠内の記事本文</div>

枠内の記事本文
<div style="background: #ffeeee; padding: 10px; border: 2px dotted #ff0000;">枠内の記事本文</div>

枠内の記事本文
<div style=";background: #ffeeee; padding: 10px; border-radius: 10px; border: 2px dotted #ff0000;">枠内の記事本文</div>

枠内の記事本文
<div style="background: #bfffdf; padding: 10px; border: 2px dotted #00bf00;">枠内の記事本文</div>

枠内の記事本文
<div style="background: #bfffdf; padding: 10px; border-radius: 10px; border: 2px dotted #00bf00;">枠内の記事本文</div>

枠内の記事本文
<div style="background: #f7f7f7; padding: 10px; border: 2px dotted #CCCCCC;">枠内の記事本文</div>

枠内の記事本文
<div style="background: #ffeeee; padding: 10px; border-radius: 10px; border: 2px dotted #ff0000; width: auto; margin-right: 6px; box-shadow: 5px 5px 5px #999;">枠内の記事本文</div>

枠内の記事本文
<div style="background: #f7f7f7; padding: 10px; border-radius: 10px; border: 2px dotted #CCCCCC;">枠内の記事本文</div>

枠内の記事本文
<div style="background: #ffeeee; padding: 10px; border-radius: 10px; border: 2px dotted #ff0000; width: auto; margin-right: 6px; box-shadow: 5px 5px 5px #999;">枠内の記事本文</div>

枠内の記事本文
<div style="background: #f7f7f7; padding: 10px; width: auto; margin-right: 6px; border-radius: 10px; box-shadow: 5px 5px 5px #AAA; border: 2px dotted #CCCCCC;">枠内の記事本文</div>

枠内の記事本文
<div style="background: #f7f7f7; padding: 10px; border: 3px dotted #ffb6c1;">枠内の記事本文</div>

枠内の記事本文
<div style="background: #f7f7f7; padding: 10px; border-radius: 10px; border: 3px dotted #ffb6c1;">枠内の記事本文</div>

枠内の記事本文
<div style="padding: 10px; border-radius: 5px; border: 2px solid #ff0000;">枠内の記事本文</div>

枠内の記事本文
<div style="padding: 10px; border-radius: 10px; border: 5px double #0000ff;">枠内の記事本文</div>

枠内の記事本文
<div style="padding: 10px; border-radius: 20px; border: 3px dotted #00ff00;">枠内の記事本文</div>

One Point! 実線 → solid 点線 → dotted 破線 → dashed 二重線 → double 線なし → none

○○○
○○○
○○○
○○○
○○○
<div style="background-image: linear-gradient(#dd4a5c,#e4707e,white,#e4707e,#dd4a5c); background-color: #ffeeee; padding: 10px; width: auto; margin-right: 6px; border-radius: 10px; border: 2px dotted #ff0000; box-shadow: 5px 5px 5px #AAA;">○○○<br />○○○<br />○○○<br />○○○<br />○○○</div>

○○○
○○○
○○○
○○○
○○○
<div style="background-image: linear-gradient(#e4707e,white,white,white,#e4707e); background-color: #ffeeee; padding: 10px; width: auto; margin-right: 6px; border-radius: 10px; border: 2px dotted #ff0000; box-shadow: 5px 5px 5px #AAA;">○○○<br />○○○<br />○○○<br />○○○<br />○○○</div>

○○○
○○○
○○○
○○○
○○○
<div style="background-image: linear-gradient(#f7fbfc,#d9edf2,#add9e4); background-color: #ffeeee; padding: 10px; width: auto; margin-right: 6px; border-radius: 10px; border: 2px dotted #333333; box-shadow: 5px 5px 5px #AAA;">○○○<br />○○○<br />○○○<br />○○○<br />○○○</div>

○○○
<div style="background-image: linear-gradient(orange,white); background-color: orenge; padding: 10px; border: 2px dotted orange;">○○○</div>

○○○
<div style="background-image: linear-gradient(blue,white); background-color: blue; padding: 10px; border: 2px dotted blue;">○○○</div>

○○○
○○○
○○○
○○○
○○○

○○○

○○○

◆枠の見出し

1)枠内の記事本文1
2)枠内の記事本文2
3)枠内の記事本文3

◆枠の見出し

1)枠内の記事本文1
2)枠内の記事本文2
3)枠内の記事本文3

この記事も参考にして!

枠内の記事本文

◆ここにタイトル

ここは文章・・・
ここは文章・・・
ここは文章・・・

■タイトルはこちら■

本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■

本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■

本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■

本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■

本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■

本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■

本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■

本文はこちら!
改行後の本文はこちら(ここは削除してください。)

見出しその1
本文記事1
本文記事2
本文記事3

■タイトルはこちら■
本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■
本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■
本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■
本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■
本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■
本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■
本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■
本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■
本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■
本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトルはこちら■
本文はこちら!
改行後の本文はこちら(ここは削除してください。)

■タイトル■
1.ここに本文
2.ここに本文
3.ここに本文

51、

■タイトル■
1.ここに本文
2.ここに本文
3.ここに本文

52、

■タイトル■
1.ここに本文
2.ここに本文
3.ここに本文

53、

■タイトル■
1.ここに本文
2.ここに本文
3.ここに本文

54、

■タイトル■
1.ここに本文
2.ここに本文
3.ここに本文

55、

■タイトル■
1.ここに本文
2.ここに本文
3.ここに本文

56、

■タイトル■
1.ここに本文
2.ここに本文
3.ここに本文

57、

■タイトル■
1.ここに本文
2.ここに本文
3.ここに本文

58、

■タイトル■
1.ここに本文
2.ここに本文
3.ここに本文

59、

■タイトル■
1.ここに本文
2.ここに本文
3.ここに本文

60、

■タイトル■
1.ここに本文
2.ここに本文
3.ここに本文

61、

■タイトル■
1.ここに本文
2.ここに本文
3.ここに本文

62、

■タイトル■
1.ここに本文
2.ここに本文
3.ここに本文

63、

枠に影をつける(ドロップシャドウ)
photo by: xploitme
» «

コメントを残す

サブコンテンツ

飯沼祐志

 

 

  飯沼祐志: 株式会社マルク代表

 

あなたの疑問に即時対応致します。

チャットで問い合わせ

お気軽にどうぞ。

 

自己紹介はコチラ

全記事一覧

Twitter でフォロー

変更後

このページの先頭へ