Як зробити смугасту таблицю v-data у Vuetify?

Зроблено у Vuetify, все працює чудово, мені потрібно лише зробити чергові рядки різними кольорами. Або додайте до таблиці клас bootstrap .table-striped.

таблицю

5 відповідей 5

Ви можете досягти цього, використовуючи таке правило CSS:

Розширюючи відповідь Буссадджри Брагіма. Ось декілька css для стилізації колонтитула в усьому світі

Щоб досягти смуг як для темної, так і для світлої теми, я роблю це:

У мене були деякі проблеми з цим, якщо у вас є таблиця, яку можна розширити. Це тому, що за прикладом у документації vuetify отримана таблиця складе один рядок також для вмісту, що розширюється, який прихований, я думаю.

Аніху, це стиль, який я закінчив:

Кожен четвертий рядок зі зміщенням 3, тому ви не включаєте заголовок.

У v-data-table я змінив властивість класу на class = "table-striped elevation-1", і мені це добре працює.