【CELL】ヘッダーの写真を小さくしたい

アメーバオウンドホームページ作成サポート、ラクリエイトです。

こちらのサイトではアメーバオウンドのCSSカスタマイズについて書いていますが、カスタマイズは自己責任でお願い致します。


アメーバオウンドのデザイン「CELL」
「MALIA」と同じものを入れても、写真は小さくなりません。
「CELL」をお使いの方はこちらをご利用ください。


ヘッダーの写真を小さくしたい

CELLの写真はMALIAよりは大きくないのですが、それでもヘッダーの写真の大きさを変えたいと思う方もいらっしゃいますよね。

標準の表示はこのような感じ。


MALIAよりは見やすいです。



低くした見え方

高さを300pxにしました。



横長の写真が映えそうです。



標準との比較




.keyvisual__image {
    height: 300px;
}


この「height: 300px」の部分を自分の好みの高さにしてください。 

全体だけ入れると、スマホ表示も「300px」になるので、 スマートフォンのほうにも


.keyvisual__image {
    height: 150px;
}


と入れてください。



スマホ表示を150pxにすると


150pxだとこれくらいの表示になります。 

スマホもパソコンも見ている人が使っている端末によって、見え方が変わってきますので、絶妙にこの高さ!と揃えるのではなく、だいたいこれくらいの表示、と思っていた方が良いです。

racreate

大人かわいいシンプルなアメブロカスタマイズ。 アメーバオウンドホームページ作成。 自分だけのブログ、ホームページを持ちたい方に低価格で提供しています。

0コメント

  • 1000 / 1000