Chartjs传奇造型

Question

我试图为我的Chartjs传奇设计风格，但由于某种原因它不允许我覆盖字体颜色。我想将字体颜色更改为白色，同时保留条形图中每个项目的颜色，然后我希望它们水平显示，而不是像这样：

的index.html

<div id="title"></div>
<div id="content">
</div>
<div>
    <canvas id="myChart" style="width: 100%; height: auto;"></canvas>
</div>
<div id="js-legend" class="chart-legend"></div>

CSS

 .chart-legend  li span{
    color: red !important;
    display: block;
    width: 12px;
    height: 12px;
    margin-right: 5px;
    list-style-type: none !important;

}

目前的情况如下：

Answer 1

您需要设置ul的样式以删除项目符号（并设置颜色），并且需要使li内联。这应该为你做这个

.chart-legend ul {
    list-style: none;
    background: black;
    color: white;
}

.chart-legend li {
    display: inline-block;
}

请注意，如果您有其他针对相同元素的CSS，则可能需要更多特异性或样式重置。

小提琴 - http://jsfiddle.net/bseccq9v/