文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

关于Firefox中链接点击弹出空白标签页的问题分析

前言 昨天突然有好心人提醒我说我的网站某些链接在firefox中打开时会弹出 about:blank 的空白页面。本来自己在测试的时候没怎么考虑浏览器的兼容问题，毕竟自己总共也没写几个标签。...这行简单的代码在chrome里没有问题，不过在 firefox 中如果点击这个标签就会立刻弹出一个 about:blank 的空白标签页，非常的不友好。...这个问题解决起来其实也很简单，原因就在于不知道为什么当时手贱顺手加了个 target="_blank" ，在大多数浏览器会在看到 javascript:void(0);之后阻止了创建页面的操作，但是firefox...相比之下，button 的语义才是确认用户的意图，这个跟标签页的语义相当，所以他才会推荐我们在做标签页的时候使用button标签。...这些设计也是挺有意思的，然而，尽管我十分认可 mozilla 的解释，但是考虑到页面当前对a标签的样式做的比较好，我也懒得再写button标签的样式，所以最终还是用了a标签。。。

2.4K20
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    关于拖拽功能在IE11 、Firefox和Safari中不兼容的问题

    拖拽功能不兼容主要有4大主要原因: 1是event的path属性引起的bug（ie，firebox，safari） 2是event的dataTransfer.setData属性（ie，firebox...） 3是firefox在拖动的时候会打开一个新窗口 （firbox） 4是ie11不支持onclick属性方法 ； ie11 里元素对象的attributes的排序和其他浏览器不同, ie11 中...remove()方法不work (ie) 对于原因1的解决方案 其中IE11 压根就不支持path属性，firefox和Safari还勉强通过hack的方式获取到path，获取方式如下： const...对于原因2的解决方案 IE11， firefox 都有dataTransfer.setData的问题， Safari没有可以不用管。...('click', function () {}) 如果你的业务代码里包含 获取对象attributes的值的代码，比如 event.target.attributes[n].xxx 在ie11中attributes

    4.7K30

    不是你记忆中的单例模式，但适用的程度，更胜一筹

    这不是十分正常的事情吗？一点防范都没有，这不是送人头的行为吗？ 白给！！...if 判断和锁的位置换一下不就完事儿了吗，为什么要在外面再加上一层，这不是多此一举吗？...而在锁内锁外都加一层 if 判断，当第一个线程进入锁空间，创建完单例，后面的线程即使是拿到了锁，也不会去执行创建单例的步骤。 这，才是一个好的单例模式，这是单例模式中的“懒汉模式”。...单例模式的优缺点 优点 由于单例模式在内存中只存在一个对象，减少了内存的开支，特别是当对象需要频繁的创建、销毁时，而且创建或销毁时性能又无法优化，单例模式的优势就非常明显。...单例模式对于测试是不利的。在并发环境中，如果单例没有完成，是不能进行测试的。 ---- 还行吧。 创作不易，顺手收藏好习惯，划着划着，就找不到了。 ?

    41510

    一篇文章带你了解CSS基础知识和基本用法

    前言 相信做过网页的对Css都不是很陌生，它可以帮助我们重铸网页中很多绚丽的特效，尤其是现在Css已经发展3.0版本，很多功能更是丰富多彩，让我们的开发时间不仅大大缩短，而且还可以轻松做出许多华丽的特效...，因为我们要想精确修改的Html中的某个元素的属性，就必须使用选择器，它可以通过选择器定位到某个元素上然后修改元素的样式。...blink 文本闪烁 7)).文本空白符的处理 pre-line 合并空白符序列，但是保留换行符 normal...忽略空白符 nowrap 文本不会换行，直到出现才换行 pre 空白会被浏览器保留 pre-wrap 保留空白符序列，但是正常地进行换行 8)).文本方向 的文本会溢出 unrestricted 在任意两个字符间换行。 suppress 压缩元素中的换行。浏览器只在行中没有其它有效换行点时进行换行。

    13.4K20

    5个你可能不知道的CSS属性

    每年都有新的CSS属性被标准化，并在主流浏览器中可用。 它们旨在使Web开发人员的工作变得轻松，创造出新颖美丽的网站。...这个功能在浏览器中的支持程度仍然很低，但情况会很快得以改善。在使用浏览器前缀的情况下， Chrome 49+，Firefox 46+和Opera 36+都支持这个属性。...：内容垂直排列，从上到下，从左到右阅读，第二行在第一行的右侧。 ：内容垂直排列，从上到下，从左到右阅读，在所有的排版方式中，即使是垂直版式, 字的顶部都是向左的。...：内容垂直排列，从上到下，从右到左阅读，在所有的排版方式中，即使是垂直版式，字的顶部都是向右。 最后两个值目前仅有Firefox支持。 想了解这个属性如何工作, 请看 a JSFiddle....好消息是，Chrome 53+，Opera 43+，Firefox 52+，Safari 10和Android目前支持此属性。 （IE和Microsoft Edge不支持）。

    1.6K80

    怎么用css属性屏蔽鼠标事件(鼠标点击可穿透上层元素)

    现在的情况是只有点击日期内容框空白区域时，才会响应点击事件显示下拉日期菜单。...而这个icon图标我是绝对定位到日期内容框中的，它的图层维度是高于日期内容框的，点击icon图标时是不会响应点击事件的。我的第一个反应是事件点击穿透，但是该怎么实现？...懵逼的我一顿操作猛如虎，开启面向谷歌编程大法… 事实证明访问外国网站很重要，谷歌精准 > 百度精准，再次吐槽百度的广告… 为了解决被icon图标遮盖住的内容框区域也能响应点击事件，可以使用poniter-events...poniter-events属性的值很多，但大部分和svg有关直接跳过，通用的属性值有两个none | auto。 auto：与 pointer-events 属性未指定时的表现效果相同。...再关注下poniter-events的兼容情况： 桌面浏览器 IE：11+（IE6~IE10均不支持） Firefox：3.6＋ Chrome：4.0+ Safari：6.0 Opera：15.0

    2.2K20

    瀑布流布局终于有了正确的打开方式

    没有 JavaScript，没有媒体查询，没有复杂的计算。浏览器会自动把内容塞进合适的列里，就像下面这样： 在三行 CSS 中，无需媒体查询或容器查询，我们创建了一个适用于所有屏幕尺寸的灵活布局。...Grid Lanes 也是这个逻辑——浏览器会把下一个元素放到“最靠近顶部”的位置，就像司机换车道抢位置一样。...Footer: 每组链接的高度都不一样，但它们能自动紧密排列，不留大片空白。...Chrome 57+、Firefox 52+、Safari 10.1+、Edge 16+ 全都没问题，全球浏览器兼容性评分高达 97 分。 而 Grid Lanes？...预计时间线： 保守估计： 2026 年上半年: Safari 正式版可能会支持 2026-2027 年: Chrome/Edge/Firefox 陆续跟进实现 真正生产可用: 至少还要等 1-2 年 在那之前

    23410

    5个你可能不知道的CSS属性

    1写在前面 每年都有新的CSS属性被标准化，并在主流浏览器中可用。它们旨在使Web开发人员的工作变得轻松，创造出新颖美丽的网站。...了解如何使用自定义字体以及加载它们需要多少时间是非常重要的一点。实际上，在浏览器等待自定义字体加载的过程中，用户在一定的时间内只能看到空白的内容。我们知道，如果内容加载过慢，用户将会离开页面。...sideways-lr：内容垂直排列，从上到下，从左到右阅读，在所有的排版方式中，即使是垂直版式, 字的顶部都是向左的。...sideways-rl：内容垂直排列，从上到下，从右到左阅读，在所有的排版方式中，即使是垂直版式，字的顶部都是向右。 最后两个值目前仅有Firefox支持。...好消息是，Chrome 53+，Opera 43+，Firefox 52+，Safari 10和Android目前支持此属性。 （IE和Microsoft Edge不支持）。

    1.4K20

    除了 Chrome，这些浏览器你也值得拥有！

    但其他浏览器仍然占据着 30% 以上的份额，这些浏览器随然综合上看没有 Chrome 强大，但是也各有千秋，他们在某些特定的领域还是有自己的优势的，或许在某些场景下，Chrome 不是你唯一的选择，下面我们就来一起看看还有哪些值得关注的浏览器...最全能的网络浏览器：Firefox Mozilla 的 Firefox 是对 Chrome、Edge 和 Safari 浏览器最受欢迎的替代品之一，部分原因是它自 2002 年起就一直存在，但更主要的原因是它频繁的更新...另外一个特别的功能是，对隐私比较重视的人们会喜欢，在屏幕顶部当前网站地址旁边会显示出的安全等级。网站根据其加密级别和检测到的跟踪器数量被评级为D到A。...你可以使用这些代币在浏览器中查看他们内容时，对网站所有者或在线创作者进行经济支持。用户也可以通过在浏览过程中启用 Brave 的广告来获得 BAT。...你也可以把工具栏移动到顶部、底部或者侧面，还可以将网页固定在侧边以便同时浏览。如果你喜欢边浏览网页边观看 YouTube 视频或者查看社交媒体网站，后一个功能特别有用。

    6.4K10

    Zotero 开源文献管理工具

    使用Chrome、Firefox和Safari等浏览器时，如果单击搜索栏旁边的Zotero图标，源文件或网页将自动保存其书目信息。...在Zotero中，点击顶部栏中的*“Add item by Identifier”工具并输入信息。...也可以通过选择“New Item”*工具手动输入一个条目，并选择适当的文档类型(书籍、期刊、报纸等)，使用右侧的空白面板添加书目信息。...要将笔记添加到特定的来源，点击来源，然后选择顶部栏中的 “New Note” 工具 。然后选择*“Add Child Note”*，打开一个文本框，可以在里面输入笔记。...还可以通过在相同的Zotero栏中添加后续的来源来创建包含多个来源的复合引文。 如果以后需要改变引用格式，可以在顶部栏中选择*“Document Preferences”*。

    1.9K20

    一个Mac系统，能让程序员编程效率提升30%

    ctrl+a：跑到当前行的最前端，使用频次很高。 ctrl+e：跑到当前行的最尾端，使用频次很高。 cmd+tab：切换应用，这是大部分人用的最多的方式，却不是最高效的方式，后面会介绍其他方式。...比如在safari，firefox，chrome下新建tab。 cmd+i: 显示当前文件的信息，查看文件大小，图片宽高的时候有用。 选中文件按空格预览：预览图片或者pdf文件时有用。...），有想学习web前端的，或是转行，或是大学生，还有工作中想提升自己能力的，正在学习的小伙伴欢迎加入学习。...点击：加入 全屏工作环境 Macbook屏幕都比较小，再除去顶部状态栏，和底部dock栏，所剩下的展示区域就非常少了，可视区域变小必然会导致更频繁的窗口滚动操作。...被低估的Safari 我很早之前是个重度Firefox使用者，Firefox上插件繁多，基本上能想到的功能都有对应插件来支持，缺点是插件越用越多，Firefox就越笨重，使用体验也随之降级，其实对于浏览器来说最重要的还是浏览体验

    2.7K20

    Mac下提升工作效率的方式

    ctrl+a：跑到当前行的最前端，使用频次很高。 ctrl+e：跑到当前行的最尾端，使用频次很高。 cmd+tab：切换应用，这是大部分人用的最多的方式，却不是最高效的方式，后面会介绍其他方式。...比如在safari，firefox，chrome下新建tab。 cmd+i: 显示当前文件的信息，查看文件大小，图片宽高的时候有用。 选中文件按空格预览：预览图片或者pdf文件时有用。...全屏工作环境 Macbook屏幕都比较小，再除去顶部状态栏，和底部dock栏，所剩下的展示区域就非常少了，可视区域变小必然会导致更频繁的窗口滚动操作。...被低估的Safari 我很早之前是个重度Firefox使用者，Firefox上插件繁多，基本上能想到的功能都有对应插件来支持，缺点是插件越用越多，Firefox就越笨重，使用体验也随之降级，其实对于浏览器来说最重要的还是浏览体验...双指双击阅读区域，可以将阅读区域放大至屏幕大小，在做大文字量阅读的时候很有用。再次双击恢复至原样。 三指单击英文单词，完成取词翻译。

    1.8K30

    兼容iPhone X* 刘海的正确姿势

    以往的做法 其实对于 web 前端来说，刘海在绝大多数的场景下是可以不用处理的，因为 safari 或客户端（微信，手Q等）的 statusBar 已经替我们抹平了顶部刘海，我们只需要关心底部的那条黑色的胡子...在 safari 往上段滑动一小段距离，可以看到当 safari 的底部操作栏出现后，页面依然会保留着距底部的 34px 空白。...那么是不是 ios11 以下就用不了这些了呢？是的，但你见过 iphone x+ 有 ios 11以下的吗？ 所以我们可以愉快的搞下去。...apple 把安全区域的位置通过 css 属性提供给了开发者，它们可以通过CSS的constant( )函数来完成： constant(safe-area-inset-top)：在Viewport顶部的安全区域内设置量...中，页面往上稍滑动一点，出现 safari 的操作栏后，底部按钮依然会紧贴着操作栏，非常有灵性： 处理起来一切都显得 简洁优雅细腻。

    98210

    清除“请允许观看视频”通知页面的完整指南

    要免费检查计算机中的广告软件并移除它，请使用下面的指南。“请允许观看视频”通知页面移除选项自助移除指南（如下）在我们的安全论坛寻求帮助自助指南本指南包含高级信息，但已以任何人都能遵循的方式编写。...我们现在需要启用Rootkit扫描以使用MalwareBytes检测尽可能多的恶意软件和不需要的程序。为此，点击屏幕左上角的设置齿轮，您将被带到常规设置部分。现在点击屏幕顶部的“安全”选项。...执行这些步骤将擦除Safari中的所有配置信息，例如您的“常用网站”、保存的表单信息、浏览历史记录和Cookie。此过程不会擦除您的书签或扩展，这些在重置Safari后仍然可用。...保持每个选项中的勾选标记，然后点击“重置”按钮。Safari将删除所有您的个人数据，然后打开一个空白页面，这意味着过程已完成。重要的是要注意，此过程不会删除您的书签或任何已安装的Safari扩展。...购买高级版免责声明：虽然我们从上述产品的销售中赚取佣金，但请放心，我们仅因其有效性而推荐它们。注意事项这是一个自助指南。使用风险自负。

    61710

    完美的背景图全屏css代码 – background-size:cover?

    在写主题样式的时候经常会碰到用背景图铺满整个背景的需求，这里分享下使用方法 需要的效果 图片以背景的形式铺满整个屏幕，不留空白区域 保持图像的纵横比（图片不变形） 图片居中 不出现滚动条 多浏览器支持...: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='bg.jpg', sizingMethod='scale')"; 这个用滤镜来兼容的写法并不是很完美...尽管如此，总比留空白好多了吧（如果背景图bg.jpg的宽高够大，则可以不用这段，变成简单的平铺，比图片变形效果好写，大家可以尝试下） 如果你觉得上面的方法不是很满意，那试试下面这种 用img形式来实现背景平铺效果...: Safari / Chrome / Opera / Firefox IE9+ IE 7/8: 平铺效果支持，但是在小于1024px的屏幕下居中效果失效 下面再说一种方法 JQ模拟的方法 html部分...: Safari / Chrome / Opera / Firefox IE7+ 其实我自己一般用的是（因为够用了，咱不挑/其实上面的都是俺翻译过来的） html部分 <

    7.2K40
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号

      领券