在网页开发中,大家通常会遇到一些需要禁止用户选择文字的情况,如提示信息、版权声明等。这时大家需要使用 CSS 来实现文字不可选中效果。 下面介绍两种常用的实现方法:
1. user-select 属性
user-select 属性是一个 CSS3 新增的属性,用于指定元素内部的用户选择方式。可以通过以下取值来实现文字不可选中: user-select: none; 选中该元素内部的文本时,不会被高亮显示且无法复制。
2. -webkit-user-select 属性
-webkit-user-select 属性是针对 WebKit 内核浏览器的私有属性,同样可以实现文字不可选中,其取值与 user-select 属性相同: -webkit-user-select: none; 需要注意的是,该属性仅对 WebKit 内核的浏览器有效,因此需要加上浏览器私有前缀 -webkit-。
总结
以上两种方式都可以实现文字不可选中效果,可以根据实际需要选择使用。需要注意的是,如果对于某一个元素同时使用了 user-select 和 -webkit-user-select 属性,其中 -webkit-user-select 会覆盖 user-select 属性。