Как растянуть задний фон в css?

Пользователь

от montana_hand , в категории: HTML/CSS , 3 года назад

Как растянуть задний фон в css?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от Ekaterina_90 , 3 года назад

@montana_hand  Растянуть задний фон в CSS можно через свойство background-size в качестве его значения указываем 100% :


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <style>
      body {
        background: url(image/11.jpeg) no-repeat;
        background-size: 100%;
      }
    </style>
  </head>
  <body></body>
</html>

Пользователь

от jensen , год назад

@montana_hand 

Для растягивания заднего фона в CSS используется свойство background-size. Пример кода:

1
2
3
4
body {
  background-image: url("img/background.jpg");
  background-size: cover; /* растянуть фон на всю область */
}


Также можно использовать значения:

  • contain - фон будет масштабироваться, чтобы соответствовать размеру области, но не выходить за ее пределы (с сохранением пропорций);
  • auto - размер изображения останется неизменным, если оно меньше области, то будет выровнено по центру;
  • 100% 100% - растянуть изображение по ширине и высоте области.
1
2
3
4
body {
  background-image: url("img/background.jpg");
  background-size: 100% 100%; /* растянуть фон на всю область */
}