Вопросы Теги

Как расширить фоновое изображение ячейки таблицы с CSS?

Как я могу расширить фоновое изображение ячейки таблицы с CSS? Я Погуглил его без результатов.

Когда Вы устанавливаете фоновое изображение ячейки, и фоновый размер меньше, чем ячейка, затем это будет повторено.

Как я могу вынудить этот фон расширить всю ячейку таблицы вместо этого?

7
задан Brian Tompsett - 汤莱恩 8 June 2017 в 15:29
поделиться

2 ответа

Вы не можете растянуть фоновое изображение.

Если вы хотите растянуть изображение, вы должны поместить его в тег img . Вы можете использовать абсолютное позиционирование, чтобы поместить контент поверх изображения.

4
ответ дан 6 December 2019 в 12:45
поделиться

Можно растянуть фоновое изображение с помощью свойства CSS background-size .

Примеры: 

body { background-size: 100% auto } /* Stretches image to full horiz. width */
body { background-size: 50% 50% } /* Stretches image to half of available
width and height - WARNING: aspect ratio not maintained */

body { background-size: cover } /* Ensures that image covers full area */
body { background-size: contain } /* Ensures that image is completely visible */

Все основные современные браузеры поддерживают эту функцию:

  • IE с 9.0
  • Chrome с 3.0
  • Firefox с 4.0
  • Opera с 10.0
  • Safari с 4.1
9
ответ дан 6 December 2019 в 12:45
поделиться