WEBデザイン初心者講座コミュの■CSS 画像と画像の間隔＆CSS画像配置の場合の空欄箇所について

画像を3枚横に並べて多少の間隔（５ｐｘ）を開けたいと思っております。

 （～の中は空欄）

.text1 {
background-image: url(../image/gazou.jpg);
background-image:no-repeat;
float:right;
padding-left:5px;
}

ですが、～が空欄ってよいのでしょうか？？
上記の他に画像を3枚横に並べる方法（css）はありますでしょうか？？

コメント(3)

最初
全て
最新の40件

[1] mixiユーザー 09月01日 17:33

実際にどういう見せ方をしたいのか提示すると、的確な答えがもらえると思いますよ。

ちなみにですが、P要素の背景にする必要はありますか？
もし特に必要がないのであればimg要素で表示して、そのimgにclassを設定し、
それにmarginを設定すると希望した表示になると思います。

[2] mixiユーザー 09月02日 20:02

写真や図面など宣伝などに使用する画像の場合、もしくは画像のみの場合は、
cssからのbackgroundではなく、直接HTMLに画像を貼り付けた方がいいですよ。
（alt属性によって画像の代わりとなる代替テキストを用意する為です。）

その場合、えどさんと同じやり方になりますね。
<img class="test" src="style/images/test.gif" alt="テスト画像" />

img.test {
　　　margin-left: 5px;
　　　}

>ちなみに
～が空欄ってよいのでしょうか？？

なんですが、もう１つの方法として、その画像の代替テキストを入れるのはどうでしょうか。
test画像

「test画像」のテキストをWEB上に表示させたくない場合は、cssで「text-indent:-9999px;」を設定します。

.test {
　　　background: url(../image/gazou.jpg) no-repeat;
　　　text-indent:-9999px;
　　　 }

NAVI設定とかでよく使ってましたが。

他にも方法は色々あると思いますが参考までに…

[3] mixiユーザー 09月04日 08:20

〉えどさん

〉ツキさん

書き込みありがとうごさいます！

とっても勉強になりました。早速、やってみたいと思います

有難うございました

ログインすると、みんなのコメントがもっと見れるよ