無法一鍵標記目標內格

<div class="buttons controls"> 
    <a href="#B"><button>Next</button></a> 
    <a href="#Z"><button>Previous</button></a> 
</div>

HTML結構我靶向按鈕

.controls>button 
.buttons.controls>button

，但它無法正常工作。我想知道爲什麼？

2015-10-05 Adam nick

僅供參考：在'a'元素中不能有'button'，這是無效的HTML。 – CBroe

這是爲什麼呢？ @CBroe –

因爲HTML規範是這樣說的。兩者都是「交互式」的元素 - 例如，你可以有一個按鈕，它會在一個連接某個地方的'a'元素內提交一個表單，然後所需的結果將是未定義的。 – CBroe

那麼答案，因爲你的<button>元素不是div.controls一個孩子。你可以使用.controls a > button或.controls > a > button

A > E

這是一個孩子的一個元素（即直系後代）任E元素

編輯：

.controls > a > button更具體。

<div class="buttons controls"> 
    <div class="myDiv"> 
     <a href="#H"> 
      <button>MyButton</button> 
     </a> 
    </div> 
</div>

正如你看到的，你 - 所以它只會在你的HTML看起來像這樣

<div class="buttons controls"> 
    <a href='#'> 
     <button>MyButton</button> 
    </a> 
</div>`

.controls a button是一個更普遍的選擇，因此它也與這樣的HTML應用應用也可以指定div作爲<a>元素的父項，CSS樣式仍將應用。

2015-10-05 15:12:39

非常感謝你，我做錯了。 –

不客氣！ :) –

'.controls a> button'或'.controls> a> button'之間是否有區別 –

因爲.button是錨的內部，因此它不是.controls類的直系後裔，你試圖在你的CSS做

試試這個：

.controls .button { 
    /* style here */ 
}

或類似規定在上述

.controls > a > button { 
    font-size: 20px; 
}

2015-10-05 15:12:24 nykc

回答