Định dạng nhiều dòng cùng một màu nền xen kẽ nhau trong css

hoanganh1 · October 16, 2017, 3:01pm

Mình có 1 table như trên, giờ mình muốn định dạng:

Tất cả các dòng có ngày 2017-10-16 là màu trắng.
Tất cả các dòng có ngày 2017-10-15 là màu xám.
Tất cả các dòng có ngày 2017-10-14 là màu trắng.
Như thế xen kẽ nhau cho đến hết data.

Thì phải làm sao mọi người

nguyenhuuca · October 16, 2017, 3:13pm

https://www.w3.org/Style/Examples/007/evenodd.en.html
search tí là ra mà

hoanganh1 · October 16, 2017, 3:55pm

Em cảm ơn câu trả lời của a, nhưng hình a như chưa hiểu câu hỏi của em rồi á:grinning:
Ý em là tất cả các dòng có cùng ngày thì cho nó 1 màu, chứ không phải là xen kẽ theo dòng lẻ dòng chẳn
P/S: Xen kẽ theo dòng lẻ dòng chẳn thì e đã làm được như trong hình rồi á.

Thuc_Nguyen_tan · October 16, 2017, 4:38pm

hix phải động cái não tí.

<% layout('layout1') -%>
<h4>this is table color group</h4>
<style>
    .xam{ background-color: gray;}
    .trang{ background-color: white;}
</style>
<script>
    $(document).ready(function(){
        var ar=[
            {ten:'bot',tien:100},
            {ten:'bot',tien:100},
            {ten:'gao',tien:100},
            {ten:'duong',tien:100},
            {ten:'duong',tien:100},
            {ten:'xi dau',tien:100},
        ]
        var cur='xam'
        var ten=ar[0].ten;
        var i=1;
        for(var x in ar){
            if(ar[x].ten != ten){
                ten=ar[x].ten;
                if(cur=='xam'){
                    cur='trang';
                }else{
                    cur='xam';
                }
            }
            $('#tb1').append('<tr class="'+cur+'"><td>'+ar[x].ten+'</td><td>'+ar[x].tien+'</td></tr>')
        }
    })
</script>
<table id='tb1' class="table">
</table>

bạn tự chỉnh theo trường hợp của mình nhé