私はCSSを専門とするWeb開発者ではありません。私たちは最近Angularを使い始めました。私はAngularテンプレートにスタイルを適用するのがベストプラクティスであると思っています。 私たちが行っている議論は、外部CSSファイルを使うのか、内部のスタイルタグを使うのかということです。あまりにも多くのテンプレートがなく、それぞれのテンプレートは主に独自のスタイルを持っています。外部のCSSファイルや内部スタイルの間で議論しています。 誰かがこのテーマについて専門家の意見を述べています。角度1.xテンプレート - CSSスタイルを使用するためのベストプラクティス
答えて
内部スタイルは、それらを含むページにのみ適用されます。そのため、複数のページで共通のスタイル設定(メニューなど)を更新する場合は、各ページを個別に更新する必要があります。
特定のスタイルを複数のページに共通する要素に適用する場合は、間違いなくに外部スタイルシートを選択します。これにより、ページAとBの両方が単一のstyle.css
または類似のファイルからスタイルを継承することができます。
<link href="style.css" rel="stylesheet">
をそして、あなたは複数のページのスタイリングを更新したいときにだけstyle.css
を更新する必要があります。
このように、あなたは、各ページの<head>
における単一のコード行に関連するすべてのスタイルを読み込むことができます。
まあ、私はこれらのスタイルのほとんどが彼らのテンプレートにユニークになると言いました。しかし、確かに、一般的なものは、グローバルなCSSファイルに入るだろう。私たちの議論は、私たちが内部的なCSSをまったく使用するべきかどうかということについてのものでした。私は個人的には、1つのテンプレートでのみ使用されるスタイルがグローバルCSSに入るはずであると確信していません。 – ASon
1つのCSSファイルだけを使用することをお勧めします。このような場合は、単一の隔離されたフォルダにビュー、コントローラ、および関連するスタイルを保存することをお勧めします。コンパイラを使用してさまざまなCSSファイルをコンパイルして、1つのグローバルCSSファイルに戻します。このようにして、CSSファイルはコード構造内で簡単に分離されます。 –
Angularは、スコープされたCSSをv1.5からアップしています(コンポーネントが導入されたとき - 私は信じています)。良いコンセプトですが、中小アプリでは違いが目立ちません。スコープ付きCSSを使用する方法を知っているツール(Webpackなど)との組み合わせでのみ、スコープ付きCSSの使用を検討する必要があります。
ウェブパックを使用していない場合は、クラシックモデル(1つの大きなスタイルシート)に固執してください。
技術的には、関係なく、スタックの注意、あなたは(FOUCせずに最速のロード時間)可能な限り最高の体験を提供したい場合は、インラインで上記のすべての-倍と一般的なレイアウト-INGのスタイルを置きたいです、好ましくはヘッド<style>
タグと、非同期にロードされたスタイルシート内のすべてのものである。
this articleを読み込み、CSS非同期を読み込んでください。
- 1. 同様のスタイルを適用するためのCSSのベストプラクティス
- 2. 角度1.xジャスミンでテスト:テンプレートでのデータ出力を検証するためにテンプレートをコンパイルする
- 3. 2角度:コンポーネントセレクタにCSSスタイルを適用
- 4. 角度1.xの再帰的または複雑なテンプレート化
- 5. 角度テンプレートとコンテナのスタイル再帰的CSS
- 6. 既存の角度1のテンプレートを角度2で使用できますか?
- 7. チェックされたラジオボタンを角度をつけてスタイルするために使用するCSSプロパティーは?
- 8. 角度1.x:特定のシナリオコントローラ/サービスを使用する場合
- 9. ag-grid:角度1.xディレクティブのfullWidth行を使用する
- 10. ジャスミンでasync/awaitを使用した角度1.xユニットテスト
- 11. 角度1.xで$ templateCacheをui-routerとuglifyで使用する
- 12. 春のバックエンドで角度2を展開するためのベストプラクティス
- 13. ベストプラクティス/角度4 cli Webアプリケーションにフォントをインポートするスタイル
- 14. 角度2で配列をフィルタリングするためのベストプラクティス
- 15. 角度2の使用を計画していますが、既存のアプリは角度1.xを使用しています。角度1.xと一緒に角度2を使用することに関する文書はありますか?
- 16. 角度1.xおよびイオン性1.xで/角度2ベータ10
- 17. 角度1.X保存する定数
- 18. 角度1 jsとmaterialize css
- 19. プリズムフレームワークを使用するSilverlightアプリケーションでスタイルを共有するためのベストプラクティス
- 20. Struts2、メソッド= {1}を使用するためのベストプラクティス
- 21. 角度1と角度2を同時に使用する
- 22. 別のスタイルのテンプレートを制御するために1つのスタイルを適用する方法は?
- 23. 角度1.XのNG-オプション等価
- 24. AFNetworkingを使用するためのベストプラクティス
- 25. テーマとスタイルを使用するベストプラクティス
- 26. テンプレート用の角度ルート
- 27. angularjsを持つ角度材料1.x
- 28. 単体テストで角度1.xサービスインジェクション
- 29. @SessionAttributesを使用するためのベストプラクティス
- 30. 別ファイルの角度1.xサービス
ファイルを使用します。それらをたくさん持ち、ビルドプロセスを使用してそれらを1つのファイルに統合して縮小することができます。 – charlietfl