HTML&CSSベース-コレクタを使用してCSSコード量を削減

<ul class="navbar">
  <li></li>
  <li></li>
  <li></li>
  <li></li>
</ul>

上記のコードがあると仮定します.
もし私が<li>ラベルごとに同じスタイルをあげたいならどうすればいいですか?

 <ul class="navbar">
  <li class = "nevbarstyle" ></li>
  <li class = "nevbarstyle" ></li>
  <li class = "nevbarstyle" ></li>
  <li class = "nevbarstyle" ></li>
</ul>

#css
.navbarstyle { 
 ....
 }

上記のコードを記述する場合は、次の手順に従います.
CSSにnevastyleという別のクラスを作成する必要があります.
果たして理想のハーモニーなのか.
次はどうですか.

<ul class="navbar">
  <li></li>
  <li></li>
  <li></li>
  <li></li>
</ul>

#css
.navbar li {
  display : inline-block;
}

ずっときれいなコードになりました.
前述のように、サブラベルに同じスタイルを複数付与する場合、
方法は.
対応するラベルに>または띄어쓰기を加え、.navbar liまたは.navbar>liに類似するコードを書くことができる.
(注)コレクターがうまく書けば、クラスの追加を宣言することなく、スタイルを目的の要素に簡単に追加できます.しかし、このように4~5個以上連続して書くことはお勧めしません.