网站内容复制(【web浏览器】CSS3amp复制页面效果教程(图))

　　网站内容复制(【web浏览器】CSS3amp复制页面效果教程(图))

　　在css中，可以使用“user-select”属性来实现页面内容无法复制的效果。该属性用于指定是否可以选择元素的内容。当属性值为“none”时，元素的内容不会被选中，因此不会被复制，语法为“element {user-select:none;}”。

　　本教程运行环境：Windows10系统，CSS3&&HTML5版本，戴尔G3电脑。

　　CSS如何防止复制页面内容

　　在CSS中，如果想达到不复制页面内容的效果，可以使用user-select属性。

　　user-select 属性指定是否可以选择元素的文本。在 Web 浏览器中，如果您双击文本，则会选择或突出显示文本。该属性用于防止这种行为。

　　语法如下：

　　user-select: auto|none|text|all;

　　属性值含义如下：

　　需要注意的是：

　　 -moz-user-select:none; /* Firefox私有属性 */

-webkit-user-select:none; /* WebKit内核私有属性 */

-ms-user-select:none; /* IE私有属性(IE10及以后) */

-khtml-user-select:none; /* KHTML内核私有属性 */

-o-user-select:none; /* Opera私有属性 */

user-select:none; /* CSS3属性 */

　　例子：

body{

-webkit-user-select: none; /* Safari */

-ms-user-select: none; /* IE 10 and IE 11 */

user-select: none; /* Standard syntax */

}

user-select 属性

给页面body元素添加user-select属性，就可以让页面内容禁止复制了。

　　输出结果：

　　上例中的文本输出不能再复制了。