Изображение на заднем плане

Question

Я хочу поместить фоновое изображение только в 1 ячейку таблицы.Когда я указываю в теге таблицы или в «стиле» фон применяется ко всему экрану.Можно ли указать разные локальные изображения для разных ячеек в таблице, используя только HTML?

Соответствующий HTML (из комментария ОП):

<table align="center" height=501 border=2>
    <tr>
        <td height=167 align="center" style="background: (C:\Users\user\Desktop\4R9EF00Z.jpg);">[here]
      <a href="table9_1.html" target="_self"> Apple pie </a>s</td>
        <td rowspan=3 width="80%"> <b>Ingredients</b> .........</td>
    </tr>
</table>

Answer 1

<table style="width: 100%; height: 300px; ">
     <tr>
         <td style="background-image:url(http://www.housecatscentral.com/kittens.jpg)">CELL ONE</td>
         <td>CELL TWO</td>
    </tr>
</table>

Способы применения стиля:

• Встроенный стиль (обычно не предпочтительный метод)
• Селектор класса
• Селектор иерархии CSS2 / 3 или псевдокласс
• Селектор идентификатора

Answer 2

HTML:

<table>

    <tr><th>Header 1</th><th>Header 2</th><th>Header 3</th></tr>

    <tr>

        <td class="cell">Cell 1</td>
        <td id="cell">Cell 2</td>
        <td style="background-color: yellow">Cell 3</td>

    <tr>

</table>

CSS:

.cell {
    background: url(http://forum.php.pl/uploads/profile/photo-50953_thumb.png);
}

#cell {
    background: url(http://forum.php.pl/uploads/profile/photo-50953_thumb.png);
}

Предварительный просмотр здесь: http://jsfiddle.net/384An/

Answer 3

С помощью CSS можно двумя способами назначить id ячейке:

#tableCellID {
    background-image: url(path/to/image.png);
}

Или использовать nth-child:

tbody tr:nth-child(2) td:nth-child(3) {
    background-image: url(path/to/image.png);

}

Объединение обоих подходов в одной демонстрации JS Fiddle .

Если вы должны использовать встроенные стили (и я искренне рекомендую избегать этого, если вы можете ):

<td style="background-image: url(path/to/image.png);">...</td>

Или, возможно (но не рекомендуется):

<td background="path/to/image.png">...</td>

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

Обновлено предыдущее демо JS Fiddle .

Answer 4

Вы должны указать это для ячейки (тэг td), а не для всей таблицы.сделать это так:

<tr><td style="background-image:url('yourPath')"></td></tr>

Answer 5

Укажите свой фон (используя атрибут style) для тега <td> (или тега <th>)

Answer 6

Просто используйте встроенный CSS для элемента <td> ячейки.

Например:

<td style="background: url(/resources/images/background.png);">