我在試著選課。注冊-選擇-副標題和。注冊-選擇-列表li在我的父類注冊-選擇-卡-內容中應用字體系列。

這是我的css代碼

.ja_jp 
.signup-container 
.signup-content 
.signup-choose-card-content 
.signup-choose-subtitle 
.signup-choose-list li 
{   
    font-family: "M+1C", Roboto, sans-serif; 
}

和html中的代碼

<div class="signup-choose-card-content">
   <p class="signup-choose-subtitle" translate="">Easy registration in 15 seconds! Play now!</p>
   <p class="signup-choose-text-highlight">Lite</p>

   <ul class="signup-choose-list">
       <li translate="">No identity verification required</li>
       <li translate="">Over 2,000 games</li>
   </ul>
</div>

我的目標是覆蓋現有的字體系列:Bahnschrift & quot，Roboto，無襯線；到font-family:& quot；m+1C & quot；，Roboto，無襯線；比如這張圖片:

選項1

對象中嵌套的特定元素。注冊-選擇-卡-內容元素。

.signup-choose-card-content .signup-choose-subtitle,
.signup-choose-card-content .signup-choose-list li {
  font-family: "M+1C", Roboto, sans-serif;
}

請看下面的片段。

.signup-choose-card-content .signup-choose-subtitle,
.signup-choose-card-content .signup-choose-list li {
  font-family: "M+1C", Roboto, sans-serif;
  color: red;
}

<div class="signup-choose-card-content">
  <p class="signup-choose-subtitle" translate="">Easy registration in 15 seconds! Play now!</p>
  <p class="signup-choose-text-highlight">Lite</p>

  <ul class="signup-choose-list">
    <li translate="">No identity verification required</li>
    <li translate="">Over 2,000 games</li>
  </ul>
</div>

根據您的描述，您可能希望它是這樣的(我添加了border-property以便在開發過程中更好地查看):

.signup-choose-card-content > .signup-choose-list li,
.signup-choose-card-content > .signup-choose-subtitle {
        border: 4px solid red ;

}

使用子組合器，你可以選擇類/元素等的直接子元素，請看這里:https://developer . Mozilla . org/en-US/docs/Web/CSS/Child _ combinator

子組合子(& gt)放在兩個CSS選擇器之間。