【HTML/CSS】「CSS」だけで画像を表示する方法とは？【プログラミング】

みなさんこんにちは！おさかなです！

今回は「「CSS」だけで画像を表示する方法」について、書いていこうと思います！

それでは、レッツゴー！！！！！

はじめに

コーディング初心者の人は、画像を配置するときに使用するのは「HTML」の

<img src="" alt="">

を思いつく人が多いと思います。
でも実は！「CSS」だけで画像を表示する方法があるんです！

おさかな

え！すごい！気になる…！

実際につかってみよう！

それでは、CSSで画像を表示してみましょう！

下記コードを画像を表示したい箇所に設置します。

background: url("ここに画像を指定") no-repeat;

実際に指定するとこんな感じになります…！

  .title {
  background: url("../img/title.jpg") no-repeat;
}

おさかな

おおおおおおおお！

「HTML」とほとんど差がない状態で画像を指定できますが、繰り替えし画像を使用したい場合などは、プロパティを少し変更するだけで、かんたんに行えます。

background: url("ここに画像を指定") ここを自由に指定できます;

感想・まとめ

今回は「「CSS」だけで画像を表示する方法」について、書いていきました…！

いかがだったでしょうか？

HTML/CSSそれぞれで画像を指定する方法を学習しておくと、何かと便利かと思います。ぜひ臨機応変に使い分けて、さらに技術力をアップさせていきましょう！
(おさかなもがんばります…！)

おさかなびではプログラミング学習中の人、ブログ初心者に向けて、「デジタル時代を楽しむためのミニ知識」をご紹介しています！
ぜひ他のページも覗いてみてください…！

それでは今回はこの辺で！

ここまで読んでくださり、ありがとうございました！

おさかなでした！