Полосатость таблиц и списков на определенной таблице - Joomla 3.x: Общие вопросы

Здравствуйте уважаемые форумчане и Гуру 

Снова вынужден обратиться с вопросом к вам, сам не могу дойти до нужного результата.

Имеется каталог с запчастями:

https://tb-2.club/index.php/info-auto/catalog-repair

Хочу именно этой таблице дать полосатость, т.е. строчка белая, строчкая серая, так гораздо приятнее просматривать имхо.

Перечитал кучу статей здесь и на просторах интернета, но видимо надо ткнуть носом куда нужно добавить стиль.

Нашел такую статью:
http://jdevelop.info/articles/html-css-js/330-polosatost-tablits-i-spiskov
В ней говорится следующие:

Третий способ это использовать js код.

Для таблиц с классом table для нечетных строк задается класс odd:

jQuery(function(){
  $(".table tr:nth-child(odd)").addClass('odd'); //нечётные строки таблицы
});
Для списков, размещенных в контейнере content-block:

jQuery(function(){
  $(".content-block li:nth-child(odd)").addClass('odd'); //нечетные эл-ты списка
});
Для варианта на JQuery добавляем такой CSS код:

.table td {background:#fff; border-top:1px solid #dddddd;}
.table .odd {background:#f9f9f9;}
 
.content-block ul li {background:#fff; border-top:1px solid #dddddd; padding:4px 4px;}
.content-block ul li.odd {background:#f9f9f9;}

Куда все это делать вставлять и главное что бы отображалось все только на одной таблице?

Огромное спасибо заранее 

Да не надо так заморачиться!
Псевдокласс :nth-child

Да не надо так заморачиться!

Код: css

table tbody > tr:nth-child(odd) > td {background-color: beige;}

Псевдокласс :nth-child

Cпасибо за новодку, а можно для одаренных куда это все вставлять? В редакторе?

Cпасибо за новодку, а можно для одаренных куда это все вставлять? В редакторе?

Ну допустим добавь в файл /templates/lt_techshop/css/template.css в самый низ

Ну допустим добавь в файл /templates/lt_techshop/css/template.css в самый низ

 

Правильно ли я понимаю, мне менять по Вашему примеру ничего не надо, просто добавляю текст в конце :
" table tbody > tr:nth-child(odd) > td {background-color: beige;} "



Такой то же вариант по учебнику пробовал, эффекта нет.
<style>
 td:nth-child (odd) {
background-color: #C9E4F6;/* фон нечетных столбцов */
}

  td:nth-child (even) {

    background-color: #B4DAF2;/* фон четных столбцов */

  }

  tr:hover td{

    background: #B4FFF2;/* фон строки при наведении */

  }

</style>

Псевдокласс :nth-child применяется к <tr>.
background-color к <td>

Псевдокласс :nth-child применяется к <tr>.
background-color к <td>

Често говоря ничего так и не вышло, может быть еще какие то варианты будут?

Често говоря ничего так и не вышло, может быть еще какие то варианты будут?

А же написал готовое решение!

Спасибо Вам добрый человек, видимо я что то делаю не так, иду учить мат часть, добавляю как Вы и писали ранее в /templates/lt_techshop/css/template.css[/size]  в самый нижнюю часть код, а результата нет.

Спасибо Вам добрый человек, видимо я что то делаю не так, иду учить мат часть, добавляю как Вы и писали ранее в /templates/lt_techshop/css/template.css[/size]  в самый нижнюю часть код, а результата нет.

Ни когда еще такого чуда не видел....
Js код в файле стилей? Это как надо додуматься до этого...

Ни когда еще такого чуда не видел....
Js код в файле стилей? Это как надо додуматься до этого...

!

От уровня знаний можно много чего натворить , поэтому прошу помощи, а не критики...

table tr:nth-child(odd) td{
  background:#dddddd;color:#1f1f1f;
}
table tr:nth-child(even) td{
  background:#fff;color:#1f1f1f;
}

Вот этот код вставляем как и писал @NewUsers в конце /templates/lt_techshop/css/template.css и получаем желанный результат.

Спасибо за помощь 

Рано я обрадовался  а как определенной странице дать этот стиль? А то все таблицы на сайте покрасились

Вы таблице добавьте класс
Например
<table class="stripes">

И уже в файле стилей, который подключаются к Вашему шаблону прописывайте стиль для таблицы


Это прописывать лучше в файле .css, а не прям в HTML

3-я Joomla, вроде как, поддерживает Bootstrap 2.
достаточно просто таблице добавить класс

Вы таблице добавьте класс
Например
<table class="stripes">

И уже в файле стилей, который подключаются к Вашему шаблону прописывайте стиль для таблицы

Код

table.stripes   tr:nth-child(odd) td {
  background:#dddddd;
  color:#1f1f1f;
}

table.stripes tr:nth-child(even) td{
  background:#fff;color:#1f1f1f;
}

Это прописывать лучше в файле .css, а не прям в HTML

Вот спасибо огромное, научился классами пользоваться