尝试使用：不是（）用于自定义光标，不起作用

我有一个滑动托盘导航从左侧进入，当我的页面正文时，如果用户不活跃在那个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

尝试使用：不是（）用于自定义光标，不起作用

回答

相关问题