より良いCSSを書くための様々なCSS設計まとめ
CSSは誰でも簡単に自由に書けるのですが、好きなように書いていると「ここを変更したら、違うところが崩れた」といったようにすぐに破綻してしまいます。 さらに、複数人で書いている場合は、各々が好きなように書いて読むだけでも苦痛なCSSが出来上がってしまいます。 そこで、これらの問題を解決するために考えられたのが「CSS設計」です。 今回は記事が長くなり過ぎるので、CSS設計の概要のみを説明し、参考となる公式ドキュメントへのリンクを記載しました。 CSS設計とは CSS設計は、CSSを記述する時のルールとなるものです。プロジェクト毎に適したCSS設計を採用することで、「良いCSS」にすることができます。 最近では、命名規則はBEMで、構成はSMACCSのように各CSS設計の概念を取り込んだオリジナルの規約をつくるといったことも多いようです。 「良いCSS」とは 「良いCSS」の定義として、おそら
【保存版】破綻しにくいCSS設計で必要な5つのルール
プログラミングにおいて、破綻しないコードを組むのは大切ですが簡単なことではありません。 これで完璧と思ったコードが、ふたを開けてみるとボロボロになっているのは誰もが通る道です。 ですが、仕事の現場でミスは少しでも避けたいですよね。 そこで、今回は破綻しにくいCSSを組むためにはどういう工夫をしたらいいのか、5つのポイントを挙げて解説していきます。 これで、あなたのスキルが何倍にもレベルアップ！ 機種変更では、このような失敗をする方がとても多いです。 有料オプションを契約させられ料金が高くなった。。 待ち時間や契約時間が長くて、半日かかってしまった。。 キャンペーンや割引がきちんと適用されていなかった。。 スマホを乗り換えるときには、 → おとくケータイで乗り換えキャッシュバックをもらう で乗り換えをするとキャッシュバックがもらえます。 スマホの機種変更するときは、 →ソフトバンクはこちら
CSSの設計 | 第1回 枠とモジュールで考える
CSSの設計 第1回 枠とモジュールで考える このシリーズでは、なるべくメンテナンスしやすい、可読性の高いCSSを設計する考え方を解説します。第1回目は、現状のCSSの問題点と、枠とモジュールで設計する考え方を紹介します。（監修：フロントエンド・エンジニア高津戸 壮） はじめに 初出 この文章は『CSS Nite LP, Disk 26「CSS Preprocessor Shootout」』で高津戸が行った講演「CSSの設計」を元に、テキストとして再構成しています。 CSSはとてもシンプル 今「CSSの設計」を改めて考えるのは、なぜでしょうか。CSSの基本はとてもシンプルです。例えば、次のようにHTMLにクラスを付け、そのクラスに対してのスタイル指定をCSSで行うだけです。 <div class="box"> hoge </div> .box { color: red; } HTMLの要素
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
