Top > styleプラグインの用意スタイル一覧 > 複製

#styleプラグイン用に用意されているスタイル一覧です。
使用方法は装飾に記載されています。
スタイルは適時追加されていきます。

メニュー

table

div.dd_greentable table thead tr td {
background-color: #6A8832;
color: white;
}

 見本1

div.dd_greentable table tbody tr td {
background-color: white;
color: black;
}

 見本2


div.dd_bluetable table thead tr td {
background-color: #325488;
color: white;
}

 見本3

div.dd_bluetable table tbody tr td {
background-color: white;
color: black;
}

 見本4


div.dd_table_noborder table tr td {
border: none;
}

 見本5


 #style()を適用していないテーブル

ヘッダーここはtableヘッダー
tdtd

float

div.dd_floatleft { float: left; margin-right: 4px; }
div.dd_floatright { float: right; margin-left: 4px; }


ヘッダーここは左に表示ヘッダー
tdtd
ヘッダーここは右に表示ヘッダー
tdtd


#style(class=dd_floatleft){{
|ヘッダー|ここは左に表示ヘッダー|h
|td|td|
}}
#style(class=dd_floatright){{
|ヘッダー|ここは右に表示ヘッダー|h
|td|td|
}}
※以下のクリアーを使うことで右寄せが解除される?
#style(class=clearfix){{
#hr
}}


width

div.dd_width200 { width: 200px; }
div.dd_width250 { width: 250px; }
div.dd_width300 { width: 300px; }
div.dd_width350 { width: 350px; }

div.dd_width33par { width: 33%; }
div.dd_width50par { width: 50%; }
div.dd_width66par { width: 66%; }

何の説明もないが表の横幅を固定幅にするプラグインかと思う・・・。

padding

div.dd_padding5 { padding: 5px; }
div.dd_padding10 { padding: 10px; }
div.dd_padding15 { padding: 15px; }

パディング5Px

テスト
テスト
テスト

パディング10Px

テスト
テスト
テスト

パディング15Px

テスト
テスト
テスト

パディング5Px
#style(class=dd_padding5){{
テスト
テスト
テスト
}}
パディング10Px
#style(class=dd_padding10){{
テスト
テスト
テスト
}}
パディング15Px
#style(class=dd_padding15){{
テスト
テスト
テスト
}}

border

div.dd_border000 { border: 1px solid #000; }
div.dd_border444 { border: 1px solid #444; }
div.dd_border888 { border: 1px solid #888; }
div.dd_borderccc { border: 1px solid #ccc; }
div.dd_borderfff { border: 1px solid #fff; }

BGcolor

div.dd_bgcolor000 { background-color: #000; }
div.dd_bgcolor444 { background-color: #444; }
div.dd_bgcolor888 { background-color: #888; }
div.dd_bgcolorccc { background-color: #ccc; }
div.dd_bgcolorfff { background-color: #fff; }

color

div.dd_color000 { color: #000; }
div.dd_color444 { color: #444; }
div.dd_color888 { color: #888; }
div.dd_colorccc { color: #ccc; }
div.dd_colorfff { color: #fff; }

clear

.clearfix hr { border: 0px; }


clear 利用例

#style(class=clearfix){{
#hr
}}

div.paddingKraft{ padding: 25px; }