CSS スタイルシート (または前処理された LESS や SASS など) が理解不能な混乱になるのを防ぐにはどうすればよいでしょうか。どのスタイルが各要素に影響を与えるかを予測することはもはや不可能であり、苦労して CSS ベースのデザインをさらに微調整する必要があります。無限の試行錯誤？
コンテキスト: Web サイトで作業を開始するたびに、クリーンで適切に構成された一連のスタイルシート、フレームワーク (通常は Bootstrap)、レイアウト スタイルシート、タイポグラフィ スタイルシート、一部のサイトでは配色スタイルシート、そしてスタイルが地域やサブ地域などによってグループ化されている一般的な「外観」。そして、ゆっくりと何かを追加することによって物事が「限界点」に到達するまで、それはすべて素晴らしくきれいです。スタイルルールを「頭の中で実行」することはできなくなり、セレクターが非常に複雑になり、どの要素が新しいルールであるかを簡単に予測できなくなりますに適用されるので、階層を壊して "tweaks1.css" tweaks レイヤーを追加し、次に "tweaks2.css" を追加し、すべて下り坂で、スタイリングがまったく理解できなくなりました。
...そして、LESS を使用しても SASS を使用しても同じことが起こります。CSS のカスケードの性質は、常に私を圧倒します。それで... CSSを強制的に提出させる方法はありますか? ここに「デザインパターン」はありますか？
注:私はプログラマーです。複数のパラダイムとプログラミング言語の経験があり、大規模なコードベースを扱うのに問題はありませんが、フロントエンドの作業に取りかかると、どういうわけか CSS の「カスケード ルール」ロジックが頭を悩ませます。ある時点で...私はJavascriptスパゲッティで同じ「理解不能」の問題を抱えていましたが、コードにはパターンとベストプラクティスがあり、提出にリファクタリングする方法を見つけました...