Question

.mainheading 
{ 
  font-weight: 700;
  font-style: normal; 
  position: relative; 
  padding-bottom: 1.33333rem;
  display: table; 
  line-height: 1.1; 
} 

.mainheading::after 
{ 
  content:''; 
  display: block; 
  position: absolute; 
  border-bottom: 2px solid #72bf44; 
  min-width: 110px; 
  width: 70%; 
  bottom: 0; 
  left: 0.2rem; 
}

我正在处理报告工具，我尝试将此css添加到标签

但线高不起作用。建议我出错的地方

Answer 1

使用您的初始代码，您基本上是在创建一个带有属性<Label>的新HTML标记Class。 CSS可以使用选择器class和id来阅读.和#。在您的情况下，您始终可以选择具有CSS attribute selector的属性：

label[Class="mainheading"] {
  /* style */
}

我建议您坚持使用class和id代替Class和ID，如下所示：

<label caption="Main Report" class="mainheading" id="lblDashboardsummary">Hello</label>

在CSS文件中只需执行

label.mainheading

Answer 2

.mainheading 
{ 
  font-weight: 700;
  font-style: normal; 
  position: relative; 
  padding-bottom: 1.33333rem;
  display: table; 
  line-height: 0; 
} 

.mainheading::after 
{ 
  content:''; 
  display: block; 
  position: absolute; 
  border-bottom: 2px solid #72bf44; 
  min-width: 110px; 
  width: 70%; 
  bottom: 0; 
  left: 0.2rem; 
}

<label caption="Main Report"    class="mainheading"
    id="lblDashboardsummary">Your Text</label>

以小写形式编写HTML属性是一种很好的编码习惯。

希望这有帮助。

如何设置此css的行高？

2 个答案: