飾り枠テンプレート - css版

45種類の立体的な飾り枠テンプレート（スタイルシート、CSS版）。コピー＆ペーストでカンタンに使えるタグ素材集です。文章やリンクを入れるだけでホームページが完成してしまう便利なものです。

ホームページ作成時の『チョッ』としたアクセントに、テンプレートを使ってみてはいかがでしょうか？

TEXT テキスト … <div style="padding:5px;border-color:#333333;border-width:1px;border-style:solid;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#cccccc;border-width:1px;border-style:solid;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#009900;border-width:1px;border-style:solid;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#990000;border-width:1px;border-style:solid;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#999933;border-width:1px;border-style:solid;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>
TEXT テキスト … <div style="padding:5px;border-color:#333333;border-width:1px;border-style:solid;height:50px;width:80px;background:#cccccc;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#cccccc;border-width:1px;border-style:solid;height:50px;width:80px;background:#F7F7F7;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#009900;border-width:1px;border-style:solid;height:50px;width:80px;background:#ADFEAD;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#990000;border-width:1px;border-style:solid;height:50px;width:80px;background:#FEC6C6;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#999933;border-width:1px;border-style:solid;height:50px;width:80px;background:#F9F9BA;">TEXT<br>TEXT<br>…</div>
TEXT テキスト … <div style="padding:5px;border-color:#333333;border-width:1px;border-style:dotted;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#cccccc;border-width:1px;border-style:dotted;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#009900;border-width:1px;border-style:dotted;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#990000;border-width:1px;border-style:dotted;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#999933;border-width:1px;border-style:dotted;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>
TEXT テキスト … <div style="padding:5px;border-color:#333333;border-width:1px;border-style:dashed;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#cccccc;border-width:1px;border-style:dashed;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#009900;border-width:1px;border-style:dashed;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#990000;border-width:1px;border-style:dashed;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;border-color:#999933;border-width:1px;border-style:dashed;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>
TEXT テキスト … <div style="padding:5px;background:#cccccc;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#EFEFEF;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#B3D9BA;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#B3C5D9;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#D9D1B3;height:50px;width:80px;">TEXT<br>TEXT<br>…</div>
TEXT テキスト … <div style="padding:5px;background:#cccccc;height:50px;width:80px;border-color:#333333;border-width:0 0 3px 0;border-style:solid;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#EFEFEF;height:50px;width:80px;border-color:#cccccc;border-width:0 0 3px 0;border-style:solid;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#B3D9BA;height:50px;width:80px;border-color:#40A352;border-width:0 0 3px 0;border-style:solid;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#B3C5D9;height:50px;width:80px;border-color:#2B609C;border-width:0 0 3px 0;border-style:solid;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#D9D1B3;height:50px;width:80px;border-color:#9C8223;border-width:0 0 3px 0;border-style:solid;">TEXT<br>TEXT<br>…</div>
TEXT テキスト … <div style="padding:5px;background:#cccccc;height:50px;width:80px;border-color:#333333;border-width:0 0 0 3px;border-style:solid;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#EFEFEF;height:50px;width:80px;border-color:#cccccc;border-width:0 0 0 3px;border-style:solid;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#B3D9BA;height:50px;width:80px;border-color:#40A352;border-width:0 0 0 3px;border-style:solid;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#B3C5D9;height:50px;width:80px;border-color:#2B609C;border-width:0 0 0 3px;border-style:solid;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#D9D1B3;height:50px;width:80px;border-color:#9C8223;border-width:0 0 0 3px;border-style:solid;">TEXT<br>TEXT<br>…</div>
TEXT テキスト … <div style="padding:5px;background:#cccccc;height:50px;width:80px;border-color:#333333;border-width:0 0 3px 0;border-style:solid;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#EFEFEF;height:50px;width:80px;border-color:#cccccc;border-width:0 0 3px 0;border-style:solid;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#B3D9BA;height:50px;width:80px;border-color:#40A352;border-width:0 0 3px 0;border-style:solid;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#B3C5D9;height:50px;width:80px;border-color:#2B609C;border-width:0 0 3px 0;border-style:solid;">TEXT<br>TEXT<br>…</div>	TEXT テキスト … <div style="padding:5px;background:#D9D1B3;height:50px;width:80px;border-color:#9C8223;border-width:0 0 3px 0;border-style:solid;">TEXT<br>TEXT<br>…</div>
TEXT テキスト … <div style="padding:3px;background:#EBFCCE;height:46px;width:76px;"><div style="padding:5px;background:#EBFCCE;height:40px;width:70px;border-color:#FFFFFF #8CA85A #8CA85A #FFFFFF;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:3px;background:#E1CBF7;height:46px;width:76px;"><div style="padding:5px;background:#E1CBF7;height:40px;width:70px;border-color:#FFFFFF #6A35A0 #6A35A0 #FFFFFF;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:3px;background:#AFCBD2;height:46px;width:76px;"><div style="padding:5px;background:#AFCBD2;height:40px;width:70px;border-color:#FFFFFF #358BA0 #358BA0 #FFFFFF;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:3px;background:#AFD2C5;height:46px;width:76px;"><div style="padding:5px;background:#AFD2C5;height:40px;width:70px;border-color:#FFFFFF #52937A #52937A #FFFFFF;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:3px;background:#FAFCC7;height:46px;width:76px;"><div style="padding:5px;background:#FAFCC7;height:40px;width:70px;border-color:#FFFFFF #9C9F44 #9C9F44 #FFFFFF;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>
TEXT テキスト … <div style="padding:3px;background:#EBFCCE;height:46px;width:76px;border-color:#8CA85A;border-width:1px;border-style:solid;"><div style="padding:5px;background:#EBFCCE;height:40px;width:70px;border-color:#8CA85A;border-width:1px;border-style:dotted;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:3px;background:#E1CBF7;height:46px;width:76px;border-color:#6A35A0;border-width:1px;border-style:solid;"><div style="padding:5px;background:#E1CBF7;height:40px;width:70px;border-color:#6A35A0;border-width:1px;border-style:dotted;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:3px;background:#AFCBD2;height:46px;width:76px;border-color:#358BA0;border-width:1px;border-style:solid;"><div style="padding:5px;background:#AFCBD2;height:40px;width:70px;border-color:#358BA0;border-width:1px;border-style:dotted;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:3px;background:#AFD2C5;height:46px;width:76px;border-color:#52937A;border-width:1px;border-style:solid;"><div style="padding:5px;background:#AFD2C5;height:40px;width:70px;border-color:#52937A;border-width:1px;border-style:dotted;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:3px;background:#FAFCC7;height:46px;width:76px;border-color:#9C9F44;border-width:1px;border-style:solid;"><div style="padding:5px;background:#FAFCC7;height:40px;width:70px;border-color:#9C9F44;border-width:1px;border-style:dotted;">TEXT<br>TEXT<br>…</div></div>
TEXT テキスト … <div style="padding:2px;background:#EBFCCE;height:46px;width:76px;border-color:#8CA85A;border-width:1px;border-style:solid;"><div style="padding:5px;background:#FFFFFF;height:40px;width:70px;border-color:#8CA85A;border-width:1px;border-style:dotted;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:2px;background:#E1CBF7;height:46px;width:76px;border-color:#6A35A0;border-width:1px;border-style:solid;"><div style="padding:5px;background:#FFFFFF;height:40px;width:70px;border-color:#6A35A0;border-width:1px;border-style:dotted;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:2px;background:#AFCBD2;height:46px;width:76px;border-color:#358BA0;border-width:1px;border-style:solid;"><div style="padding:5px;background:#FFFFFF;height:40px;width:70px;border-color:#358BA0;border-width:1px;border-style:dotted;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:2px;background:#AFD2C5;height:46px;width:76px;border-color:#52937A;border-width:1px;border-style:solid;"><div style="padding:5px;background:#FFFFFF;height:40px;width:70px;border-color:#52937A;border-width:1px;border-style:dotted;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:2px;background:#FAFCC7;height:46px;width:76px;border-color:#9C9F44;border-width:1px;border-style:solid;"><div style="padding:5px;background:#FFFFFF;height:40px;width:70px;border-color:#9C9F44;border-width:1px;border-style:dotted;">TEXT<br>TEXT<br>…</div></div>
TEXT テキスト … <div style="padding:2px;background:#EBFCCE;height:46px;width:76px;border-color:#8CA85A;border-width:1px;border-style:solid;"><div style="padding:5px;background:#F5FDE5;height:40px;width:70px;border-color:#8CA85A;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:2px;background:#E1CBF7;height:46px;width:76px;border-color:#6A35A0;border-width:1px;border-style:solid;"><div style="padding:5px;background:#EFE3FB;height:40px;width:70px;border-color:#6A35A0;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:2px;background:#AFCBD2;height:46px;width:76px;border-color:#358BA0;border-width:1px;border-style:solid;"><div style="padding:5px;background:#D1E3E7;height:40px;width:70px;border-color:#358BA0;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:2px;background:#AFD2C5;height:46px;width:76px;border-color:#52937A;border-width:1px;border-style:solid;"><div style="padding:5px;background:#D1E7DF;height:40px;width:70px;border-color:#52937A;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:2px;background:#FAFCC7;height:46px;width:76px;border-color:#9C9F44;border-width:1px;border-style:solid;"><div style="padding:5px;background:#FCFDE0;height:40px;width:70px;border-color:#9C9F44;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>
TEXT テキスト … <div style="padding:1px;background:#999999;height:42px;width:72px;border-color:#333333;border-width:1px;border-style:solid;"><div style="padding:5px;background:#EFEFEF;height:40px;width:70px;border-color:#FFFFFF #CCCCCC #CCCCCC #FFFFFF;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:1px;background:#B27C7C;height:42px;width:72px;border-color:#511A1A;border-width:1px;border-style:solid;"><div style="padding:5px;background:#F4E9E9;height:40px;width:70px;border-color:#FFFFFF #DABABA #DABABA #FFFFFF;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:1px;background:#7CB2B2;height:42px;width:72px;border-color:#1A5151;border-width:1px;border-style:solid;"><div style="padding:5px;background:#E9F4F4;height:40px;width:70px;border-color:#FFFFFF #BADADA #BADADA #FFFFFF;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:1px;background:#7CB27C;height:42px;width:72px;border-color:#1A511A;border-width:1px;border-style:solid;"><div style="padding:5px;background:#E9F4E9;height:40px;width:70px;border-color:#FFFFFF #BADABA #BADABA #FFFFFF;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>	TEXT テキスト … <div style="padding:1px;background:#B2B27C;height:42px;width:72px;border-color:#51511A;border-width:1px;border-style:solid;"><div style="padding:5px;background:#F4F4E9;height:40px;width:70px;border-color:#FFFFFF #DADABA #DADABA #FFFFFF;border-width:1px;border-style:solid;">TEXT<br>TEXT<br>…</div></div>