- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我试图在 Angular 组件中添加 css,但它不起作用。我正在使用 ngx-bootstrap
的 tabmodule
Tabs .
这是我的代码:
.component.html
<tabset class="tab-container">
<tab *ngFor="let tab of tabs" active="tab.active" appTabHighlight>
<ng-template tabHeading><span>{{tab.title}}</span> <i class="fas fa-times" (click)="removeTab($event, $index)"></i></ng-template>
<h1>{{tab.content}}</h1>
</tab>
<button class="btn btn-default" (click)="addTab()"></button>
</tabset>
在 dom 中创建了如下内容:
<tabset _ngcontent-c17="" class="tab-container">
<ul class="nav nav-tabs" ng-reflect-klass="nav" ng-reflect-ng-class="[object Object]">
<li class="nav-item ng-star-inserted" ng-reflect-ng-class="nav-item,">
<a class="nav-link" href="javascript:void(0);" id="">
<span ng-reflect-ng-transclude="[object Object]"></span>
<span _ngcontent-c17="" class="ng-star-inserted">Tab 1</span>
<i _ngcontent-c17="" class="fas fa-times ng-star-inserted"></i><!--bindings={}-->
</a>
</li>
</ul>
现在,当我尝试添加 css 时,似乎没有任何效果。未应用边框底部。:
.tab-container {
ul {
&.nav-tabs {
border-bottom: 4px solid red;
}
}
}
更新将封装设置为 ViewEncapsulation.None
对我有用,但它会导致我的组件出现一些其他问题。如果有人能找出这不起作用的原因,那就太好了。
最佳答案
我强烈建议使用某种形式的 SASS 或其他形式,例如 SCSS 文件。
与 .scss
而不是 .css
你可以从所有世界中获得最大的好处(全局风格和分隔/封装风格)
我会有一个 root.scss
文件导入到我所有组件的 scss 文件中,以避免 (css) 代码重复。每个组件都包含一个 <div [ngClass]="root"> </div>
因为它是根分区。
这意味着一些全局样式规则将适用,但 css 的其余部分将在 component.scss
中该组件的。
非常清晰的代码,每个文件的行数很少。
Angular CLI 有助于创建面向 scss 的元素以及将 css 元素转换为 scss:
scss
Manually change in .angular-cli.json (Angular 5.x and older) or angular.json(Angular 6+) or run:
ng config defaults.styleExt=scss
重命名您现有的 .css
文件到 .scss
(即 styles.css 和 app/app.component.css)
将 CLI 指向 styles.scss
Manually change the file extensions in
apps[0].styles
in angular.json
Change the
styleUrls
in your components to match your new file names
ng new your-project-name --style=scss
如果您想为以后创建的所有元素设置默认值,请运行以下命令:
ng config --global defaults.styleExt=scss
来源:https://stackoverflow.com/a/45255290/4770754
将 scss 作为默认设置是一个很好的案例,特别是对于新的编码人员来说,但我想这个想法是:https://www.quora.com/Why-dont-browsers-support-SASS-LESS-natively
关于CSS 更改未反射(reflect)在 Angular 5 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54752603/
一、反射 1.定义 Java的反射(reflection)机制是在运行状态中,对于任意一个类,都能够知道这个类的所有属性和方法(即使是私有的);对于任意一个对象,都能够调用它的任意方法和属性,那么,我
有没有办法从 JavaScript 对象内部获取所有方法(私有(private)、特权或公共(public))?这是示例对象: var Test = function() { // private m
我有一个抽象类“A”,类“B”和“C”扩展了 A。我想在运行时根据某些变量创建这些实例。如下所示: public abstract class A { public abstract int
假设我们在内存中有很多对象。每个都有一个不同的ID。如何迭代内存以找到与某些 id 进行比较的特定对象?为了通过 getattr 获取并使用它? 最佳答案 您应该维护这些对象的集合,因为它们是在类属性
假设我有这个结构和一个方法: package main import ( "fmt" "reflect" ) type MyStruct struct { } func (a *MyS
C#反射简介 反射(Reflection)是C#语言中一种非常有用的机制,它可以在运行时动态获取对象的类型信息并且进行相应的操作。 反射是一种在.NET Framework中广
概述 反射(Reflection)机制是指在运行时动态地获取类的信息以及操作类的成员(字段、方法、构造函数等)的能力。通过反射,我们可以在编译时期未知具体类型的情况下,通过运行时的动态
先来看一段魔法吧 public class Test { private static void changeStrValue(String str, char[] value) {
结构体struct struct 用来自定义复杂数据结构,可以包含多个字段(属性),可以嵌套; go中的struct类型理解为类,可以定义方法,和函数定义有些许区别; struct类型是值类型
反射 1. 反射的定义 Java的反射(reflection)机制是在运行状态中,对于任意一个类,都能够知道这个类的所有属性和方法;对于任意一个对象,都能够调用它的任意方法和属性,既然能拿到那么,我们
反射的定义 java的反射(reflection) 机制是在运行状态中,对于任意一个类,都能够知道这个类的所有属性和方法;对于任意一个对象,都能够调用它的任意方法和属性,既然能拿到嘛,那么,我们就可以
我有一个 Java POJO: public class Event { private String id; private String name; private Lon
我编写了以下函数来检查给定的单例类是否实现了特征。 /** Given a singleton class, returns singleton object if cls implements T.
我正在研究 Java 反射的基础知识并观察有关类方法的信息。我需要获得一个符合 getMethod() 函数描述的规范的方法。然而,当我这样做时,我得到了一个 NoSuchMethodExceptio
我正在通过以下代码检索 IEnumerable 属性列表: BindingFlags bindingFlag = BindingFlags.Instance | BindingFlags.Public
我需要检查属性是否在其伙伴类中定义了特定属性: [MetadataType(typeof(Metadata))] public sealed partial class Address { p
我正在尝试使用 Reflections(由 org.reflections 提供)来处理一些繁重的工作,因此我不需要在很长的时间内为每个类手动创建一个实例列表。但是,Reflections 并未按照我
scala 反射 API (2.10) 是否提供更简单的方法来搜索加载的类并将列表过滤到实现定义特征的特定类? IE; trait Widget { def turn(): Int } class
我想在运行时使用反射来查找具有给定注释的所有类,但是我不知道如何在 Scala 中这样做。然后我想获取注释的值并动态实例化每个映射到关联注释值的带注释类的实例。 这是我想要做的: package pr
这超出了我的头脑,有人可以更好地向我解释吗? http://mathworld.wolfram.com/Reflection.html 我正在制作一个 2d 突破格斗游戏,所以我需要球能够在它击中墙壁
我是一名优秀的程序员,十分优秀!