LoginSignup
0
0

[CSS]同一要素に複数クラスが適用されるのか、親要素から子要素にクラス階層が出来ているのか[セレクター]

Posted at

同一の要素に複数クラスがある場合

<!-- HTML -->
<button class="container__btn btn--filled">ボタン</button>

/* CSS */
.container__btn.btn--filled:hover {
  color: white;
  background-color: black;
}

CSSはcontainer__btnbtn--filledの2つのクラスが適用されている、
かつホバー状態のときに適用される

親要素に対して子要素に特定のクラスがある場合

<!-- HTML -->
<div class="container__btn">
  <button class="btn--filled">ボタン</button>
</div>

/* CSS */
.container__btn .btn--filled:hover {
  color: white;
  background-color: black;
}

CSSは親要素にcontainer__btnのクラスがあるかつ、
対象の要素にbtn--filledクラスがあるかつ、
ホバー状態のときに適用される

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0