CSS-背景位置:前150像素无效

时间:2018-08-26 05:42:39

标签: html css

我希望在浏览器未全屏显示时,背景图像的底部(而不是顶部)出现。

我尝试过:

<body
  style="background-image: url('./image5.jpg');
         background-size: cover;
         background-position: top 150px;"
> 

...尝试将图像向上移动一点,以便显示底部而不是顶部(但什么也没发生)。

现在,背景图片的最大顶部出现了,并且某些底部的部分处于隐藏状态,而不是全屏显示。这是屏幕截图:

enter image description here

仅在全屏模式下才会显示底部 enter image description here

<!DOCTYPE html>
<html>

<head>
  <title>Log In</title>
  <link rel="stylesheet" type="text/css" href="style.css">
</head>

<body style="background-image: url('data:image/jpeg;base64,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'); background-size: cover; background-position: top -200px;">
  <div class="header" style="background: rgba(76, 175, 80, 0.1);">
    <h2 style="color:	#FFFACD;">Register</h2>
  </div>

  <form method="post" action="register.php" style="background: rgba(76, 175, 80, 0.2);">

    <?php include('errors.php'); ?>

    <div class="input-group">
      <label style="color:	#FFFACD;">Username</label>
      <input type="text" name="username" value="<?php echo $username; ?>" style="background: rgba(0, 0, 250, 0.1);">
    </div>
    <div class="input-group">
      <label style="color:	#FFFACD;">Email</label>
      <input type="email" name="email" value="<?php echo $email; ?>" style="background: rgba(0, 0, 250, 0.1);">
    </div>
    <div class="input-group">
      <label style="color:	#FFFACD;">Password</label>
      <input type="password" name="password_1" style="background: rgba(0, 0, 250, 0.1);">
    </div>
    <div class="input-group">
      <label style="color:	#FFFACD;">Confirm password</label>
      <input type="password" name="password_2" style="background: rgba(0, 0, 250, 0.1);">
    </div>
    <div class="input-group">
      <button type="submit" class="btn" name="reg_user" style="background: rgba(0, 0, 250, 0.1);">Register</button>
    </div>
    <p style="color:	#FFFACD;">
      Already a member? <a href="login.php" style="color:	#6495ED;">Sign in</a>
    </p>
  </form>
</body>

</html>

2 个答案:

答案 0 :(得分:1)

我注意到您正在做的一件事是尝试为背景设置一个固定值。您可以尝试的方法是:

background-size: 100% 100vh;

这可能会起作用,因为它将背景大小设置为整个页面高度,因为您的浏览器窗口的大小可能与页面预期的大小不同。

答案 1 :(得分:1)

由于要从底部显示图像,因此可以设置background-position:bottom,这在所有屏幕尺寸中都有意义。但是请记住baground-repeat在这种情况下会引起问题。因此,您需要设置background-repeat:no-repeat。尝试下面的代码。

background-image: url('./image5.jpg');
background-size: cover;
background-position: bottom;
background-repeat:no-repeat;