Question

我试图调整网站的正文图片，以便它不会占用整个网页。我该如何调整大小？我不确定代码，所以我只显示了图片网址。我想要它，以便在图像下面显示空白区域，声明它的最大高度，而不是跨越页面。

＆＃13;

body {
  background-image: url(C:/Users/Gabriel/Downloads/Green-blur.jpg);
  background-repeat: none;
  font-family: "PT Sans", sans-serif;
}

＆＃13;

<body>

  <div class="container-fluid">

    <ul id="nav">
      <li id="brand"><a href="#">MINIMAL</a></li>
      <li id="navm"><a href="#">Men</a></li>
      <li id="navm"><a href="#">Women</a></li>
      <li id="navm"><a href="#">Contact</a></li>
    </ul>

  </div>

  <div>
    <h1>Simplicity is Minimal</h1>
  </div>

  <div id="home">
    <a href="#" id="homeb">Shop Now</a>
  </div>

</body>

＆＃13;

使用background-repeat：无;

进行修复

Answer 1

尝试为您的身体使用这些css规则：

body {
  background: url(C:/Users/Gabriel/Downloads/Green-blur.jpg);
  font-family: "PT Sans", sans-serif;
  background-size: 69px 54px; // with the first value being the width; second value the height
  // following rules are optional, don't know if you need them in your case
  // background-position: center;   
  // background-repeat: no-repeat; 
}

请注意，background-size的值也可以声明为百分比值。如果您想让图像从页面上特定的某个位置开始，您可以使用

background-position: top right; // default is top left

随时告诉我是否有效

Answer 2

您可以在css

中将此代码添加到您的正文样式中

background-size: 100px 200px; // first value difines width and second value, height

Answer 3

尝试使用它，它一定会帮助你。

body {
  background-image: url(C:/Users/Gabriel/Downloads/Green-blur.jpg);
  background-size: 50% 80%; // you can change % value as per your requirement
  font-family: "PT Sans", sans-serif;
}

如何在Body CSS中调整图像大小

3 个答案: