嘗試使用：不是（）用於自定義光標，不起作用

我有一個滑動托盤導航從左側進入，當我的頁面正文時，如果用戶不活躍在那個div我想喜歡顯示一個自定義的關閉光標，我只是努力讓它工作。嘗試使用：不是（）用於自定義光標，不起作用

.display-cs :not(#cs-index) { 
    cursor: pointer; 
    //url('../img/icons/close-cross.png'), default; 
}

https://jsfiddle.net/38gdp4pb/1/

我試着只是恢復到光標：指針無濟於事，任何知道我做錯了嗎？

更新

我的身體有類.display-cs和#cs-index是頁面上的菜單。我想自定義光標出現在頁面上，但不在#cs-index

來源

2017-08-09 Liam

從您的選擇器中刪除空間：'.display -cs：不是（＃cs-index）' – LuudJacobs

它似乎在工作，你有什麼問題？如果我的導航裏有另外一個div，它會有一個光標指針，而你的cs-index div不是 – Axnyff

_「我不希望當鼠標懸停在＃cs-index上時顯示光標_」 - 那麼你需要明確指定'＃cs-index'的_different_遊標，因爲'cursor'是繼承的屬性之一。 '：not'對你來說不會有幫助，因爲'＃cs-index'沒有應用遊標，因爲你的規則選擇了這個元素，而是因爲它從它的父代繼承了遊標。 – CBroe

EDITED的答案後COMMENT OP的：

你可以簡單地用一個單獨的規則將其覆蓋：

.display-cs { 
    cursor: pointer; 
    //url('../img/icons/close-cross.png'), default; 
} 

#cs-index { 
    padding: 10rem; 
    background: red; 
    color: #fff; 
    cursor: default; 
}

https://jsfiddle.net/dgroucag/

來源

2017-08-09 13:47:24 Johannes

我不希望鼠標懸停在＃cs-index上時出現，但是這允許？ – Liam

雖然......＃cs-index是那裏唯一的'.display-cs'元素的子元素，所以對於給定的HTML代碼也沒有多大意義，因此對於該HTML，這會選擇與只需'.display-cs'就必須開始。 – CBroe

看看小提琴，'＃cs-index'是**在**'.display-cs' –

您不能使用:not()來選擇父項而不是特定的子項，而是需要定義特定的規則以獲取子元素的默認指針。

.display-cs { 
 
    cursor: pointer; 
 
    border: 1px solid black; 
 
    padding: 10px; 
 
} 
 
#cs-index { 
 
    cursor: initial; 
 
} 
 
#cs-index { 
 
    padding: 5px; 
 
    background: red; 
 
    color: #fff; 
 
}

<div class="display-cs"> 
 
    <div class="nav" id="cs-index">This is my nav</div> 
 
    asdasd 
 
</div>

來源

2017-08-09 13:52:45

我已經更新了我的問題 - 我沒有足夠清楚地解釋它。 – Liam

仍然適用相同的答案。 –

你就沒必要not，只是#cs-index{cursor:auto;}

.display-cs { 
 
    padding: 20px; 
 
    cursor: pointer; 
 
    background-color: blue; 
 
    color: #FFF; 
 
} 
 

 
#cs-index { 
 
    background-color: red; 
 
    cursor: auto; 
 
    padding: 40px; 
 
}

<div class="display-cs"> 
 
    <div class="nav" id="cs-index">cs-index</div> 
 
    display-cs 
 
</div>

來源

2017-08-09 13:53:41 Ehsan

我更新了我的問題 - 我沒有足夠清楚地解釋它。 – Liam

@Liam，紅色是'＃cs-index'，藍色是'display-cs'。 – Ehsan

@Liam，查看我的答案！ – Ehsan

重疊它試試這個：

.display-cs { 
 
    cursor: pointer; 
 
} 
 

 
#cs-index { 
 
padding:10rem; 
 
background:red; 
 
color:#fff; 
 
cursor:initial; 
 
}

<div class="display-cs"> 
 

 
<div class="nav" id="cs-index">This is my nav</div> 
 
asdasd 
 
</div>

來源

2017-08-09 13:57:26

的CSS：

.display-cs *:not(#cs-index) { 
    cursor: pointer; 
} 
#cs-index { 
    padding:10rem; 
    background:red; 
    color:#fff; 
    cursor: default; 
}

的HTML：

<div class="display-cs"> 
    <div class="nav" id="cs-index">This is my nav</div> 
    <div> 
     asd1 
    </div> 
    <div> 
     asd2 
    </div> 
</div>

這將使任何元素塊上的指針光標不具有的ID #cs-index

來源

2017-08-09 13:58:39 Czoka

嘗試使用：不是（）用於自定義光標，不起作用

回答

相關問題