Webデザインテンプレート集 : Templates[飾り枠]
About
Templates
Design
BBS
Links
トップページ
飾り枠
CSSデザイン
リンクページ
タイトル
コピーライト
その他
はじめに
利用方法
飾り枠
様々な用途に利用出来る飾り枠です。何か囲みたいときにどうぞ。
画像をクリック:プレビュー /
各色を見る /
ソース表示 /
ダウンロード
ソース表示[No.13 - Blue]
カラー選択
CSS
<STYLE type="text/css"> <!-- DIV{ font-size : 13px; } --> </STYLE>
HTML
<TABLE width="400"><TR><TD> <DIV style="width : 400px"> <!--↓一番外側の枠--> <DIV style="border-width : 1px;border-color : #7171FF ;border-style : solid"> <!--↓立体感を出すために、右下ボーダーを濃い色に、左上ボーダーを薄い色に設定--> <DIV style="border-width : 1px;border-color : #ECECFF #9696FF #9696FF #ECECFF;border-style : solid;"> <!--↓のbackground-colorで枠の色を、paddingで枠の太さを設定--> <DIV style="background-color : #D6D6FF;padding : 1px"> <DIV style="padding : 3 3 4 3px;text-align : center">- タイトル -</DIV> <!--↓上のと反対に右下と左上の枠色を設定--> <DIV style="border-width : 1px;border-color : #9696FF #ECECFF #ECECFF #9696FF;border-style : solid;"> <!--↓内容を書く場所の背景色と余白を設定--> <DIV style="border : 1px #7171FF solid;background-color : #FFFFFF;padding : 10px;"> Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext Sampletext</DIV> </DIV> </DIV> </DIV> </DIV> </DIV> </TD></TR></TABLE>
本体表示