CSS实现文字禁止选择
墨初 Web前端 757阅读
CSS样式表中有一个user-select属性,此属性的值如果设置为 none 的话,可以禁止DIV元素中的文字被鼠标选中。下面具体的使用方法,供大家参考。
CSS user-select 属性
user-select:规定是否选取元素中的文本。
语法:
user-select: auto|none|text|all;
属性值:
值 | 描述 |
---|---|
auto | 默认。如果浏览器允许,则可以选择文本。 |
none | 防止文本选取。 |
text | 文本可被用户选取。 |
all | 单击选取文本,而不是双击。 |
CSS 禁止元素中的文本被选中
CSS禁止元素中的文本被选中,只需要将元素的CSS的user-select属性的值设置为 none 即可!
例:
<style> .div1,.div2{ padding: 10px; font-size: 14px; background-color: #f5f5f5; margin-bottom: 10px; display: inline-block; } .div2{ user-select: none; } </style> <div class="div1">我是可以被选中的文本!</div> <!-- 下面元素的CSS属性定义了鼠标不能选中文字 --> <div class="div2">我是无法用鼠标进行选中的!</div>