CSSは綺麗に書きたいですよね。 BEM、SMACCSS、CSS設計、詳細度。色々覚えたけどどうもCSSが汚くてなんとなく見にくいと思ってる人もいるかもしれません。 なので、今回は見やすいCSSを書くために僕が決めている基本ルールを書きます。 どんどんアップデートしていく予定です。 色々自分の中で決めているマイルールのようなものはたくさんあるのですが、まだ全て洗い出せていないのでひとまず公開。まとめて書くと一生公開できなさそうなので…。 随時更新していく予定です。 HTML/CSSのコーディング規約も書いていきたいです。(別の記事かもしれませんが・・) それではこれより下からスタートです。 プロパティはアルファベット順に書く プロパティは、下のようにアルファベットの順をバラバラに書くのではなく、
![【初心者向け】CSSを綺麗に書くために決めている基本ルール - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/62b1543836e0122fc9fda383ae5588d653657776/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9JUUzJTgwJTkwJUU1JTg4JTlEJUU1JUJGJTgzJUU4JTgwJTg1JUU1JTkwJTkxJUUzJTgxJTkxJUUzJTgwJTkxQ1NTJUUzJTgyJTkyJUU3JUI2JUJBJUU5JUJBJTk3JUUzJTgxJUFCJUU2JTlCJUI4JUUzJTgxJThGJUUzJTgxJTlGJUUzJTgyJTgxJUUzJTgxJUFCJUU2JUIxJUJBJUUzJTgyJTgxJUUzJTgxJUE2JUUzJTgxJTg0JUUzJTgyJThCJUU1JTlGJUJBJUU2JTlDJUFDJUUzJTgzJUFCJUUzJTgzJUJDJUUzJTgzJUFCJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LWNsaXA9ZWxsaXBzaXMmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz05ZTlkYmY5NjE0NzNhMmM2Y2RmZDk3NjUyODY2MjY3Mw%26mark-x%3D142%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwc295YW5jaHUmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTJmOTlhZDA1ZTdmOTUyM2QyZDU0ZTc2YTg1ZmFjYWI0%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3D8a3f34e1ff5b396294a9bade2791b118)