我在将各种样式应用于：Angular 2中的主机时遇到了困难.下面简单的plunker演示了这个问题.起初我认为某些样式(如margin / padding)没有得到应用,但似乎问题是host元素的行为不像普通元素.请注意,我添加了边框和填充.边框看起来很奇怪,填充根本不会移动元素内部的内容(虽然它确实会影响边框的外观.这是我正在应用的样式：

:host {padding:10px; border:1px solid red;}

渲染的代码如下所示：

<sample-component _nghost-cxm-2="">
  <div _ngcontent-cxm-2="">
    <h3 _ngcontent-cxm-2="">Sample Component</h3>
  </div>
</sample-component>

我可以在开发工具中看到样式正在应用于< sample-component>元素,但这是页面呈现的样子：

我希望边框将内容包装在组件内部,但它表现得很奇怪.这是一个样本plunker：https://plnkr.co/edit/k7LJcmVlhJINmakBJAau?p=preview

我错过了什么？