
こんにちは。YOSHITAKA(@YOSHITA19704216)です。


CSSの編集でヘッダー画像の「高さ」の変更ができますので
設定で編集しましょう。
- アメブロのヘッダーの高さを編集することができます。
- CSSの編集する部分がわかります。
Contents
アメブロのCSS編集でヘッダーの高さを変える方法
自分がアメキンを使ってヘッダー画像などを調整した部分です。
アメーバブログのヘッダーの高さを変更する
ブログヘッダー画像の高さを変更する部分です。
黄色い文字の所
特にこの部分を変更していきましょう。
↓ ↓
height:350px;
CSSの編集する箇所
/* (3-2) ブログヘッダー
——————————————–*/
/* skinHeaderFrame ブログタイトルを囲うエリア */
.skinHeaderFrame {
}
/* skinHeaderArea ブログヘッダー980pxエリア */
.skinHeaderArea {
width: 1038px;/* 注 ベースのcssにwidth:980px;の記述有り */
background: #FFF;
border-left: 1px solid #32457f;/*変更箇所*/
border-right: 1px solid #32457f;/*変更箇所*/
}
.skinHeaderArea2 {
background:url(“https://stat.blogskin.ameba.jp/blogskin_images/20190528/22/4c/Kf/j/o10000350blog-starter-20191559050617065.jpg”);
background-position: center top;
background-repeat: no-repeat;
height:350px;
}
/* skinBlogHeadingGroupArea タイトルと説明を囲うエリア */
.skinBlogHeadingGroupArea {
padding: 0;
}
/* skinTitleArea ブログタイトルのエリア */
.skinTitleArea {
padding: 8px 15px 0;
}
/* skinDescriptionArea ブログの説明エリア */
.skinDescriptionArea {
display: none;
}
/* ※(1)文字のスタイル にブログヘッダー文字の記述有り */
まとめ
CSSを編集するテンプレートは
ヘッダーの画像の高さを変更することができますが
「どこを直せば良いのかわからない」という人はたくさんいらっしゃいます。
数字を編集しながらプレビューで設定していってみてください。(^^)
その他メルマガを流していますので、興味があれば登録して下さいね(^^)