Adjusting image size (HTML/CSS)

Question

I came up with some code for a website I am making, and I was wondering how you would change the size of the image on the page

Code:

<html>
  <head>
    <style type="text/css">

      .bg {
        background: url(http://fc05.deviantart.net/fs48/i/2009/235/2/5/clouds_over_california_by_Un_symmetrical.jpg) center top;
        height: 30%;
      }

    </style>
    <script src="jquery.js"></script>
    <script>

      var bgPos = 0;
      setInterval(function() {
        $(".bg").css("background-position", (bgPos-= 2) + "px");
      }, 60);

    </script>
  </head>
  <body>
    <div class="bg"></div>
  </body>
</html>

Answer 1

You can use an img tag and set the size on it directly such as:

<img src="smiley.gif" alt="Smiley face" height="42" width="42">

or you can just resize you image in some application like photoshop to the exact size you want, then set the height and width in css to match whatever size you made the image.

.bg{
    background: url(http://fc05.deviantart.net/fs48/i/2009/235/2/5/clouds_over_california_by_Un_symmetrical.jpg) center top;
    width: 300px;
    height: 200px;
}

Adjusting image size (HTML/CSS)

Question

1 answers

solution1
0 2014-07-25 19:00:56

Adjusting image size (HTML/CSS)

Question

1 answers

solution1 0 2014-07-25 19:00:56

solution1
0 2014-07-25 19:00:56