对于像按钮一样运作的插槽(例如,这个 Stack Overflow 页面侧栏上的按钮题为 问题、标签和用户)或选项卡,如果用户随机选择文本,则是否有 CSS 标准方式禁用突出效果?

我意识到可以用JavaScript做到这一点,而谷歌有点带来了Mozilla-only -moz-user-select选项。

有没有一个符合标准的方式来实现这一点与CSS,如果没有,什么是“最好的实践”方法?


当前回答

将一个类添加到您的 CSS 定义你不能选择或突出一个元素。

<style> 
    .no_highlighting{
        user-select: none;
    }

    .anchor_without_decoration:hover{
        text-decoration-style: none;
    }
</style>

<a href="#" class="anchor_without_decoration no_highlighting">Anchor text</a>

其他回答

.hidden:after { 内容: attr(data-txt); } <p class="hidden" data-txt="某些文本你不想被选中"></p>

然而,这不是最好的方式。

它很容易用:

-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;

替代:

假设你有一个 <h1 id="example">Hello, World!</h1>. 你将不得不删除内部HTML的 h1,在这种情况下Hello, World. 然后你将不得不去CSS并这样做:

#example::before // You can of course use **::after** as well.
{
    content: 'Hello, World!'; // Both single-quotes and double-quotes can be used here.

    display: block; // To make sure it works fine in every browser.
}

现在它只是认为它是一个区块元素,而不是文本。

假设有两种类似的DIV:

.second { cursor: default; user-select: none; -webkit-user-select: none; /* Chrome/Safari/Opera */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ -webkit-touch-callout: none; /* iOS Safari */ } <div class="first"> 这是我的第一个 div </div> <div class="second"> 这是我的第二个 div </div>

设置默认的路由器,以便它给用户一个不可选择的感觉。

预定必须用于支持它在所有浏览器. 没有预定,这可能不会在所有答案工作。

查看我的解决方案没有JavaScript:

吉普赛

首頁 〉外文書 〉文學 〉文學 〉文學 〉文學 〉文學 〉文學 〉文學 〉文學 〉文學 〉文學 〉文學 〉文學 〉文學 〉文學

使用我的技术的Popup菜单: http://jsfiddle.net/y4Lac/2/

将此添加到您想要禁用文本选项的第一个 div 中:

onmousedown='return false;' 
onselectstart='return false;'