問題タブ [css-in-js]
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.
javascript - JavaScript からの CSS 擬似クラス ルールの設定
JavaScript から擬似クラス セレクター (:link、:hover など) の CSS ルールを変更する方法を探しています。
したがって、CSS コードの類似物: a:hover { color: red }
JS で。
他のどこにも答えはありませんでした。これがブラウザでサポートされていないことを誰かが知っていれば、それも有益な結果になります。
stylelint - 同じファイル内の異なるセレクターの no-duplicate-selectors エラー
CSS-IN-JS プロジェクト内で stylelint を使用しています (ここでは astroturf を使用していますが、styled-components などの CSS-IN-JS ライブラリを使用しても同じパターンに直面しています)。
同じファイル内で異なるスタイルの要素を定義しているため、セレクタやインポート ルールが重複することがあります。
私はこのように構成します:
これらの stylelint ルールをファイル全体ではなくブロックに設定する方法はありますか?
javascript - CSS-in-JS はブラウザの CSS キャッシュを妨げませんか?
サーバーサイド レンダリングを使用して React アプリのスタイルを設定するためのベスト プラクティスを探しています。
SASS などのプリプロセッサを使用したり、JSS や styled-components などの JS コード内にスタイリングを配置したりするなど、さまざまなオプションがあります。
JSS をいじってみると、スタイルが HTML 内の head セクションに配置されていることがわかります。次の例を使用して、動作を確認します。
https://github.com/cssinjs/examples/tree/gh-pages/react-ssr
ブラウザが CSS をキャッシュして head セクション内に配置するのを防ぎ、連続するページの読み込み時間を増加させませんか? ブラウザーがキャッシュできるように、JSS を使用して外部ファイルにスタイルを設定する方法はありますか?