基于div的颜色HTML表格

我有一个Django模板，我传递了一堆HTML表格。我想将某些表格的背景颜色更改为红色，并允许其余的使用我设置的默认CSS。该表是从字典中我的Django视图传入，称为html，结构是这样的：基于div的颜色HTML表格

{'PanelLabel1': {'Scheduled':[list of html tables], 
       'Unscheduled':[list of html tables]}, 
'PanelLabel2': {'Scheduled':[list of html tables], 
       'Unscheduled':[list of html tables]} 
}

我试着在模板中添加一个div ID为不定期表，然后改变基础上，DIV ID的颜色，但无法正确设置div ID。

我的模板看起来是这样的：

{% for label,tables in html.items %} 
    <div class="container"> 
     <div class="panel panel-default"> 
     <div class="panel-heading"> 
      <h4 class="text-center">{{ label | safe }}</h4> 
     </div> 
     {% for types,table in tables.items %} 
      <div class="panel-body"> 
      <div class="panel-title text-center"><u>{{types | safe}}</u> 
       {% for t in table %} 
       {% if types == "Unscheduled" %} 
        <div><p>Here</p></div> 
        <div class="table-responsive Unscheduled" id="Unscheduled"> 
        {{ t | safe }} 
        </div> 
       {% else %} 
        <div class="table-responsive"> 
        {{ t | safe }} 
        </div> 
       {% endif %} 
       {% endfor %} 
      </div> 
      </div> 
     {% endfor %} 
     </div> 
    </div> 
    {% endfor %} 

<script> 
$(document).ready(function(){ 
    var rows = document.getElementById("Unscheduled").getElementsByTagName("tr"); 
    var cells = document.getElementById("Unscheduled").getElementsByTagName("td"); 
    for (i = 0; i < rows.length; i++){ 
    rows[i].style.backgroundColor = "#CC3300"; 
    }; 
}); 
</script>

编辑我也尝试添加了Unscheduled类到div，然后使用CSS这样的造型吧：

.Unscheduled { 
    background: #CC3300; 
}

当我看在开发者控制台，我可以看到没有一个表格div有一个ID（当我尝试使用该类时，他们都没有Unscheduled类），所以我的javascript设置表颜色失败，CSS没有任何风格。我不确定我在设置div ID/class时做了什么错误。总是看起来像这样，无论我做什么：

来源

2016-01-18 kdubs

一个更简单，更好的颜色表的方法将与CSS。您可以使用'class'属性来代替'id'属性。 – Asaph

如果要为单元定义某种样式，则应该使用CSS类而不是ID。此外，每个页面的ID属性也应该是唯一的。 – TlonXP

@Asaph看到我对我的问题所做的修改。我尝试给div一个特殊的类，但是这并没有出现在渲染模板中。 – kdubs

也许这是因为你在许多情况下（视图，ID的）使用相同的ID“未调度”，它提出了冲突。尝试给css类添加一个不同的名称（如“tablestyle”或其他），并且从div标签中删除id标签，只留下class参数。告诉我它是怎么回事。

来源

2016-01-18 19:20:36 jsanchezs

给每个表你想要一个特定的颜色一个id。 EXAPMLE：<table id="yourchoice"></table>然后像这样使用CSS #yourchoice { background-color: red; }您可以选择任何我喜欢红色的颜色。

来源

2016-01-18 19:24:35

基于div的颜色HTML表格

回答

相关问题