title: problem in adjusting background image in css
body: <p>I'm a beginner in html, css and stuck in a problem where I am trying to adjust a background image according to screen size but can't.</p>
  <p>You can see that the full picture is not adjusted according to screen size and looks like after a certain portin a the picture started again. I don't know what is the problem and how to tackle it .</p>
  <p>html</p>
  <p><img src="https://i.stack.imgur.com/Pc0Jv.jpg" alt="my html code" /></p>
  <p>CSS</p>
  <p><img src="https://i.stack.imgur.com/PeHuS.jpg" alt="my css " /></p>
  <p>My website</p>
  <p><img src="https://i.stack.imgur.com/W8aww.jpg" alt="my website" /></p>
  <p>the picture  I want as my background</p>
  <p><img src="https://i.stack.imgur.com/QSbA7.jpg" alt="" /></p>