Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

ECSS ざっくりまとめてみた

More than 3 years have passed since last update.

はじめに

ECSSをざっくりとまとめました。詳しく知りたい方はこちら

ECSSとは

「Enduring CSS」の略称。
大規模なWebアプリケーションのCSSを合理的に書くためのCSS設計の一種。

命名規則

前後の文脈から名前を決める。
.context-btn ○
.btn-hoge ×

メリット

HTMLだけで構成できる。
変更点の数に対して変更箇所が多大な量にならない。(デザインの再利用をしていないため)

デメリット

名前空間が多い時、大量にcssを書かないといけない。
共通部分の多いサイトを作成するには向いていない。(デザインの再利用ができない)

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away