How do you override "

This question CSS rule to disable text selection highlighting shows how to prevent text selection on an element. Once you have prevented selection, how can you then allow selection for a specific child element? eg

<div class="no-select">
    <p>some text that cannot be selected</p>
    <p class="select">some text that can be selected</p>
    <p>some text that cannot be selected</p>
</div>

table.no-select{
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

td.select{-webkit-touch-callout: all !important;
-webkit-user-select: all !important;
-khtml-user-select: all !important;
-moz-user-select: all !important;
-ms-user-select: all !important;
user-select: all !important;
}

The .no-select rule above works, but my attempt at a .select rule does not, what is the correct way to do this?


Try -moz-user-select: text instead of all .

As a future reference, whenever concerned about the possible values for a css rule, check a site like MDN.

Here is the MDN link for user-select .

链接地址: http://www.djcxy.com/p/1090.html

上一篇: 如何对齐复选框及其标签始终交叉

下一篇: 你如何覆盖“