html - 只有一个 CSS 文件的 Angular 应用程序 VS 每个组件都有它的 CSS 文件

标签 html css angular

随着我的 Angular 2/4 应用越来越多,我有一百多个组件,每个组件都有自己的 CSS 文件。

您认为在 index.html 中声明一个 CSS 文件并将我的所有样式都放在那里会更好吗? 因为我可以通过引用其选择器将特定的 CSS 规则应用于组件...

最佳答案

默认情况下,CSS/SCSS/LESS-Files(取决于您使用的是什么)遵循一些约定,从源文件夹根目录中的 src/styles.css 开始。 在 src/app/app.component.css 中,您将“深入”一步。最后,您获得了每个组件的 CSS 文件。

我认为它应该是这样的: 适用于所有应用程序样式(如 html 和 body 样式定义)的全局样式应在 src/styles.css 中声明。应在 src/app/app.component.css 中声明 Angular-App 本身的更具体但全局的样式。

仅适用于单个组件的特定定义应直接在组件 css 文件中声明。

这样你就可以让你的 CSS 井井有条并遵循 DRY(不要重复你自己)规则 :)

问候

关于html - 只有一个 CSS 文件的 Angular 应用程序 VS 每个组件都有它的 CSS 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47410447/

相关文章:

jquery - 如何使绝对div根据其内容调整宽度

angular - ng build --prod 允许缺少原点(404 禁止)

javascript - ng2-smart-table 删除后不绑定(bind)

angular - ngx-图 : Build fails

css - 修复新闻标题标题/图片

php - 可滚动 40 行标题的带有 php 内容的粘性标题?

php - CSS inline-block 不起作用,但在设置 PHP 元素样式时 float 会起作用

html - 页面的中心导航和跨度宽度

html - 如何在不使用 span 的情况下将样式应用于内联元素

javascript - 如何通过 javascript 更改背景重复和背景大小