css 画像を表示・設定

質問

cssでimgタグを使って画像を表示させたいのですが、
css内でsrcは使えないのでしょうか？

img{
background-image:url(
http://orange.jpg
)
}

このような書き方しかできないのでしょうか？

上記の書き方だと、画像の周りに線ができて、更にhtmlソース内のaltの文字まで表示されてしまいます。

回答No.3

noname#206842 · ベストアンサー

img{
background-image:url(http://orange.jpg);
}

???・・・画像に、背景が、必要のかな？・・・
それ以外では、このような記述は、ありえません！

枠線を引くのであれば、
img{padding:10px; border:solid 1px #000;}
と、いうような、記述になると思います。

srcというのは、ご存じでしょうが、source reference ということで、ソースが、どこに記載されているかを、表しています。当然ですが、css内には書きません！

HTML内の、alt は、画像が、表示されない場合・あるいは存在しない場合に、代替えのテキストを表示するものです。<img src="images/****.png" width="画像の幅" height="画像の高さ" alt="画像の代替え文字" />

背景として利用したいのであれば、background-imageは、header;nav;content;fotter;blockquote;box; などに記述することに、なります。

お礼

回答ありがとうございました。

回答No.2

outbrave

その書き方ですと、HTMLで表示させた画像の背景に画像を表示させるので、背景の画像は見えません。

HTMLの画像がなければ背景画像が見えますが、altの文字が表示され、a要素で囲んでいれば枠線も表示されます。

通常、背景画像を表示させる場合は、img要素以外の要素を使用します、例えばdiv要素など。

お礼

回答ありがとうございました。

回答No.1

sanzero

なぜcssで表示する必要があるのでしょうか？

imgタグaltが出るのはsrcの参照先に画像がないからですね。

線がでるのはブラウザがデフォルトでそういう設定にしているからです。
表示したくない場合は
img{
border:none;
}
とすれば良いです。

お礼

回答ありがとうございました。