01/10/2018, 12:04

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

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

Nguyen Ca viết 14:20 ngày 01/10/2018

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

Hoàng Anh viết 14:20 ngày 01/10/2018

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 viết 14:05 ngày 01/10/2018

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é

Bài liên quan
0