角度应用程序css样式中的ui-element-id

Question

我对ui-element-id的样式有疑问。 普通的html / css id /＃和有什么用CSS设置ui-element-id样式的区别（如果可能的话）？

我的示例：HTML /

此警报很危险

CSS（Sass）/ / deep / #danger警告背景：绿色：绿色span.text-danger颜色：蓝色

但是/ deep /选择器不起作用。

谢谢！

Answer 1

您可以在CSS的element ， class或id选择器之间设置元素样式。

---

这些是什么？

元素是对HTML元素类型的引用，例如div 。

在HTML中 ，您可以通过将元素类型包装在<div></div>中来创建元素 ，其中div是元素类型。

<div></div>

在CSS中，你可以风格的元素选择一个元素 ：

div {

}

---

类是元素的组名，例如container 。

在HTML中 ，您可以使用class属性将一个类应用于元素：

<div class="container">

在CSS中，您可以通过在类名前放置一个时期风格的该类 ：

.container {

}

---

Ids是元素的唯一名称，例如group1 。

在HTML中 ，您可以使用class属性将id应用于元素：

<div id="group1">

在CSS中 ，您可以通过在ID名称之前放置一个井号（＃）来设置ID的样式：

#group1 {

}

---

适用于您的示例

我收到This Alert is dangerous因为This Alert is dangerous HTML内容，所以This Alert is dangerous ，但是您的CSS引用了一个SPAN元素，该元素具有一类text-danger并由另一个元素组成，该元素的ID为dangerAlert 。

CSS：

#dangerAlert {
  background: green;
  color: green;
}
span .text-danger {
  color: blue
}

我将缺少的元素应用于您的HTML：

<div id="dangerAlert">
  <span class="text-danger">
    This Alert is dangerous
  </span>
</div>

 #dangerAlert { background: green; color: green; } .text-danger { color: blue; } 

 <div id="dangerAlert"> <span class="text-danger"> This Alert is dangerous </span> </div>