您现在的位置是:首页 > WEB > html+csshtml+css

使用css设置文本不可选

阿龙2019-06-27【html+css】人已围观

简介有时在一些文章网站看到一段不错的语句,想复制出来却发现鼠标不可以选中,这是为什么?怎么样实现这个功能呢?


其实要实现文本不可选很简单,让我们一步一步来看:

我们有两个段落
<p>欢迎来到寻觅个人博客-----可选</p>
<p class="non-selectable">欢迎来到寻觅个人博客----不可选</p>
//css 
.non-selectable {
    user-select : none; //文本无法选中
 }
要在一次单击中选择所有文本,您可以使用
<p>欢迎来到寻觅个人博客-----可选</p>
<p class="non-selectable">欢迎来到寻觅个人博客----不可选</p>
//css
.non-selectable {
    user-select : all ; // 选择的所有文字
 }
你可以设置 user-select: ( auto || text ) ; 使文字可选。

注意:使用webkit || moz || ms支持所有浏览器
-webkit-user-select: none;  /* Chrome all / Safari all */   
-moz-user-select: none;     /* Firefox all */  
-ms-user-select: none;      /* IE 10+ */

Tags:html   css   文本不可选

支持一下! ()

文章评论

    共有条评论大侠,来闹两句...

    请输入昵称:

    填入验证码:

打赏本站

  • 如果您觉得站长文章不错,可以通过扫码支付打赏一下哦!
  • 微信扫码:您说多少就多少~
  • 支付宝扫码:您说多少就多少~