問題タブ [bem]

質問する

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

411 問題
Newest
Active
Bountied
318
Unanswered
0 投票する
1 に答える
78 参照

ruby-on-rails - ビュー内でメソッドを頻繁に使用するとキャッシングが妨げられますか?

Rails 4 アプリにBEMヘルパーを実装して、ビューをより快適に記述できるように実験しています。

次のHamlビューがあるとします。

とメソッドを持つblock架空のクラス(インスタンスが として渡される) が定義されていると仮定し、がであると仮定すると、次の HTML 出力が得られるはずです。BEMBlockBuilder#elementbcurrent_user.unregistered?true

この手法により、ブロック、要素を設定し、ブロックの名前を毎回繰り返すことなくそれらに修飾子を適用できるようになり、それらにバインドされた値が真実であることに基づいて修飾子を適用できるようになります。

テクニック自体は、ブロックにform_forのインスタンスを渡すという点で、ヘルパーを使用するときに起こることと多少似ています。FormBuilder

この手法とヘルパーの主な違いはform_for、多数のネストされたブロックを使用してビューをレンダリングすることになり、その出力が不明になる可能性があることです。

この手法は、Rails (または HAML) のキャッシング機能に悪影響を及ぼしますか?それとも、一般的にレンダリング パフォーマンスに悪影響を及ぼしますか?

0 投票する
1 に答える
670 参照

css - 一般的なスタイルの BEM CSS

グローバル スタイルの使用に関しては、少し混乱しています。次の点を考慮してください。

ボタンの作成方法を定義するスタイルシートがあるとします。

次に、テンプレートのボタンを標準の BEM 表記で使用します (Block__Element--Modifier 表記を使用します)。

そのようなクラスを混在させることは、許容される慣行ですか? カプセル化されたブロックのスタイリングのルールに違反しているように感じます。

0 投票する
3 に答える
1697 参照

html - ターゲットの最初のレベル
  • BEM で LESS ネストされたルールを使用する
    •

    私は次のHTMLを持っています:

    私はこのcssを持っていますが、以下のようなことをすることは可能ですか:

    BEM を使用して LESS で次のように記述します。

    <li>CSS ルールを最初のレベルに適用するにはどうすればよいですか? 試してみ> &__itemましたが、うまくいかないようです。

    更新：自分で修正しました。&の前で見逃した> &__item

    0 投票する
    1 に答える
    2254 参照

    html - css transform() ポップアップ ウィンドウの問題の中央配置

    アプリケーションで中央揃えのポップアップ ウィンドウ ( http://www.w3.org/Style/Examples/007/center )を作成する興味深い方法を見つけました。シンプルで見栄えの良いコード ( http://jsfiddle.net/babaca/6rwL0v0c/22/ )。

    html

    CSS

    レンダリングに関する唯一の問題: ブラウザー ウィンドウのズーム レベルに応じて、水平または垂直の側面がシャープではないか、2 ピクセル間で滑らかに/ぼやけています... (chrome バージョン 39.0.2171.95 m 、firefox 34.0.5 ) ここにあります例（ウィンドウの左右を滑らかにしたもの）：

    ここに画像の説明を入力

    私が理解したように、それはtransform: translate(-50%, -50%)ラインの責任です。誰でも同じ問題に遭遇しましたか？解決策はありますか？

    0 投票する
    1 に答える
    190 参照

    less - ファイルレベルの少ない変数

    ファイルの先頭に一括でブロック名を定義したい

    そして、それをセレクターで使用します

    しかし、ブロックが複数あるとそれができません。変数@blockは最後の値を取り、セレクターを壊します

    .widget-bファイルが異なるにもかかわらず、両方のルールセットがブロックされました。各ブロックの名前を保持する方法はありますか?

    ここに要点があります: https://gist.github.com/just-boris/a86f3646f48683a9bf17ビルドして再現することができます。私が使うless 2.3.0

    0 投票する
    1 に答える
    1756 参照

    sass - SASS 実装での BEM 要素修飾子のオーバーライド

    これはしばらくの間私を困惑させてきました。

    Sass (SCSS) を使用し、 lib-sass に対して BEM のような命名規則を実装します。

    たとえば、次のようになります。

    そしてdescription--special、次のことをしたい場合があります：

    当然のことながら、使用目的は次のとおりであるため、特異性の問題が発生します。

    誰かがこれを行うのに十分エレガントな方法を提案できますか?

    現在の「最良の」提案は、これを行うことです：

    もちろん、少なくともlib-sassでは、これは機能しません。

    これもしません:

    0 投票する
    1 に答える
    712 参照

    sass - 親特異性のsass親

    私は BEM スタイルで CSS を書き、このコードを持っています:

    上記のコードから取得する.nav .nav__link--activeにはどうすればよいですか? .nav__link.nav__link--activeこの方法でどのように特異性を高めることができますか?


    12345678910