[返信する]
画像を3枚並べたいです。
By 匿名
2011-01-06 22:21:55
既出でしたら すみません。
『画像 並べる』で検索をしてみましたが出てきませんでしたので質問させて頂きます。
トップページで こんな風に画像を並べたいのですが↓
┌──┐
│ │□□
└──┘
(大きい画像の真ん中の位置に小さい画像)
<IMG src=画像URL align=middle>
↑このタグを使っているのですが、どうしても綺麗に真ん中になりません。
是非 タグ等教えてくだされば助かります!
もしも他の方のトピで解決出来そうでしたら、誘導して頂きたいです。
ちなみに機種はauです。
どうか宜しくお願い致します。
W61K
[編集]
By 匿名A
2011-01-07 01:57:42
たまたま同機種だったので以下のタグで確認してみましたが、すべて正常に表示されました。
- - - - - - -
<IMG src=#mtr数_url# align=middle> #mtr数# #mtr数#
<img src="#mtr数_url#" align="middle"> #mtr数# #mtr数#
<img src="#mtr数_url#" align="middle"> <img src="#mtr数_url#"> <img src="#mtr数_url#">
(#mtr数#・#mtr数_url#の数は任意の数に変更。デコヤさんの素材でもOKでした)
(使用素材px[縦*横]:大素材[160*80] 小素材[16*16])
- - - - - - -
基本的なことですが、大きな画像と小さな画像をすべて横に並べても230px以下でしょうか?
230px以下でなければ自動的に折り返され綺麗な表示にならないと思われます。
上記で解決しなければ、【綺麗に真ん中に表示されない、をもっと具体的に】【各画像の縦横px数】を教えてくださればこちらも色々対処方法を考えることが出来るかもしれないので、教えてくだされば嬉しいです。
あと本題とは関係ありませんが、<img src="素材url" align="middle">のように、イコール後はダブルコーテーション(")でくくると不具合が出る確率が低くなります。
リンクタグなどでダブルコーテーション抜きをするとURL先に飛べない機種もありますので、ダブルコーテーションをつけていただけると管理・閲覧共にメリットがあるかと思います。
リンクタグでダブルコーテーションを抜いていませんでしたら、いらぬお節介を書いてしまい誠に申し訳ありません。
【02:45 追記】- - - - - - -
<img src="#mtr数_url#" align="middle"> #mtr数#
(大素材[160*80]、小素材[32*32])
で確認したところ若干上よりになりました。
これはおそらく【左の画像の中心線に右の画像や文の一番下を合わせている】ので、携帯の仕様となりどうすることも出来ないと思われます。
【綺麗に表示されない】の意味がこれでしたら、お役に立てなくてすみません。
W61K
[編集]
By 匿名
2011-01-07 17:29:19
匿名Aさま、ありがとうございます。
こんなデザインにしたいのですが、画像の大きさは 縦×横で、
┌───┐
│ │ □ □
└───┘
┌───┐
□ □ │ │
└───┘
左上→52px×71px (大)
上真ん中→14px×18px (小)
右上→14px×31px (小)
左下→14px×15px (小)
下真ん中→14px×25px (小)
右下→57px×58px (大)
です。わかりにくくて すみません。
教えて頂いたタグ全てで試してみたのですが、小さい画像は4つとも、大きい画像の真ん中より、やや上に並んでしまいました。
何度も申し訳ありませんが、何か解りましたら教えてください。
よろしくお願いいたします。
W61K
[編集]
By 匿名
2011-01-07 20:22:15
上の方の
>これはおそらく【左の画像の中心線に右の画像や文の一番下を合わせている】ので、携帯の仕様となりどうすることも出来ないと思われます。
の部分に該当するのでは?
デザインで使用するのはお勧めしませんが、テーブルタグは試されましたか?
詳しいタグはYah●o!やGo●gleなどでタグ支援サイトを検索して調べてください。
教えられたものをただコピペするよりは、ご自分で色々試行錯誤された方が後々役に立つと思います。
CA003
[編集]
By 匿名
2011-01-07 23:24:27
匿名さま、ありがとうございます。
支援サイトは、色々なところを見ましたが、手がかり0でした…。
私がタグの知識が無い上に、探し方が悪いのだと思います。
テーブルタグは 思いつきませんでした!
また検索して挑戦してみますね。
良い支援サイトがありましたら、教えて頂ければ幸いです。
頑張ります。ありがとうございました!
W61K
[編集]
[1-10表示]
[返信する]
[新規トピ]
[戻る]
無料HPエムペ!