- このトピックには4件の返信、2人の参加者があり、最後に
により8ヶ月、 2週前に更新されました。
-
投稿
-
【お使いの Snow Monkey のバージョン】バージョン: 25.3.3
【お使いの Snow Monkey Blocks のバージョン】バージョン 20.4.3
【お使いの Snow Monkey Editor のバージョン】バージョン 9.3.3
【お使いのブラウザ】Chrome
【当該サイトのURL】https://saekikougyou.co.jp/### 実現したいこと
ヘッダーの中央に画像を２つ載せたい。
### 発生している問題
試しに画像を入れることは出来たけど、右に寄ってしまう。アクセスの隣に来る。
### 試したこと
「ヘッダー」
<div class="icon"><img src="//saekikougyou.co.jp/wp-content/uploads/2021/09/logo_saeki.png”" /><div>「追加CSS」
.icon { width:50px; text-align:center; }↑で試したところ表示が全体的に崩れてしまった。
ヘッダー内で
・画像の大きさの指定
・画像の場所の指定は可能でしょうか？？ よろしくお願いいたします＜(_ _)＞
いいねをした人: 居ませんPC とスマホ、どちらでもど真ん中に画像が入るのが理想ですかね？
ヘッダーの中央に画像を２つ載せたい。
「ヘッダー」で記載いただいた HTML には
imgが1つでしたが、「２つ載せたい」ということは、本当は載せたいimgは2つある、ということですかね？いいねをした人: 居ませんキタジマ様
PC表示の時に入れたいです。
お客様からまだ来ていないので用意できてないのですが、入れたい画像は２つあります。ヘッダー内で
・画像の大きさの指定
・画像の場所の指定は可能でしょうか？？ よろしくお願いいたします＜(_ _)＞
いいねをした人: 居ませんSnow Monkey の機能としては無いので、やるとすれば
– CSS の background-image でやる
– フックを使って画像を挿入するのどちらかで対応することになると思います。簡単なのは CSS での対応ですかね。
デザインがわからないのでセレクタや指定は具体的には書けませんが、background-image、background-size、background-position、background-repeat: no-repeatの組み合わせで指定すれば良いと思います。Snow Monkey の PC サイズのメディアクエリは
min-width: 1024pxなので、@media (min-width: 1024px) { .l-header { // ← デザインによってはもっと良いセレクタがあるかも background-image: xxx; background-size: xxx; background-position: xxx; background-repeat: no-repeat; } }のような感じになると思います。
いいねをした人: 居ません
- トピック「ヘッダーの中央に画像を入れられますか？」には新しい返信をつけることはできません。