フォントの調整~WordPress Twenty Twelveカスタマイズ

更新

ある程度カスタマイズが進んできたので、全体のバランスを考えて、フォントサイズを調整してみました。

記事タイトルの文字の大きさを変更

変更前

.archive-title,
.page-title,
.widget-title,
.entry-content th,
.comment-content th {
font-size: 11px;
font-size: 0.785714286rem;
line-height: 2.181818182;
font-weight: bold;
text-transform: uppercase;
color: #636363;
}

変更後

.archive-title,
.page-title,
.widget-title,
.entry-content th,
.comment-content th {
font-size: 17.5px;
font-size: 1.25rem;
line-height: 1.181818182;
font-weight: bold;
text-transform: uppercase;
color: #636363;
}

基本のfont-size,sont-styleを変更

変更前

body {
font-size: 14px;
font-size: 1rem;
font-family: Helvetica, Arial, sans-serif;
text-rendering: optimizeLegibility;
color: #444;
}
body.custom-font-enabled {
font-family: "Open Sans", Helvetica, Arial, sans-serif;
}

変更後

body {
font-size: 17.5px;
font-size: 1.25rem;
font-family: "メイリオ", Meiryo, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "MS Pゴシック", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
text-rendering: optimizeLegibility;
color: #444;    
}
body.custom-font-enabled {
font-family: "メイリオ", Meiryo, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "MS Pゴシック", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
}

navigation menuのfont-size変更

変更前

/* Navigation Menu */
.main-navigation {
margin-top: 24px;
margin-top: 1.714285714rem;
text-align: center;
clear:both;
}
.main-navigation li {
margin-top: 24px;
margin-top: 1.714285714rem;
font-size: 12px;
font-size: 0.857142857rem;
line-height: 1.42857143;
}

変更後

/* Navigation Menu */
.main-navigation {
margin-top: 24px;
margin-top: 1.714285714rem;
text-align: center;
clear:both;
}
.main-navigation li {
margin-top: 24px;
margin-top: 1.714285714rem;
font-size: 14px;
font-size: 1rem;
line-height: 1.42857143;
}

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です