このCSSの行の高さを設定するには？

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

初期コードでは、基本的に新しいHTMLタグ<Label>を属性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>

0123を行います

小文字でHTML属性を記述するのは良いコーディングプラクティスです。

これが役立ちます。