部分使工具提示文本加粗

Question

我正在尝试将工具提示中的第一行文本设为粗体。下面的代码是我目前拥有的，但它不起作用。

  tooltip.html("<b>" + smartData[yearSlider][d3.select(this).attr("country")]["country"] + "</b> <br>" +
  "Total CO2 Emission excluding LULUCF" + "<br>" + 
  smartData[yearSlider][d3.select(this).attr("country")]["totalghgexlulucf"] + 
  "<br>" + "Total CO2 Emission including LULUCF" + "<br>" +
  smartData[yearSlider][d3.select(this).attr("country")]["totalghginclulucf"] +
  "<br>")

下面的屏幕截图是上面代码的结果（一些 CSS 用于设置工具提示的样式等）

Result of tooltip code

谁能帮我解决这个问题？如果您需要更多代码来帮助我解决这个问题，我非常乐意与您分享！ :)

抱歉我的英语不好，这不是我的母语。提前致谢！

Answer 1

您好，您可以通过使用带有 class 的跨度来解决这个问题，并在 css 文件中设置 class 的样式：

tooltip.html("<span class='tooltip-text-bold'>" + smartData[yearSlider][d3.select(this).attr("country")]["country"] + "</span> <br>" +
  "Total CO2 Emission excluding LULUCF" + "<br>" + 
  smartData[yearSlider][d3.select(this).attr("country")]["totalghgexlulucf"] + 
  "<br>" + "Total CO2 Emission including LULUCF" + "<br>" +
  smartData[yearSlider][d3.select(this).attr("country")]["totalghginclulucf"] +
  "<br>")

然后您在 css 中使用以下样式：

.tooltip-text-bold{
    font-weight: 700;
}

部分使工具提示文本加粗

Partially making tooltip text bold

javascript

tooltip

d3.js