[Blog PC版]『ホワイトプレス』…新聞や雑誌の1ページのような表示

「ホワイトプレス」は新聞や雑誌の一ページのような、 記事や写真が映える白を基調としたテンプレートです。

（例）

このデザインを適用する

主な特徴

ページ上部に大きな画像を配置してアクセントにすることができます。

カスタマイズについて

ブログデザインのCSS・HTML編集は、 サポートガイドライン記載の通り
サポート対応の範囲外です。 お客様ご自身にてご確認・操作をお願いします。

また、ブログデザインのCSS・HTML編集はPC版のみ可能であり、
スマートフォン版や携帯版は編集できません。

1.h1～h3で指定した見出しの下線の太さを変える

サンプルイメージ

※手順※
1.ブログ管理画面にログイン
2.「ブログ設定」をクリック
3.デザイン／ブログパーツ設定の「PC」をクリック
4.「カスタマイズ」タブをクリック
5.「CSS」タブをクリック
6.下記変更後①、②のようにタグを書き換える
7.「保存する」をクリック

【▼変更前①】

• CSS

.article-body-inner h1,
.article-body-inner h2,
.article-body-inner h3 {
border-bottom:3px solid #7f7f7f;
}

【▼変更後②】

• 記述例

.article-body-inner h1,
.article-body-inner h2,
.article-body-inner h3 {
border-bottom:1px solid #7f7f7f;
}

※border-bottom:1pxの「1」は適宜数値を変更してください。（数値が大きくなるほど線が太くなります）

2.h3で指定した見出しの下線のみ太さを変える

サンプルイメージ

「1.h1～h3で指定した見出しの下線の太さを変える」の手順と同じです。 変更点は以下になります。

【▼変更前①】

• CSS

.article-body-inner h1,
.article-body-inner h2,
.article-body-inner h3 {
border-bottom:3px solid #7f7f7f;
}

【▼変更後②】

• 記述例

.article-body-inner h1,
.article-body-inner h2 {
border-bottom:3px solid #7f7f7f;
}
.article-body-inner h3 {
border-bottom:1px solid #7f7f7f;
}

3.h1～h3で指定した見出し文字の大きさを変える

サンプルイメージ

「1.h1～h3で指定した見出しの下線の太さを変える」の手順と同じです。 変更点は以下になります。

【▼変更前①】

• CSS

.article-body-inner h1,
.article-body-inner h2,
.article-body-inner h3 {
border-bottom:3px solid #7f7f7f;
}

※変更前のh1～h3で指定した見出し文字の大きさは20pxで指定されています。

【▼変更後②】

• 記述例

.article-body-inner h1,
.article-body-inner h2,
.article-body-inner h3 {
border-bottom:3px solid #7f7f7f;
font-size: 16px;
}

※font-size: 16px;の「16」は適宜数値を変更してください。（数値が大きくなるほど文字が大きくなります）

4.h3で指定した見出し文字のみ大きさを変える

サンプルイメージ

「1.h1～h3で指定した見出しの下線の太さを変える」の手順と同じです。 変更点は以下になります。

【▼変更前①】

• CSS

.article-body-inner h1,
.article-body-inner h2,
.article-body-inner h3 {
border-bottom:3px solid #7f7f7f;
}

【▼変更後②】

• 記述例

.article-body-inner h1,
.article-body-inner h2 {
border-bottom:3px solid #7f7f7f;
}
.article-body-inner h3 {
border-bottom:3px solid #7f7f7f;
font-size: 19px;
}