how to add a background image to a css class

Question

I want to add a background image to a CSS class but it dosn't show up.

I've already tried to add height and width.

<div class="landing1">
  <h2>The Lnad OF Programming</h2>
  <p>get involved</p>
</div>


<style>
  body,
  html {
    margin: 0;
    size: 100%;
  }
  
  .landing1 {
    margin: 3px;
    text-align: center;
    background-image: url(imgs/bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width: 400px;
    height: 500px;
  }
</style>

the background image isn't show up.

it works perfect please check your path:jsfiddle.net/b7vj1ufa — לבני מלכה
– לבני מלכה, Commented Feb 13, 2019 at 12:41
Your image path is not correct... make them correct, your image will be show. — Mohit Gupta
– Mohit Gupta, Commented Feb 13, 2019 at 12:42

ellipsis · Accepted Answer · 2019-02-13 12:45:10Z

1

It is working. You are giving the image path wrong

body , html{
margin:0;
size:100%;
}

.landing1{
margin:3px;
text-align:center;
background-image:url(http://placekitten.com/500/500);
background-repeat: no-repeat;
background-size: cover;
background-position:center;
width:400px;
height:500px;
}

<div class="landing1">
    <h2>The Lnad OF Programming</h2>
    <p>get involved</p>
</div>

edited Feb 13, 2019 at 12:45

answered Feb 13, 2019 at 12:40

ellipsis

12.2k2 gold badges19 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

11 Comments

Joseph izz Over a year ago

sorry i forgot to add that i tried to do that as well.

Vikas Jadhav Over a year ago

Quotes not needed

Joseph izz Over a year ago

no, i tried to put the image in the same folder with the index.html file

Joseph izz Over a year ago

well, it worked when i used (placekitten.com/500/500). but it still not showig when i try from a local file :(

Joseph izz Over a year ago

it worked when i added 'url(../imgs/bg.jpg)' , thanks alot!

|

Collectives™ on Stack Overflow

how to add a background image to a css class

1 Answer 1

11 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

11 Comments

Your Answer

Sign up or log in

Post as a guest

Related