將CSS導航到div元素中的元素

Question

我需要將css導航到一個元素，這是一個element（div）。 像這樣：

.element element {
  color: rgba(6, 132, 134, 255);
} 

怎么做？ 信息： element > .element無效， .element element也無效。
我正在嘗試獲取toolbar元素。 （這是html中的元素）：

<div class="main" id="main">
    <div class="toolbar">

    </div>
  </div>  

而且我需要在main中獲得工具欄元素，因為其他div中有更多的工具欄？

在此先感謝您的幫助。

Answer 1

根據您的HTML，您的CSS應該如下所示：

.toolbar {
  color:rgba(6, 132, 134, 255);
}

但是，由於類toolbar還有其他元素，因此可以使用特殊性，以便只有id為main的元素中具有類toolbar的元素才能使用這些樣式：

 #main .toolbar { color:rgba(6, 132, 134, 255); } 

 <div class="main" id="main"> <div class="toolbar"> This is some text. </div> </div> 

Answer 2

. 用於選擇具有特定類的元素，而#用於選擇具有特定ID的元素。 你的情況來選擇.toolbar嵌套在#main你將需要：

 #main .toolbar { color: rgba(6, 132, 134, 255); } 

Answer 3

那很簡單：

#main div.toolbar {
color: red;
}

這將針對ID為MAIN的元素中的類為TOOLBAR的DIV：

Answer 4

您的問題有點抽象，但是基於您添加的代碼，我認為您正在嘗試定位div“工具欄”，可以使用以下任何一種方法來完成此操作（以最佳順序排列） ：

1. #main .toolbar { ... }
2. .main .toolbar { ... }
3. #main div { ... }
4. .main div { ... }

Answer 5

您可以通過多種方式進行選擇，但如果要從一個導航到另一個，則應在CSS上使用（訪問工具欄）

.main div {
  color: rgba(6, 132, 134, 255);
} 

或者您可以簡單地使用css類選擇器直接選擇元素

.toolbar {
    color: rgba(6, 132, 134, 255);
}

但這不會顯示任何內容，為了查看任何內容，您必須使用height屬性，或插入一些內容