Имеем три три одинаковый таблицы. Каждая имеет класс mytable. Вторая и третья имеют id
table_1 и table_2 соответственно. Как я могу в css обратится к первой таблице (хочу покрасить четные строки) используя только css?
Подчеркну, можно использовать только css.
|
1 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <table class='mytable' border='1px'> <thead> <th>Наименование</th> <th>Цена</th> <th>Количество</th> </thead> <tbody> <tr> <td>Хлеб</td> <td>25</td> <td>3</td> </tr> <tr> <td>Хлеб</td> <td>25</td> <td>3</td> </tr> <tr> <td>Хлеб</td> <td>25</td> <td>3</td> </tr> <tr> <td>Хлеб</td> <td>25</td> <td>3</td> </tr> </tbody> </table> <table class='mytable' id='table_1' border='1px'> <thead> <th>Наименование</th> <th>Цена</th> <th>Количество</th> </thead> <tbody> <tr> <td>Хлеб</td> <td>25</td> <td>3</td> </tr> <tr> <td>Хлеб</td> <td>25</td> <td>3</td> </tr> <tr> <td>Хлеб</td> <td>25</td> <td>3</td> </tr> <tr> <td>Хлеб</td> <td>25</td> <td>3</td> </tr> </tbody> </table> <table class='mytable' id='table_2' border='1px'> <thead> <th>Наименование</th> <th>Цена</th> <th>Количество</th> </thead> <tbody> <tr> <td>Хлеб</td> <td>25</td> <td>3</td> </tr> <tr> <td>Хлеб</td> <td>25</td> <td>3</td> </tr> <tr> <td>Хлеб</td> <td>25</td> <td>3</td> </tr> <tr> <td>Хлеб</td> <td>25</td> <td>3</td> </tr> </tbody> </table> </body> </html> |
Дополнительно:
Содержание
Вы забыли tr в блоке thead во всех таблицах
|
1 |
.mytable:not(#table_1):not(#table_2) { /* Таблица с классом .mytable, но не имеющая идентификаторов #table_1 и #table_2 */ } .mytable:not([id]) { /* Таблица с классом .mytable, но не имеющая никаких идентификаторов */ } |
Но гораздо лучшим вариантом будет дать отдельный класс нужной таблице
|
1 |
.table-striped { } |
Ответы:
|
1 |
body table:first-of-type tr:nth-child(even) td { ... } |
Для решения данной проблемы вы можете воспользоваться услугами фрилансеров. Мы выполним необходимую работу быстро и качественно.
Оставить комментарий Отменить
Ответы
- Есть ответ! к записи Как уменьшить масштаб меньше 100% в Windows 10 (22H2)
- Есть ответ! к записи Аналоги CloudFlare в России?
- Есть ответ! к записи Аналоги CloudFlare в России?
- Есть ответ! к записи Как называется человек, который дизайн придумает для сайта и сверстает его?
- Есть ответ! к записи Можно ли установить Яндекс.Диск на АльтЛинукс?
- Есть ответ! к записи Картинки мутные только на сафари, есть выход?
- Есть ответ! к записи Keenetic. Как настроить SSTP клиент с сертификатом?
- Есть ответ! к записи Чем заменить executor в aiogram 3?
Для обращения к первой таблице в разметке HTML можно использовать селектор "table:first-child". Этот селектор выберет первый элемент таблицы в структуре документа.
Пример использования селектора в CSS:
Если вы хотите обратиться к первой таблице с помощью JavaScript, можно сделать это следующим образом:
Этот код найдет первую таблицу в документе и сохранит ее в переменной firstTable, что позволит вам взаимодействовать с ней дальше.
Если вам нужно обратиться к первой таблице с помощью jQuery, то можно воспользоваться следующим кодом:
Таким образом, вы сможете получить доступ к первой таблице в разметке HTML и работать с ней по вашему усмотрению.