破解网站禁止复制页面内容和图片(css实现禁止文本被选中，禁止复制的方法是什么？)

　　破解网站禁止复制页面内容和图片(css实现禁止文本被选中，禁止复制的方法是什么？)

　　在前端开发中，有时会出现这样的情况：双击文本后，文本会被选中，特别难看，一点也不漂亮，非常不方便；有时我们只需要一些网页上的文字。无法选择或复制。

　　那么如何实现这个要求，让文本不被选中或复制呢？本文文章将给大家介绍如何在CSS中禁止文本被选中和禁止复制。有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

　　禁止文本被选中禁止复制的css实现其实很简单，我们可以使用user-select属性来完成。让我们来看看这个属性。

　　user-select 属性是css3新增的属性，可用于控制内容的选择性，设置或检索是否允许用户选择文本，适用于除替换元素外的所有元素。

　　基本语法：

　　user-select:value;

　　可以设置以下属性值：

　　auto：默认值，文本会根据浏览器的默认属性进行选择；

　　none：可以设置用户不能选择元素中的任何内容；

　　text：设置元素中用户可以选择的文本；

　　element：设置文本可选，但选择范围受元素边界限制（该属性值仅IE和FF支持）

　　all：当所有内容作为一个整体时可以选择。如果在子元素上发生双击或上下文单击，将选择回溯的子元素的最高祖先元素。简单的说：目标元素会被整体选中，而不是其中的一部分，浏览器会自动选中整个元素的内容。

　　-moz-none：Firefox 私有属性值。设置元素和子元素的文本将不是可选的；但是，子元素可以通过文本重置为可选。

　　浏览器支持

　　上图列出了user-select属性值为none|text|all时各个浏览器的支持程度；当属性值为element时，大部分浏览器不支持，故不列出。

　　下面我们用一个简单的代码例子来介绍css user-select属性的方法，禁止文本被选中和禁止复制，考虑兼容性。

　　禁止选择的文本复制代码示例：

　　css代码：

　　.box{

-webkit-user-select: none;

-moz-user-select: none;

-ms-user-select: none;

user-select: none;

}

　　html代码：

这是测试文字，选择试试，你会发现怎么也选不中，无法复制，哈哈哈哈！

　　阐明：

　　因为IE6-9不支持user-select属性，如果要实现user-select:none，即禁止文本被选中和禁止复制的效果，可以使用标签属性onselectstart="return false ;" 达到; 同时 Safari 和 Chrome 也支持这个标签属性。

　　总结：以上就是本文文章介绍的css实现，禁止选中文本，禁止复制所有内容。可以自己尝试一下，加深对 user-select 属性的理解。希望对大家的学习有所帮助。更多相关教程请访问：CSS视频教程、HTML视频教程、bootstrap视频教程！

　　以上就是css如何禁止文本被选中和禁止复制？更多详情（代码示例）请关注其他相关php中文网文章！

　　免责声明：本文原创发表于php中文网。转载请注明出处。感谢您的尊重！如果您有任何疑问，请与我们联系