
ブログのためのHTMLを勉強中です。
アイコンくらいの大きさの画像を連続させてラインのようにしたいと思っています。
画像貼り付けタグを並べただけでは、ものすごく詰まっているので
少し間隔を取りたいのですがどうすればいいんでしようか?
スペースを入れただけでは変化がありませんでした。
また、文字の前にも画像を貼り付けたいのですが、同じように接近していて見栄えがよくありません。
2日ほど色々なHTML講座を探してみたのですが、どうしてもわかりませんでした。
どなたか教えてください。 どうぞよろしくお願いします。
No.1ベストアンサー
- 回答日時:
半角のスペースではなく、全角のスペースを入れると間が空きます。
> 文字の前にも画像を貼り付けたいのですが
この場合は・・・
<img src="画像のURL"align="left" vspace="15" hspace="15">
で、画像の右側に文字が入れられます。
vspace="15" hspace="15" で、画像と文字の空きを指定しています。
align="left" を align="right" にすれば、画像の左側に文字を入れられます。
できました!
長時間悩んだわりには簡単で、肩すかしをくらったようです(笑)
文字の前にも・・・というのは今回、テーブルタイトルをはさむように
画像を貼り付けたかったので、これも全角スペースで整えることができました。
教えていただいたソースは「テキストの回り込み」ですよね?
少し長めの文章の近くに画像を貼り付けることを考えていたので
今度使ってみますね。
どうもありがとうございました。
No.3
- 回答日時:
勉強中とのことですのでソースは書きませんが、
テーブルを組んで一つのセルに一つの画像を入れ、
テーブルのマージン.パディング.ボーダーをいじってみるのもいいかもです。
勉強頑張って。
今、テーブルを勉強しています。
行や列の挿入、連結が何とかできるようになりました。
おっしゃるとおり、マージン.パディング.ボーダーを工夫すれば
表組みだけど表でないものができそうですね。
そうすると文字と文字の間に画像を入れることもできる・・・
ますます楽しくなってきました。
どうもありがとうございました。

No.2
- 回答日時:
勉強中ということですから、HTMLソースを記述して目的の表示を工夫されたいのですね?
という記述を間に入れればスペースが出来ます。
文字と文字の間でも、画像と画像の間でも、文字と画像の間でも同じ効果が出ます。
ソース例
<P>画像や文字等の間にわずかスペースを空けます。<IMG src="syasin.jpg" width="100" height="80" border="0"><IMG src="syasin2.jpg" width="100" height="80" border="0"></P>
上記例のようには幾つも幾つも並べて記述することが出来ます。その分間隔は広くなって行きます。
他の方法をもう一つご紹介しますと、
透明gif画像を作り、それを置く位置ではwidth="○○”とその場に合うような幅をピクセルで指定してやります。
この為には透明gif画像を作るソフトが必要になります。
更には奇手ではありますが、画像と画像の間に「_」(アンダーバー)や[-](ハイフン)などを入れてやる方法もあります。でも積極的に模様として利用するのであれば*(アフタリスク)も使えます。こんな方法が一番お手軽ですね。
あれこれやっているうちに自分で工夫が出来るようになるとHTMLやCSSが面白くなりますし、色彩や配置なども凝れば凝るほど深みにハマりますね。
そうなんです、一つ一つの方法は理解できても、いざ作成するとなると
組み合わせることが必要なんですよね。
タグの挿入場所を間違えて、とんでもないものができたりしました(笑)
教えていただいた「 」は残念ながら私が登録している楽天広場では無効でした^_^;
でもこういう方法もあるということは覚えておきますね。
アンダーバーやアスタリスク、これは目から鱗でした。
色で工夫すれば綺麗なのができそうです! いつか試してみます。
おっしゃるとおり、今どっぷりハマってます。
少しずつ出来上がっていくのがとても嬉しくて^^
ブログを誰かに読んでもらうというより、色や画像や素材を駆使して
自分の気に入ったものを作る・・・こちらの方が目的になりそうです。
どうもありがとうございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
「あるサイトのリンクを踏まな...
-
ワードプレスアドレスの固定ペ...
-
外国人のコメント欄でよく、コ...
-
ブログにYouTubeのURL貼る
-
ブログの画像サイズについて。...
-
ブログのプレビュー画面が表示...
-
ホームぺージの移管について。...
-
ホームページで集客する場合た...
-
Googleアドセンス
-
ワードプレスは、ドメイン作った後
-
ワードプレスでドメイン2つも作...
-
ホームページ制作の単純な無料...
-
サーバーについて
-
ホームページ制作とコーティング
-
1つのサーバー契約で複数のドメ...
-
ワードプレスのプラグイン
-
Adobe Express(アドビエクスプ...
-
ワードプレステーマkatawaraのCSS
-
ワードプレスのテーマ:katawara
-
ホームページやブログに関しま...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
L字みたいな記号の表示
-
画像と画像の間のスペースはど...
-
2ちゃんねるの画像
-
どこの国の文字でしょうか?
-
スキャナで取り込んだ画像の種...
-
アップロードした画像の「画像H...
-
エキサイトブログについて。 ...
-
ブログ クリックして画像を大...
-
忍者ブログでの画像の挿入につ...
-
WordPressでの影の付け方
-
テーブルセル余白(例えば左側...
-
ピクチャーボックスの大きさに...
-
iPhoneで HTMLファイルを閲覧
-
シーサーブログのヘッダー画像...
-
borderの太さを1px以下に見せ...
-
ブログを投稿したことを 「UP」...
-
webサイトの表記を書式を崩さず...
-
レスポンシブWeb 右側の表示が...
-
ホームページビルダーの表の大...
-
複数の画像を1枚にしたファイ...
おすすめ情報