Атрибут style тега <tbody>

Описание

Атрибут style для элемента <tbody> позволяет задавать CSS-стили непосредственно для группы строк таблицы. Это удобно для быстрого оформления без создания отдельных CSS-правил.

Пример использования:
<table> <tbody style="background-color: #f5f5f5; font-family: Arial, sans-serif;"> <tr> <td>Продукт</td> <td>Цена</td> </tr> <tr> <td>Смартфон</td> <td>500$</td> </tr> </tbody> </table>

Основные CSS-свойства для tbody:

Свойство Пример Эффект
background-color background-color: #f8f9fa; Цвет фона группы строк
font-family font-family: 'Segoe UI', sans-serif; Шрифт содержимого
color color: #333; Цвет текста
border border-top: 2px solid #ddd; Границы группы строк

Особенности работы:

  • Стили применяются ко всем ячейкам внутри <tbody>
  • Имеют наивысший приоритет (переопределяют внешние стили)
  • Не поддерживают псевдоклассы (:hover и др.)
  • Подходят для быстрого прототипирования

Пример с чередованием строк:

<table> <tbody style="background-color: #fff;"> <tr style="background-color: #f9f9f9;"> <td>Товар 1</td> <td>100$</td> </tr> <tr> <td>Товар 2</td> <td>200$</td> </tr> </tbody> </table>

Рекомендации:

  • Используйте для единичных стилевых правок
  • Для сложного оформления применяйте внешние CSS-стили
  • Избегайте дублирования стилей в каждой строке
  • Проверяйте адаптивность на мобильных устройствах

Ограничения:

  • Увеличивает объем HTML-кода
  • Усложняет поддержку и изменение стилей
  • Не поддерживает медиа-запросы для адаптивности
  • Может конфликтовать с CSS-фреймворками

Примечание: Для профессиональной верстки таблиц рекомендуется использовать классы и внешние CSS-файлы вместо inline-стилей.