スタイルシート（textarea/input）【No.15-1】
スタイルシート（textarea/input）
どちらも1記事でしか使われていないタグです。
（サイドバーで使用していれば、それもですが）
デフォルトスキンでは次のようになっています。
→ textarea は class="entry_text"
→ input は指定無し
→ input（送信する部分）は class="btn" （デフォルトcssには載っていない）
※ input, textarea { 略 }
.btn { 略 }
あたりのを、スタイルシートに書き足すことで、スタイルをいじれます～。
※ 線のスタイルについてはスキンカスタマイズ24をどうぞ。
１． textareaとinputをまとめて変える
input, textarea {
background-color: transparent;
border: 1px solid #a52a2a;
font-size: 12px;
color: #666666; }
２． 文字が枠についているのがイヤだ
input, textarea {
background-color: transparent;
border: 1px solid #a52a2a;
font-size: 12px;
color: #666666;
padding: 5px; }
.btn {
padding: 3px; }
※ paddingが5pxと3pxなのは・・・私の趣味。べつに両方3px（inputで3px指定、.btnで指定無し）でも良いかと。※ チェックボックスの枠を消すには、別のクラス名を付けるとできます。
別にどんな名前でも、他とかぶってなければ可。
例えば、1記事テンプレに追加
→ L116あたり <input class="none" type="checkbox" name="EatCookie"～略>クッキーに保存
スタイルシートに追加
→ .none { border: 0px ; }
３． input（送信する部分）の色を変える、他は下線にする
input, textarea {
background-color: transparent;
border-width: 0px 0px 1px 0px;
border-bottom: 1px solid #a52a2a;
font-size: 12px;
color: #666;
padding: 5px; }
.btn {
background-color: #a52a2a;
border: 1px solid #a52a2a;
color: #fff;
padding: 3px; }
４． 背景色も、文字色も 当然変えられるのです
input, textarea {
background-color:#dcdcdc ;
border: 1px solid #a52a2a;
font-size: 12px;
color: #fff;
padding: 5px; }
.btn {
background-color: #dcdcdc;
border: 1px solid #a52a2a;
font-size: 12px;
color: #fff;
padding: 3px; }
※ サンプルみたいに読みにくいのは勘弁ですが；；
背景は画像にすることもできます。7/23追記
えと、プレビューが表示される部分は、.comment_layerというclassです。 以前にentry_layerより少し小さい方がよさそう。とか書きましたが、どうやら同じ幅にしてpaddingで左右に幅を取った方が良さそうに感じます。
ちなみに当ブログでは padding: 5px 15px; になっています。
8/9追記
スキンカスタマイズ15（補足）も、良かったらご覧下さいませ。
[ この記事を通報する ]
url ： http://yaplog.jp/material/archive/116
宜しくお願いします
