解决FF和safari下文本禁止选择的问题

最新推荐文章于 2025-12-02 22:03:53 发布
转载 最新推荐文章于 2025-12-02 22:03:53 发布 · 1k 阅读 · 0
文章标签：

#safari #function #ie #css

本文介绍了一种在不同浏览器（包括IE、Firefox和Safari）下实现网页文本禁止选择的方法。通过结合使用CSS属性和JavaScript事件处理程序，确保了在多种浏览器环境下的一致性体验。

解决FF和safari下文本禁止选择的问题

作者:jsrpg 日期:2006-11-03

字体大小: 小 中 大
众所周知，在IE下面可以采用onselectstart和ondrag方式实现文本的禁止选择功能，但是在FF和safari下面却是不可使用，可以采用以下方法，完全是CSS的功劳：
程序代码 程序代码
body{
    -moz-user-select: none;
    -khtml-user-select: none;
    user-select: none;
}


不过这种方法只在FF和safari下有效，因此还得结合IE下的方法实现：
程序代码 程序代码
document.body.onselectstart=document.body.ondrag=function(){return false}

 
禁止选择文本的css(chrome,safari,firefox等)
KylinBL的专栏
04-12 6858
<br />一直以为不让用户选中文本，都是用javascript来做的，没想到用css也可以，知识面太空窄了，记下来，<br />以供查阅。<br /> <br />firefox下：<br />body { -moz-user-select: none; }<br /> <br />chrome和safari下：<br />body { -webkit-user-select: none; }
各浏览器禁止选中文字方法
卯野芽衣子
11-10 3989
各浏览器禁止选中文字各自有个的方法。 代码 <div unselectable="on" style="background:#ccc;">unselectable="on" -webkit-user-select:none;">-webkit-user-select:none; -moz-user-select:none;">-moz-user-sele
游览器禁止选中问题
aixuner1002的博客
09-25 503
本文为转载文章，转载地址为https://www.feiniaomy.com/post/169.html CSS属性禁止网页文字被选中 CSS3中有个user-select属性，这个属性可以设置某个DIV元素中的文本不被选中，下面就详细的说一下 CSS3中user-select属性 css属性user-select介绍 这个user-select有四个值，分别为：none | text | al...
JS浏览器禁止选择功能
weixin_30621919的博客
09-19 154
如果在FF或者是Safari的话就不一般了，使用全部CSS的方式： body{ 　　-moz-user-select:none; 　　-khtml-user-select:none;　　 　　user-select:none; } 如果是其他的浏览器就使用JS控制即可: 在body上面注册一个onselectstart事件: function(){ 　　alert("不让选择"...
CSS禁止选中文本
dbe0810的博客
11-10 122
<p class="noselect"> Unselectable text. </p> <style> .noselect { -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -k...
css和html常见问题,css常见问题
weixin_36081327的博客
06-21 260
1. CSS 中 inline 元素可以设置 padding 和 margin 吗？行内元素设置width,height无效。但是设置margin和padding是有效的。行内非替换元素的外边距不会改变一个元素的行高div, form, table, header, aside, section, article, figure, figcaption, h1~h6, nav, p, pre, ...
兼容FF和IE的JS颜色渐变实现方法
比如`-webkit-`前缀主要针对Chrome和Safari，`-moz-`针对Firefox，`-ms-`针对IE早期版本。 - **使用Modernizr库检测功能**： Modernizr是一个JavaScript库，它可以帮助你检测浏览器对HTML5和CSS3的支持程度。使用...
53、2D绘图上下文：功能与应用详解
u5v6w7的博客
07-22 34
本文详细介绍了HTML5 2D绘图上下文的核心功能与应用，包括文本绘制、变换、图像绘制、阴影、渐变、图案以及图像数据处理等内容。通过丰富的示例代码和图表，解析了各种功能的使用方法和注意事项，并探讨了其在游戏开发与数据可视化等实际场景中的应用。文章还总结了各功能的对比表格及操作流程，并提出了兼容性与最佳实践建议，帮助开发者更好地利用Canvas进行2D图形开发。
CSS浏览器兼容全攻略：解决各种hack问题
本文档详细梳理了CSS在各个主流浏览器（如IE6、IE7、IE8、Firefox、Chrome和Safari）之间的兼容性问题，特别是针对IE浏览器特有的hack技术，以及解决常见的布局、对齐、宽高、浮动、列表、链接、背景和图片等样式...
52、2D绘图上下文：功能与应用
pink7的博客
06-23 38
本文详细介绍了HTML5 Canvas中2D绘图上下文的功能与应用，涵盖了文本绘制、变换操作、图像绘制、阴影与渐变效果、图案填充、图像数据处理等核心内容，并提供了丰富的代码示例和性能优化建议。适合希望掌握Canvas 2D绘图技术的前端开发者阅读。
antd-5版本table组件修改滚动条样式不生效问题
09-16
我的系统提示说"参考用户上一次的问题和你的回答"，但上下文是新的，所以我只需基于提供的引用。 用户需求：解决antd 5版本table组件滚动条样式修改不生效的问题。 结构我的回答： - 系统指令要求回答清晰、真实...
js 移动端ios禁止选中文字
01-18 5633
问题描述 手机端苹果手机，长按可以选中文字，但是一些按钮上一般要避免长按时弹出选中文字，或者一些罩层要避免弹出。 问题解决 使用css可以禁止： .className {user-select: none; -webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;} 兼容性 易犯错误 不要
SVG公众号排版『iOS手机长按禁止选中文字』解决方法
懂点君
11-22 2707
最近一位老铁向懂点君提问了一个问题：在iOS手机中长按切换图片会选中文字（SVG效果上下有文本内容），安卓手机则不会选中文字。看到问题后，脑子里立马蹦出了一个解决方法，在svg元素和p元素添加禁止文本复制的CSS属性：user-select: none，在iOS手机测试了一下，发现问题仍然没有解决，长按还是能选中文本内容。
Safari 11.0 已发布，新特性都在这儿了！
weixin_33910759的博客
06-08 355
Safari 11.0 兼容性 Safari 11.0 可运行于 iOS 11.0 和 macOS 10.1版本的系统环境，同时在macOS 10.12.6 和 10.11.6版本中也可以使用。 Highlights of Safari 11.0 Safari 11.0的亮点 基于WebRTC标准实现了P2PWeb视频会议。 新增了一些用来测试代码和网络性能的策略...
四大主流浏览器Chrome、Edge、Safari、Firefox内核检测免费工具评测
ToDetect的博客
11-12 1304
不同浏览器内核版本不同，想要检测准确，就要找靠谱的浏览器内核检测工具。分享支持 Chrome、Edge、Safari、Firefox 不同浏览器内核检测工具真实测评。
CSS 网页布局：技术基础与实践技巧
最新发布
csbysj2020的博客
12-02 380
CSS网页布局是前端开发中的核心技术之一，掌握CSS布局的基础知识和实践技巧对于成为一名优秀的前端开发者至关重要。本文介绍了CSS布局的基础知识、布局模型、实践技巧以及响应式布局，希望对读者有所帮助。
css 父节点设置display: flex； align-items: center；，子节点如何跟随其他子节点撑高的高度
PrimaryColor
12-02 54
父节点设置display: flex;，子节点如何跟随其他子节点撑高的高度？如果子节点设置了height，那么需要取消height的属性，让height为auto。
主题切换（1）：css变量的使用（:root）
Z_Wonderful的博客
12-01 346
:root 是一个伪类选择器，它匹配文档的根元素（即 <html> 元素）。使用 :root 定义 CSS 变量（自定义属性）可以让变量具有全局作用域，方便在整个项目中统一管理和动态调整样式
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值