html - 调整图像大小 (HTML/CSS)

标签 html css image

我为我正在制作的网站想出了一些代码,我想知道您将如何更改页面上图像的大小

代码:

<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>

最佳答案

您可以使用 img 标签并直接在其上设置大小,例如:

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

或者您可以在某些应用程序(例如 photoshop)中将图像调整为您想要的确切大小,然后在 css 中设置高度和宽度以匹配您制作图像的任何大小。

.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;
}

关于html - 调整图像大小 (HTML/CSS),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24962659/

相关文章:

HTML 表单提交后重定向

html - Tables with Fixed Headers vertical scroll bar is Flickr in IE11

html - 是否可以使用 Rollup 创建一个从模板注入(inject) HTML 的包?

javascript - 无法在 spring security 3 中允许静态资源

php 表单 - 需要上传图像

javascript - 在表单中切换时如何跳过输入?

css - float 段落宽度未定义

html - 我的行内 block 元素没有正确排列

android - 将其他应用程序的 Drawable 图标设置为通知生成器

html 和 css 背景 url 图像压缩