ブログタイトル背景画像の変更方法(CSS編集)


ご注意!

CSSやHTMLに関するお問い合わせはサポート対象外となります。
カスタマイズにつきましては上級者向けの機能となりますので、CSSやHTMLなどの詳細な使用方法やご不明な点などは、書籍やネット記事などをご参照いただき、お客さまの責任のもと、ご利用いただきますようお願いいたします。

ブログタイトル背景画像を変更するCSSの一例をご案内します。
※デザインテンプレートによっては反映されない場合があります。

CSS編集は、管理画面の「デザイン」-「デザイン切り替え/CSS編集」にてご変更ください。

●CSSの編集方法 - CSS・HTMLの編集方法 ※注意書きあり
https://support.at.webry.info/201907/article_design_004.html#css

ご参考

「ウェブリブログ」のデザインテンプレートをご利用の方におすすめの画像サイズ
2カラム:横幅700px
3カラム:横幅800px


CSS

.Header {
background: url("画像のURL") no-repeat;
}


記述例
CSS

.Header {
background: url("http://~.jpg") no-repeat;
}


表示例
高さ指定なし.png

アップロードしたタイトル画像とデザインテンプレートの高さが合わず、正常に表示されない場合は、下記をご参考の上、タイトル部分の高さを指定していただくか、画像自体を編集して合わせてください。

CSS

.Header {
background: url("http://~.jpg") no-repeat;
height: 高さ;
}


記述例
CSS

.Header {
background: url("http://~.jpg") no-repeat;
height: 500px;
}

※「px」の数値を変更してサイズを調整してください。

表示例
高さ500px.png

なお、管理画面の「カバー画像設定」を利用してブログタイトル背景画像を変更できるデザインテンプレートもあります。詳細については、下記URLのページをご参照ください。

●オリジナルカバー画像の設定方法(ブログタイトル背景画像)
https://support.at.webry.info/201907/article_design_003.html
●オリジナルカバー画像を設定できるデザインテンプレート
https://support.at.webry.info/201907/article_design_010.html


関連リンク

●CSS・HTMLの編集方法 ※注意書きあり
https://support.at.webry.info/201907/article_design_004.html
●基本的なタグ・プロパティ
https://support.at.webry.info/202009/article_design_017.html
●ブログタイトル位置の変更方法
https://support.at.webry.info/202010/article_design_020.html
●ブログの更新内容が反映されません
https://support.at.webry.info/201907/article_settei_019.html

問合せ.png 問題が解決できない場合

操作方法で問題が解決できない場合は、こちらからご連絡ください。
※CSSやHTMLに関するお問い合わせはサポート対象外となります。