設置樣式的問題

Question

我有一個使用<select>元素的下拉列表。對於我在頁面上放置這個下拉列表的位置，我只希望該頁面的列表受到樣式的影響，所以我給select元素上的一個'posts'類。

在我的樣式表，我有：

.posts select 
{ 
    margin-left: 40px 
} 

它不工作，除非我刪除。員額。爲什麼？

這裏的元素：

<select class="form-control posts" (change)="reloadPosts({ userId: u.value })" #u> 
     <option value="">Select a user...</option> 
     <option *ngFor="#user of users" value="{{ user.id }}"> 
      {{ user.name }} 
     </option> 
    </select> 

Answer 1

.posts select目標一select爲元素的孩子具有類.posts

HTML樣品，其中.posts select工作

div { 
 
    background: lightblue; 
 
} 
 

 
.posts select { 
 
    margin-left: 40px; 
 
}

<div class="posts"> 
 
    <select> 
 
    <option>Select a value</option> 
 
    </select> 
 
</div

---

你的情況，你應該做這樣的，select.posts，其目標具有類posts

確實注意到一個select，不應該有空間select之間.posts

HTML樣品，其中select.posts工作

div { 
 
    background: lightblue; 
 
} 
 

 
select.posts { 
 
    margin-left: 40px; 
 
}

<div> 
 
    <select class="posts"> 
 
    <option>Select a value</option> 
 
    </select> 
 
</div