賢威7(スタンダード版)のコメントまわりのスタイルを修正する方法をご紹介します。

h3タグの「コメントを残す」部分のスタイル

当サイトの場合は、賢威の子テーマで運用しているので、子テーマディレクトリの「base.css」に追記しています。

追記した内容

#comments h3{
	font-size: 1em;
	border-top-style: none;
	border-bottom-style: none;
	padding-top: 4px;
	padding-right: 10px;
	padding-bottom: 4px;
	padding-left: 10px;
	background-color: #E3E3E3;
	border-right-style: none;
	border-left-style: none;
}

修正点

  • 文字を小さく
  • 線を削除
  • 背景色を追加
  • 余白を付けた

入力枠のスタイル

追記した内容

#comments input,
#comments textarea{
	border: 1px solid #999;
	padding: 4px;
}

修正点

  • 枠線を1本線にした
  • 枠に余白を付けた

送信ボタンのスタイル

追記した内容

#comments .btn{
	border-radius: 0px;
	font-size: 1em;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
}

修正点

デフォルトだと少し大きめのボタンなので、全体的に小さめに変更。

  • 文字を小さくした
  • 余白も小さくした