css中文字不可复制

admin 轻心小站 关注 LV.19 运营
发表于前端技术学习版块 css,教程

在网站设计中,防止文字被复制是一种常见的需求。这种需求可以通过CSS来实现。CSS中可以使用user-select属性来控制用户是否能够选择文字。user-select属性包含以下几个值:user-s

在网站设计中,防止文字被复制是一种常见的需求。这种需求可以通过CSS来实现。

CSS中可以使用user-select属性来控制用户是否能够选择文字。user-select属性包含以下几个值:

user-select: auto; /* 默认值,允许选择文字 */
user-select: none; /* 禁止选择文字 */
user-select: text; /* 只允许选择由用户通过鼠标、键盘等方式创建的文本 */
user-select: contain; /* 选择的内容包含在一个自定义容器中 */ 

如果想要禁止用户选择文字,可以在CSS中设置user-select属性为none:

body {
  user-select: none;
} 

这样就可以防止用户通过鼠标选择文字了。不过需要注意的是,这种方法只能阻止用户通过鼠标选择文字,无法阻止用户通过其他方式复制文字。

如果想要完全防止文字被复制,可以使用JavaScript来实现。在网页加载完成后,可以通过JavaScript禁用用户的鼠标右键和键盘快捷键,使用户无法进行复制操作。

document.oncontextmenu = function() {return false;}
document.onkeydown = function(e) {
  if(e.keyCode == 67 && e.ctrlKey) {
    return false;
  }
} 

上面的代码禁用了鼠标右键和键盘快捷键的复制功能,可实现完全的防止文字被复制。

文章说明:

本文原创发布于探乎站长论坛,未经许可,禁止转载。

题图来自Unsplash,基于CC0协议

该文观点仅代表作者本人,探乎站长论坛平台仅提供信息存储空间服务。

评论列表 评论
发布评论

评论: css中文字不可复制

粉丝

0

关注

0

收藏

0

已有0次打赏