WordPressテーマの編集

本ページは広告が含まれています。気になる広告をクリック頂けますと、サーバ運営費になります(^^

外観⇒テーマの編集

行間が狭い

body, input, textarea {
	color: #777;
	font: 15px メイリオ, Meiryo, Osaka, “ヒラギノ角ゴ Pro W3”, “Hiragino Kaku Gothic Pro”, “ＭＳ Ｐゴシック”, “MS PGothic”, sans-serif;
	line-height: 30px;
	word-wrap: break-word;
}

line-heigtを好みの大きさに調整

ちなみに、日本語フォントに対応させるため、fontも調整した

魅力的な見出しを作る

このサイトで、見出し用のCSS作成

[browser-shot url=”http://midashi-maker.v-colors.com/” width=”600″ height=”450″]

作成したCSSを貼り付ける。

/* Midashi */
.menuRibbon {
	margin:0 0 10px 0;
	padding:2px 8px;
	background:#501b1e;
	color:#eee7e7;
	line-height:140%;
	font-weight:bold;
}

.menuRibbonLight {
	margin:0 0 10px 0;
	padding:2px 8px;
	background:#813737;
	color:#310d0d;
	line-height:140%;
	font-weight:bold;
}

.menuTab {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 0 0 5px;
	border-color: #813737;
	border-style:solid;
	background:#501b1e;
	color:#eee7e7;
	font-weight:bold;
	padding-bottom:0px !important;
}

.menuTabLight {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 0 0 5px;
	border-color:#501b1e;
	border-style:solid;
	background:#813737;
	color:#310d0d;
	line-height:140%;
	font-weight:bold;
}

.menuTabDouble {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 5px;
	border-color: #813737;
	border-style:solid;
	background:#501b1e;
	color:#eee7e7;
	line-height:140%;
	font-weight:bold;
	text-align:center;
}

.menuTabDoubleLight {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 5px;
	border-color:#501b1e;
	border-style:solid;
	background:#813737;
	color:#310d0d;
	line-height:140%;
	font-weight:bold;
	text-align:center;
}

.menuLine {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 0 5px 0;
	border-color: #813737;
	border-style:solid;
	background:#501b1e;
	color:#eee7e7;
	line-height:140%;
	font-weight:bold;
}

.menuLineLight {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 0 5px 0 ;
	border-color:#501b1e;
	border-style:solid;
	background:#813737;
	color:#310d0d;
	line-height:140%;
	font-weight:bold;
}

.menuLineDouble {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:5px 0;
	border-color: #813737;
	border-style:solid;
	background:#501b1e;
	color:#eee7e7;
	line-height:140%;
	font-weight:bold;
	text-align:center;
}

.menuLineDoubleLightW {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:5px 0;
	border-color:#501b1e;
	border-style:solid;
	background:#fff;
	color:#310d0d;
	font-weight:bold;
	text-align:center;
	padding-bottom:0px !important;
}

.menuLineDoubleLight {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:5px 0;
	border-color:#501b1e;
	border-style:solid;
	background:#813737;
	color:#310d0d;
	line-height:140%;
	font-weight:bold;
	text-align:center;
}

.menuLineLightW {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 0 5px 0 ;
	border-color:#501b1e;
	border-style:solid;
	background:#fff;
	color:#310d0d;
	font-weight:bold;
	padding-bottom:0px !important;
}

上記CSSをClassで呼び出す

<h3 class="menuTab"><h3>