如何覆盖Highchart的CSS-Java 学习之路

我对有关Highchart的问题有点垃圾邮件，但看起来我的问题是一个破解者 .

我在导航器中有这个结构：
enter image description here

我们可以看到 highcharts-container 的高度为400px，宽度为268px，对于 highcharts-root 也是如此，但在我的CSS中我更改了这些值以减少我的图表的一般大小并显示它们，就像我想要的那样：

.highcharts-container {
  width: 100%;
  height: 20% !important;
}
.highcharts-root {
  width: 100%;
  height: 20% !important;
}
.highcharts-background {
  width: 100%;
  height: 20% !important;
}
.divChart {
  width: 100%;
  height: 20% !important;
}

但为什么它不影响图表？！？！

[编辑]我不明白为什么高度仍然400px看起来：
enter image description here

2 回答

1
你应该做出更“清晰”的选择器 . 基本上使用规则，女巫拥有最准确的选择器 . 所以试试这个：
```
.x_panel .x_content .row .highcharts-container {
  width: 100%;
  height: 20% !important;
}
```
这应该够了吧 . 如果没有，请尝试使其更具体 .

编辑：示例 .

结构
```
<div id="mainCont">
  <div class="subCont">
    <div class="content"> COLOR ME </div>
  </div>
</div>
```
用css：
```
.content{
color: red;
}
```
将.content变为红色，但是当我们将其添加到css时：
```
#mainCont .content{
color:blue;
}
```
将覆盖第一个，因为它有更具体的选择器 .

EDIT2：以下是您可以阅读的内容：https://developer.mozilla.org/en/docs/Web/CSS/Specificity
回复于 2024-05-15T14:47:26+08:00

我需要在创建图表时定义宽度高度，如下所示：

nameChart = Highcharts.chart(currentContainer.idChartMem, {
          chart: {
            width: '100%',
            height: '7%'
          },

回复于 2024-05-15T14:47:26+08:00

如何覆盖Highchart的CSS

2 回答

相关问题