CSS禁止用鼠标选择网页或DIV中的文本

一些网站站长朋友，为了防止其网站内容被复制，或者由于某些原因不希望访问者选择网站的某些DIV元素中的文本，他们提出了各种东西把戏。今天，Feiniao Muyu的博客作者将告诉您如何使用CSS3属性来防止网页上的文本或DIV元素被鼠标选中。

CSS属性禁止选择网页文本

CSS3中有一个用户选择属性。此属性可以设置不选择某个DIV元素中的文本。让我们在下面详细讨论它

CSS3中的用户选择属性

css属性用户选择简介

此用户选择具有四个值，即：none |文字|全部|元素，其默认值为：文本

无：无法选择文本

文本：可以选择文本

all：将所有内容视为一个整体时可以选择。如果双击或单击上下文中的子元素，则选定的部分将是该子元素的最高祖先元素。

元素：您可以选择文本，但是选择范围受元素边界的限制

浏览器支持情况

如下所示

详细说明

1.IE6-9不支持此属性，但支持使用tag属性onselectstart =“ return false;”。达到用户选择的效果：无； Safari和Chrome也支持此标记属性；

2.直到Opera1 2. 5仍然不支持此属性，但是像IE6-9一样，它还支持使用私有标签属性unselectable =“ on”来实现用户选择的效果：无另一个是不可选择的一个值已关闭；

3.除Chrome和* Safari外，在其他浏览器中，如果文本设置为-ms-user-select：none ;，则用户将无法开始在文本块中选择文本。但是，如果用户开始选择页面其他区域中的文本，则用户仍可以选择将文本设置为-ms-user-select：none;。 *区域文字；

4.相应的脚本功能是userSelect

用户选择示例说明

禁止鼠标选择整个网页的文本

代码

body{
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

如图所示：

禁止DIV中的文本被鼠标选中

代码

.mochu{
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

如图所示

以上是有关如何使用CSS3禁止选择整个网页中的文本或某个元素中的文本的教程。如果您觉得有问题，或者网站设计不错，可以将PHP教程类文章发布到此博客！

如果您觉得这篇文章对您有用，则可以喜欢它，也可以给编辑以奖励！

本文来自电脑杂谈，转载请注明本文网址：
http://www.pc-fly.com/a/bofangqi/article-335290-1.html