我在Angular 2中有一个称为My-Comp的组件:

<my-comp></my-comp>

如何在Angular 2中将此构件的主体图元设置为样式?

在polymer 中,可以使用":Host" Select 器.我试了一下2号角,但是不行.

:host {
  display: block;
  width: 100%;
  height: 100%;
}

我还try 使用组件作为 Select 器:

my-comp {
  display: block;
  width: 100%;
  height: 100%;
}

这两种方法似乎都不管用.

谢谢

推荐答案

有一个漏洞,但在此期间它被修复了.现在:host { }元可以用了.

同样受支持的还有

  • selector:host(selector) { ... }以匹配属性、类、.在主体图元上
  • :host-context(selector) { ... }表示selector与父组件上的元素、类等匹配

  • 100 (alias 101 doesn't work with SASS) for styles to match across element boundaries

另见Load external css style into Angular 2 Component

/deep/>>>由与Chrome中已弃用的相同 Select 器组合符组成的not affected.
ANGLE模拟(重写)它们,因此不依赖于支持它们的浏览器.

这也是为什么/deep/>>>不能与ViewEncapsulation.Native一起使用的原因,后者支持本机阴影DOM,并且依赖于浏览器支持.

Css相关问答推荐

在css网格中用一个锚标签(顶部/底部边距)包装图像?

导航栏没有使用nextui获取页面的全部宽度

Firefox中的解决方法:has(不使用JavaScript)

这个 CSS :is() Select 器没有像我想象的那样工作

Firefox未正确设置SVG的父div的宽度

如何在保持默认外观的同时更改 javaFX 中按钮的突出显示 colored颜色

antd 中的子菜单项不可滚动

如何使用 TailwindCSS 水平设置输入和按钮

n 个元素的 CSS 关键帧动画

如何在特定元素之前 Select 每个元素

在移动设备上touch 屏幕边缘的元素(Material UI)

css3比例周围的空白

如何通过单击
  • 激活 HTML 链接?
  • 继承了哪些 CSS 属性?

    以原始大小的 50% 显示图像

    如何计算所需的色调旋转以生成特定 colored颜色 ?

    使用 CSS go 除图像之间的空间

    CSS中伪元素前的&是什么意思?

    Firefox 中未显示边框,表格边框折叠,位置:tbody 上的相对或单元格上的背景 colored颜色

    子边距不影响父高度