Как вы изменяете размер фонового изображения в CSS?

Question

Ниже мой код.Я не знаю, как изменить размер изображения, как это в одной строке кода.Создать новую строку кода и использовать тег?Я не знаю, что делать.Что-то не так?

#centerpicture {
  min-height: 400px;
  background: url("Enderman_wallpaper.jpg") no-repeat;
  text-align: center;
  color: #ffffff;
}

показывает только один глаз спрайта, но он должен отображаться как одно целое лицо спрайта.

Answer 1

Вы можете использовать одно из следующих свойств для определения размера фоновых изображений:

background-size: cover; 
background-size: contain;
background-size: 30%; //using percentages
background-size: 100px 200px // using pixels

Поэкспериментируйте с этими свойствами и посмотрите, что подходит вам больше всего.Пожалуйста, обратитесь к документации для получения дополнительной информации.

Чтобы разместить фоновое изображение, используйте свойство background-position.

Кодстиль:

Вы можете объявить background свойства в отдельных строках или использовать сокращенный синтаксис :

background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit;

В вашем случае вы можете использоватьэто:

background: url('Enderman_wallpaper.jpg') 0%/30% no-repeat;