在 Angular JS 中使用视图时，CSS 属性会被覆盖答案

【问题标题】：CSS attributes are overrided when using views in Angular JS在 Angular JS 中使用视图时，CSS 属性会被覆盖
【发布时间】：2015-09-22 15:39:27
【问题描述】：

我一直在尝试使用 views 进行示例练习。场景是 index.html 包含导航页眉和页脚。我们从导航标题中选择的任何选项都会更改导航栏和页脚之间的视图。

如果正在加载的视图也会覆盖 index.html 的 css 属性，那么我面临的问题是。这会导致导航标题失真。

<nav class="navbar navbar-fixed-top navbar-inverse" role="navigation">

它也发生在其他 div 标签上。一种方法是进入那些长的 css 代码并更改它们，但我发现我们可以使用 AngularJS 中的 DIRECTIVES 决定在视图中加载哪个 css 和 js 文件。

我在下面找到了链接，但它无法帮助我加载 index.html 页面的 css 文件（这是正在加载的第一个页面）。

链接 --> [How to include view/partial specific styling in AngularJS

谁能给点意见？

【问题讨论】：

重写 index.html 的属性是什么意思？有点不清楚是什么问题。
@Chrillewoodz：我的意思是例如 - class="abcd" 是在主页“index.html”的 CSS 文件中定义的，但是我在点击后加载的视图，可以说是“product.html”。 html" ，还有一些具有不同属性的 class="abcd" 的 css 文件。一旦 product.html 页面被加载，index.html 页面就会被扭曲。它是否澄清了我的问题？

标签： css angularjs angularjs-directive

【解决方案1】：

我不能 100% 确定您在做什么。但我认为您有一个带有 css-link 的 index.html 并且 product.html 也有一个 css-link？我认为这是不好的做法。可能发生的情况是第二个 css 覆盖了 index.html 中声明的一些 css。就像你先链接 bootstrap 和你的 style.css 一样，你可以覆盖 bootstrap 样式。

如果是这种情况，您可以将您的 product.html 内容放在一个 id 为 #product 的 div 中，然后在您的 css 中通过执行访问该特定 abcd 类 #product .abcd{your style here} 或者，如果视图中的每个 html 都有一个样式表，则为它们提供一个 class="view" 的容器，并通过 .view .abcd 引用它。只需确保您的特定 css 没有覆盖 index.html 中的样式

【讨论】：