CSS設計技術、CSS解読、会議

CSS設計技術

( Block Element Modifier )

Bem

Block:独立して存在し、再利用可能な要素

Element:ブロック内の実際の機能を担当する要素

Modifierは要素の機能または属性を表します

基本的には、OOCSなどのモジュールベースの方法に根ざしています.
ヘッダーラベルに検索ウィンドウを作成するとします.
.header search-formの形式でcssにformを飾る.
Bemの詳細については、jaiyahを参照してください.

OOCSS

これは方法論であり、レゴのように様々なモジュールを作成し、組み合わせましょう.

.btn{
            width: 200px;
            height: 80px;
            font-size: 30px;
            font-weight: bold;
        }
        .btn-close{
            background: black;
            color: white;
            border: 3px dotted white;
        } 

基本ボタンの形を作り、スキンケア水を貼ります.
また、コンテナとコンテンツを分離する必要があります.コンテナのクラスをコンテンツのスタイルセレクタから除外します.

SMACSS

ロールに基づいてcssコードを分離します.キャラクターには基礎、レイアウト、モジュール、舞台、テーマがあります.

きそ
プロジェクトの標準スタイルの定義
すべて使用するフォントシリーズ.  フォントサイズ、resetスタイル、<img>汎用スタイルなどを含む

レイアウト
モジュールがWebサイト上で大きなフレームワークを構築するルールについて、タイトル、Webサイト、ツイッター、エッジバーなどです.
IDセレクタを使用すると、ほとんどのページにいくつか存在しないため

モジュール
レイアウト内のすべての要素を表示
IDセレクタは使用されません.これは重複する要素であり、要素セレクタの使用を最小限に抑えるためです.
(サブエレメントのみ)
似たようなモジュールでは、形状が少し異なる場合は、サブクラス(btn-slow、btn-longなど)を作成します.

国
既存のスタイルを上書きまたは拡張するスタイル.
サブクラスとは異なり、レイアウトやモジュールに適用できます.サブクラスアプリケーションでは一度に変更されない属性に比べて、STATEはJavaScriptであり、必要に応じて配置、配置、配置することができます.
クラス名の前に接頭辞is(is-hidden,is-active...)を使用

テーマ
ユーザにサイト感覚を伝える画像(background-image)、色(background-color,color...)

CSS乱読

大企業には一般的に上のクラス名があります.全然読めない.スクロール防止のため、CSS乱読を行います.

スクロールとは、データの収集と分類を指し、主にインターネット上のウェブページ(html、ドキュメントなど)の収集、分類、記憶を行う.
つまり、ネット上の情報を私のパソコンに導入します.ビジネスの自動化により、多くの情報を取得できます.

class名が固定されている場合(ex-class=「menu」)は、それをキャプチャしてキャプチャします.このスクロールは、サービス負荷を引き起こします.CSS乱読はサービス負荷を防止するためと考えられる.
APIサーバは便宜上のサーバであるが、サービス負荷を低減するために別途作成されたサーバである.拡張性を考慮し、APIサーバを常に考慮すると、開発サービスは将来に役立ちます.

ミーティング

開発者にとって、会議の意味は開発者間のルールにある.
符号化ルールを守れば,他の開発者がソースコードを初めて見たときに容易に理解できる.可読性の上昇です

ソフトウェア開発全体で80%のコストがメンテナンスに使用されるため、会議は非常に重要です.
Google会議とNHN会議をすばやく読みました.企業の風格はよく表現されていて、閲覧するだけで十分です.
各会議には大きな違いがありますが、開発者がコラボレーションのためにどのようにコードするかを体験することができます.