Как показать изображение таблицы в ячейках, а не в пространстве?

Question

Рассмотрим веб-страницу с фоновым изображением pageBG.jpg. Теперь рассмотрим таблицу с ячейками 100px x 100px и относительно большим пространством между ячейками 50px. Таблица имеет другое фоновое изображение, скажем, tableBG.jpg.

Есть ли способ установить маскирование, чтобы ячейки отображали изображение таблицы (ну, их часть), а пространство ячеек показывает изображение страницы?

РЕДАКТИРОВАТЬ: пример изображения:

Зеленый - pageBG.jpb, а черно-коричневое изображение - tableBG.jpg

Answer 1

Вы можете сделать это с помощью CSS-спрайта, просто потребуется много CSS. У вас будет фоновое изображение страницы, а затем одно изображение, которое вы планируете использовать для фона таблицы, но оно будет использоваться для каждой отдельной ячейки. Каждая ячейка должна была бы использовать CSS для определения положения изображения в ячейке по оси x / y. Вам просто нужно рассчитать размер ячеек + интервал, чтобы знать, где расположить изображение внутри ячеек.

Это было бы гораздо проще сделать с DIV, я думаю.

Answer 2

Не можете ли вы применить класс к вашему столу и применить его к потомкам ТД?

table.myborderclass {
    //transparent
}

table.myborderclass td {
    background: yada
}

Answer 3

Нет, не так, как вы думаете об этом.Я бы не стал помещать изображение в качестве фонового изображения клетки.Вместо этого поместите div в ячейку, размер которой соответствует правильному размеру маскирования, и примените к нему фоновое изображение с помощью CSS background-image.div получает изображение, а пространство ячеек (которое появляется за пределами div) остается неизменным.