コメント作成エリアの設定を変える

＜コメント作成エリアの設定を変える＞
コメント作成エリアの設定を変えるには
/*-----Entry-----*/の
/* Comment Write */にある

#comment-write textarea {
height:150px;
}
この部分を追加・変更します。


＜初期設定＞

コメントを書く
お名前:    uryyyyyy

コメント:  







＜①コメント作成エリアに背景色をつける＞

コメントを書く
お名前:    uryyyyyy

コメント:  





コメント作成エリアに背景色をつけるには

#comment-write textarea {
height:150px;
backgroung:#------;
}
赤字部分を追加してください
＃------部分にお好みの数字
または色名(色の場合は＃不要)を指定ください
（上記の例では、色名「blue」を使用しています。）
6ケタの数字については記事「色の設定について」の
項目をご覧ください。


＜②コメント作成エリアに背景画像を挿入する＞

コメントを書く
お名前:    uryyyyyy

コメント:  





コメント作成エリアに背景画像を使うには

#comment-write textarea {
height:150px;
}
この中で背景画像に使いたいアップロード済みの
ファイルをクリックします。
するとbackground:url("/----------------") no-repeat;という記述になります。
背景にする画像は透明度の高いものを
使った方が、文字が見えにくくならず便利です。
また使用する画像によっては全体をカバーできませんので
no-repeatをrepeatに変更してください。

アドバイス
画像をワンポイントで使いたい方もいるかと思います。
その時はno-repeatの後ろに半角を空けて
bottom rightと記入してください。
これでコメント作成エリアの右下に指定した画像が配置されます。



＜③コメント作成エリアの文字を斜体にする＞
（実際にコメント作成エリアに文字を入力してみてください）

コメントを書く
お名前:    uryyyyyy

コメント:  





コメント作成エリア内の文字を斜体にするには

#comment-write textarea {
height:150px;
font-style:italic;
}
赤字部分を追加してください。


＜④コメント作成エリアのフォントを変える＞
（実際にコメント作成エリアに文字を入力してみてください）

コメントを書く
お名前:    uryyyyyy

コメント:  





コメント作成エリア内のフォントを変えるには

#comment-write textarea {
height:150px;
font-family:'変えたいフォント';
}
赤字部分を追加してください。
上図ではフォント「メイリオ」を使用しています。
例
#comments-write textarea {
・・・・・
・・・・・
font-family;"メイリオ";
}

(コメント作成エリアにフォント「メイリオ」;を適用)
フォント名が分からない時は
エクセルやワードからコピーして下さい。
（全角空白とか紛らわしいものがあるので
手打ちはやめた方がいいです。）

見る側のパソコンにインストールされていない
フォントは無視されますのでご注意ください。


＜⑤コメント作成エリアの文字の太さを変える＞
（実際にコメント作成エリアに文字を入力してみてください）

コメントを書く
お名前:    uryyyyyy

コメント:  





コメント作成エリアの文字の太さを変えるには

#comment-write textarea {
height:150px;
font-weight:★;
}
ここに赤字部分を記述して下さい。
★＝100～900までの数(100単位)
上図では200に設定してあります。

400がnormal,700がbold
詳しくは記事「フォント１」をご覧ください


＜⑥コメント作成エリアの文字の大きさを変える＞
（実際にコメント作成エリアに文字を入力してみてください）

コメントを書く
お名前:    uryyyyyy

コメント:  





コメント作成エリアの文字の大きさを変えるには

#comment-write textarea {
height:150px;
font-size:★
}
ここに赤字部分を変更して下さい。
★＝
サイズを表す数値＋単位（mm,cm,in,pt.pc,em,ex,px)
または、larger,smaller,％
またはxx-large,x-large,large,medium,small,x-small,xx-small
上図では★＝15ptで設定しています。


＜⑦コメント作成エリアの文字の色を変える＞
（実際にコメント作成エリアに文字を入力してみてください）

コメントを書く
お名前:    uryyyyyy

コメント:  





コメント作成エリアの文字の色を変えるには

#comment-write textarea {
height:150px;
color:#------;
}
赤字部分を追加してください
＃------部分にお好みの数字
または色名(色の場合は＃不要)を指定ください
（上記の例では、色名「brown」を使用しています。）
6ケタの数字については記事「色の設定について」の
項目をご覧ください。

タグ：so-net コメント CSS カスタマイズ ブログ

コメント 1

それは良いアイデアです ！
by factory coach outlet (2011-02-22 20:58)