- このトピックには5件の返信、3人の参加者があり、最後に
により1年、 4ヶ月前に更新されました。
-
投稿
-
【お使いの Snow Monkey のバージョン】バージョン: 20.4.1
【お使いの Snow Monkey Blocks のバージョン】バージョン 19.9.0
【お使いの Snow Monkey Editor のバージョン】バージョン 9.2.5
【お使いのブラウザ】グーグルクロム
【当該サイトのURL】ID:mirai-work
Pass:mirai-work0000### 実現したいこと
ファーストビューを綺麗に表示したい
### 発生している問題
スマホサイズにした際に画像が見切れてしまう
### 試したこと
最初、背景セクションを使ってみたがそれだとPCサイズでも画像が見切れてしまったので
カバーを使って設定をした。するとPC版でも見切れずに表示されました。
しかし、検証ツールでみてみると見切れていました。
これを見切れずに表示するにはどうすれば良いでしょうか
CSSを当ててみたのですが初心者のためうまく表示できませんでしたできれば、CSSで調節してみたいのですが
画像の作り方やサイズに問題があるのでしょうか？
画像のサイズは1920px×716です。
まとまりのない文章ですがお返事お待ちしております。
いいねをした人: 居ません画像の上に文章などのコンテンツを重ねる必要がないのであれば、Hajime Megane Ogushi さんが書かれているように画像ブロックを使うのが良いです。
### 画像だけを表示したいとき - 画像ブロック ### 画像の上にコンテンツを重ねて表示したいとき - セクション（背景画像/動画）ブロック - 最初からある程度デザインされてる - 背景はコンテンツの量に応じて拡大縮小される - ヒーローヘッダーブロック - 任意のアスペクト比で背景を表示可能 - 設定でコンテンツの量に応じて拡大縮小も可能いいねをした人: 居ませんHajime Megane Ogushiさん、キタジマタカシさん返信ありがとうございます。
そのまま、画像として設定する形で見切れることはなくなりました。
ありがとうございます。
その上でもう１点質問させて頂きたいのですが
画像で設定するとスマホ版（414×896）にしたときに
スマホ版でのHP閲覧ではなかなか見ない高さになってしまいます
カバーで設定していた際は縮小しても高さの問題はなかったのですが
ここを解消するにはスマホ版用画像を準備する必要があるのでしょうか？
また、準備するとすれば何×何pxくらいの画像がいいのでしょうか？
ぜひ、教えていただけると幸いです。
いいねをした人: 居ません画像で設定するとスマホ版（414×896）にしたときにスマホ版でのHP閲覧ではなかなか見ない高さになってしまいます
画像ブロックはその画像の画角のまま表示するので、もし PC とスマホで画角の違う画像を表示したいのであれば、それぞれ用の画像を用意する必要があります。
Snow Monkey Editor プラグインで、各ブロックごとに PC では表示しない・スマホでは表示しない、のような設定ができるのでそれを使うと簡単かもしれません。
いいねをした人: 居ません
- トピック「ファーストビューについて」には新しい返信をつけることはできません。