こんにちは。
テーブルがあるとします。最後のところに画像を入れます。この画像に重ねるように画像を載せたいです。この場合、このテーブルの最後に2つ並べるように、また、1つの画像にすることなく、2枚目の画像のみ、位置指定して載せる事が出来ますでしょうか?
GIF画像だけをCSSやHTMLで位置を設定して、載せる事が出来ますか?(画像を2重に重ねたい)レイヤーのようにです。ただレイヤーですと、位置が崩れてしまう心配がありました。
CSSなどで出来ますでしょうか?
よろしくお願いいたします
No.2ベストアンサー
- 回答日時:
補足ありがとうございます。
・・・結論から言えば、HTMLをいじってページ自体に修正を加えなければ、画像の追加は出来ないのですが、「画像を重ねて表示したい」という事であれば、スタイルシートのz-indexプロパティで、階層の順位を決められますので、画像を重ねて表示させる事が出来ます。これと、positionプロパティで位置指定をして、画像を重ねて配置すれば出来ます。
忠告として少しだけ、画像を重ねると言う事は、位置によっては下の画像が全く、あるいはほとんど見えなくなってしまいます(透過gifであれば透けて見える部分もあるが)。画像処理ソフトのように、「レイヤーの表示を任意に切り替える」ような動作はHTMLでは無理です。下の画像が見えなくても構いませんか?
具体的なソースと画像の大きさが分からないので、とりあえずこうすれば出来る、という助言だけですいません^^;
→http://www.tagindex.com/stylesheet/box/z-index.h …
→http://www.tagindex.com/stylesheet/box/position. …
345itati 様
ご丁寧に、詳しく教えてくださりありがとうございました。
CSSの重ねるフィルー、ございますね。やはり、htmlでは無理みたいですね。htmlかCSSで解決したかったのは、htmlファイル自体のレイアウトをぎちぎちに作ったものですから、あまりいじりたくありませんでした。
画像の件は、少しオーバー気味にお伝えしました。本当のところは、5pxほどの単位です。
大変勉強になりました。
ありがとうございました
No.1
- 回答日時:
重ねるという意味がちょっと分かりにくいです。
オンマウスで画像を切り替えるロールオーバー効果を作りたいのでしょうか?それとも二枚の画像を重ねるだけ?
>この画像に重ねるように画像を載せたいです。この場合、このテーブルの最後に2つ並べるように、また、1つの画像にすることなく、2枚目の画像のみ、位置指定して載せる事が出来ますでしょうか?
重ねるようにと最初で断っておいて、次には並べるようにと言われているので意味不明です。
どちらもHTMLとCSSで可能だと思いますが(ロールオーバーもCSSで出来ない事は無い)、何をしたいのかがはっきり分かりません。
補足お願い致します。
この回答への補足
説明がわかりにくかったですね。すみません。
やりたいことは、ホームページを作りできあがっているとします。あとから、指定の位置(座標)に50x50の画像を載せたいときに、できあがっているホームページに挿入するのではなく、もう一枚レイヤーを作成する感じで、上にかぶせる形で表示したいという事です。
よく画像処理ソフトで作るやり方です。レイヤー1にメイン画像を、追加の画像をレイヤー2などと言うように、、、。
なぜこのようにしたいというと、ホームページが完成していますので、小さな隙間に画像を挿入してしまうと、レイアウトが崩れてしまうのです。ですので、CSSなどで出来たらなと思ったからです。
わかりますでしょうか?
よろしくお願いいたします
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS HTMLとCSSによるWebページ生成について。この絵で「ochawan」の文字を枠全体の上から10 4 2023/02/28 23:17
- HTML・CSS CSSでサイトの背景に画像を組み込みたいのですが反映されません 2 2022/11/22 16:21
- HTML・CSS svgクリップパスの応用コーディング方法 2 2022/04/09 09:07
- Visual Basic(VBA) 【VBA】写真の貼り付けコードがうまく機能しません。 5 2022/09/01 18:43
- AJAX 自作の地図をグーグルマップのようにしたい 3 2022/11/15 11:53
- HTML・CSS サイトをマルチデバイス対応にする為の準備や、CSSなどのおすすめサンプル集やアドバイスを頂きたいです 1 2022/07/13 22:15
- HTML・CSS スクロールすると追従する画像のコードを書いているのですが、追従する画像の大きさの調節が上手くいきませ 2 2022/04/18 12:52
- その他(ブログ) シーサーブログのタイトル文字位置とブログ説明文字位置の変更方法 2 2022/09/22 20:55
- JavaScript HTML&CSS Javascriptによる動的テーブル 1 2023/03/27 19:51
- 画像編集・動画編集・音楽編集 daVinciResolveの再生プレビュー画面がカクつきます。 daVinciResolve18を 2 2023/01/20 01:35
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
エクセルで、特定の画像へリン...
-
JW CAD の 挿入した画像への...
-
これはどこの国ですか?
-
マッチングアプリ風の画像を作...
-
画質の高い画像の検索方法あり...
-
ワードプレスで、画像の横に文...
-
HO CADの活用について
-
aviutl 動画に画像をうまく貼る...
-
複数画像が投稿されているツイ...
-
画像に文字をきれいに重ねるの...
-
ホームページビルダーの画像の...
-
texでPDF作る際PDF読み込みたい
-
Lightroom CCの書き出しについ...
-
紙データからテキストを取り出...
-
画像掲示板の画像のみをサムネ...
-
写真画像を鮮明にするソフトウェア
-
JPG画像のURLを得る方法に関して
-
既存画像(gif または png)の背...
-
discordで画像保存できない
-
コーレルドローで作ったロゴの...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
JW CAD の 挿入した画像への...
-
ChatGPTについて、質問です。 C...
-
texの表について(セルの内容の...
-
これはどこの国ですか?
-
エクセルで、特定の画像へリン...
-
HO CADの活用について
-
マッチングアプリ風の画像を作...
-
PDFファイルの「加筆した」画像...
-
一太郎の文章に貼り付ける画像...
-
ワードプレスで、画像の横に文...
-
InDesignスプレッドに含まれる...
-
ホームページのサムネイル画像...
-
JPEGの劣化してる部分(ギザギ...
-
ループする画像の作り方
-
imageJの使い方
-
作ったjpg画像に「サンプル」と...
-
画質の高い画像の検索方法あり...
-
GIMPで回転について
-
画像生成AIで作成したTシャツを...
-
Photoshopでぼやけた画像をくっ...
おすすめ情報