
ライブドアブログを使っています。
記事の中で、画像3つを中央に寄せて、横に並べて表示させるには、どうしたらいいのでしょうか?
他の質問を見ると以下のタグの、
<a href="http://image.blog.livedoor.jp/***.jpg" target="_blank"><img src="http://image.blog.livedoor.jp/****/imgs/***.jpg" width="159" height="130" border="0" alt="******" hspace="5" class="pict" align="●●●●"/></a>
●●●●の部分を、left、center、rightにしたら良い。とあったのですが、それだと、それぞれが離れすぎてしまい、間抜けな感じになってしまいます。
ですので、3つの画像を横に並べて、中央に寄せて表示させるにはどうしたらよいのでしょうか?
■を画像としますと、
今の状態が
■ ■ ■です。
中央に寄せて横に並べるというのは
■■■です。
教えてください。よろしくお願いいたします。
No.1ベストアンサー
- 回答日時:
<CENTER>
<a href="http://image.blog.livedoor.jp/***.jpg" target="_blank">
<img src="http://image.blog.livedoor.jp/****/imgs/***.jpg" width="159" height="130" border="0" alt="******" hspace="5" class="pict"></a>
</CENTER>
align="●●●●"/>の部分を削除、
画像表示タグの前に<CENTER>表示タグの最後に</CENTER>
を置くと良いと思われます。
No.3
- 回答日時:
下記のようなHTMLタグ表現ではいかがですか。
<div style="text-align: center;"><a target="_blank"
href="http://***.ne.jp/index.html"><img
src="http://***.ne.jp/imgs/01.jpg" alt=""
border="0"></a><a target="_blank"
href="http://***.ne.jp/index.html"><img
src="http://***.ne.jp/imgs/02.jpg" alt=""
border="0"></a><a target="_blank"
href="http://***.ne.jp/index.html"><img
src="http://***.ne.jp/imgs/03.jpg" alt=""
border="0"></a></div>
No.2
- 回答日時:
IMGタグの前後のタグに何を書かれているのかわからないのですが、恐らくTABLEタグを使用していると思います。
予想では、
<table width="100%">
<tr>
<td><img src="xxxx" …></td>
<td><img src="xxxx" …></td>
<td><img src="xxxx" …></td>
</tr>
</table>
こんな感じになっていると思うので、全てのIMGタグをひとつのTDタグ内に書いてください。
<table width="100%">
<tr>
<td align="center"><img src="xxxx" …><img src="xxxx" …><img src="xxxx" …></td>
</tr>
</table>
それからTDタグ内を中央寄せにするために、alignプロパティを使用しています。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- HTML・CSS FC2カートのテンプレートでの商品表示について 1 2023/03/02 18:05
- Perl 画像が表示でnull; this.src 1 2022/04/19 11:31
- JavaScript jQueryで同じクラス名のものを別物として扱いたい 1 2022/06/17 14:14
- HTML・CSS PCサイズで赤い画像2つと、青い画像2つがそれぞれ横に2つずつ並んでいるのですが、これをスマホサイズ 5 2022/04/11 12:01
- HTML・CSS 【HTML】【CSS】【Swiper】 元の画像は横1200×縦600なのですが、実際のサイト上に反 5 2022/07/16 13:57
- HTML・CSS CSSのホバーエフェクト 1 2023/06/19 06:53
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
アマゾンアファリエイトをカズ...
-
リンクを知らせる手のマークが...
-
ボタンをセル内一杯に表示させ...
-
この解答は合っていますか?
-
footerの背景が切れて、背景画...
-
色のついた外枠を部分的に付け...
-
Fetchでのgif画像アップロード
-
画像をクリックして元に戻すには
-
サムネイルをマウスオーバーす...
-
画像が表示されない
-
ホームページで画像を横に並べ...
-
CSSの左横に隙間ができてしまい...
-
htmlの文字が縦書きになる
-
含む含まないという概念自体の...
-
htmlのolやulなどlistにtitleや...
-
HTML属性での「""」 「''」違い
-
<h1>、<h2>と<p><div>の行間を...
-
ナマズのスコアについて
-
HTMLについて
-
NからZへの全単射を具体的に構...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ボタンをセル内一杯に表示させ...
-
リンクを知らせる手のマークが...
-
画像を全体の200%の倍率で表示...
-
ホームページの一番下に配置し...
-
画像をクリックして同じページ...
-
XML画像データををHTMLで簡単に...
-
table で画像をピッタリとくっ...
-
画像の横に画像を配置したいです。
-
機種依存文字、m2(平方メート...
-
画像リンクの周りに線が出ます
-
画像をリンクさせると紫の枠が...
-
オンマウスで離れた画像が変わる。
-
UDP通信を使うチャットプログラ...
-
画像をクリックして元に戻すには
-
1箇所に複数画像を別々に配置は...
-
システム開発会社のホームページ
-
floatさせたdtの内容が多い場合...
-
inputタグでサーバにデータを送...
-
jqureryスライドショーが上手く...
-
ホームページで画像を横に並べ...
おすすめ情報