I've already created a clickable cell in a table with:
我已经在表格中创建了一个可点击的单元格:
但是表格有可见边框,当鼠标正好超过这些边框时,链接不起作用。 How can I make the border also clickable? I've tried a Javascript solution: 如何使边框也可以点击?我尝试过Javascript解决方案: Here the borders are handled, but it's not satisfactory, because in this case the "special" click types are not correctly handled (e.g. "ctrl + click" doesn't open a new tab). 这里处理了边框,但这并不令人满意,因为在这种情况下,“特殊”点击类型没有得到正确处理(例如“ctrl + click”不会打开新标签)。 Can we make the borders clickable in HTML/CSS? Do we have to use Javascript? 我们可以在HTML / CSS中点击边框吗?我们必须使用Javascript吗? EDIT : here is a minimal sample of what I have right now: http://jsfiddle.net/pUunJ/1/ 编辑:这是我现在所拥有的最小样本:http://jsfiddle.net/pUunJ/1/ 1 个解决方案 #1 1 first off, stay away from inline styling and inline Javascript. 首先,远离内联样式和内联Javascript。 I believe you issue is you apply the border to the table cells, if you want the link to include the borders apply the border to link link instead of the table cell 我相信你的问题是你将边框应用于表格单元格,如果你想要包含边框的链接应用边框链接链接而不是表格单元格 td { padding: 0; } a { height: 100%; width: 100%; display: block; border: 5px solid black; } JSFIDDLE css html javascript java ip io case ci http 写下你的评论吧 ! 吐个槽吧,看都看了 会员登录 | 用户注册 推荐阅读 jsp 知识图谱——机器大脑中的知识库 本文介绍了知识图谱在机器大脑中的应用,以及搜索引擎在知识图谱方面的发展。以谷歌知识图谱为例,说明了知识图谱的智能化特点。通过搜索引擎用户可以获取更加智能化的答案,如搜索关键词"Marie Curie",会得到居里夫人的详细信息以及与之相关的历史人物。知识图谱的出现引起了搜索引擎行业的变革,不仅美国的微软必应,中国的百度、搜狗等搜索引擎公司也纷纷推出了自己的知识图谱。 ... [详细] 蜡笔小新 2023-12-14 10:06:19 main 单击时动态创建元素 - Dynamically create element on click Ihavethefollowingonhtml我在html上有以下内容<html><head><scriptsrc..3003_Tes ... [详细] 蜡笔小新 2023-12-12 15:59:36 ip javascript入门·表单与表单元素总结(表单验证) 表单提交前的最后验证:通常在表单提交前,我们必须确认用户是否都把必须填选的做了,如果没有,就不能被提交到服务器,这里我们用到表单的formname.submit()看演示,其实这个对于我们修炼道 ... [详细] 蜡笔小新 2023-10-15 18:44:55 ip VScode格式化文档换行或不换行的设置方法 本文介绍了在VScode中设置格式化文档换行或不换行的方法,包括使用插件和修改settings.json文件的内容。详细步骤为:找到settings.json文件,将其中的代码替换为指定的代码。 ... [详细] 蜡笔小新 2023-12-14 17:15:38 main 求解hdu 1003 java题目的动态规划优化方法 本文讨论了如何优化解决hdu 1003 java题目的动态规划方法,通过分析加法规则和最大和的性质,提出了一种优化的思路。具体方法是,当从1加到n为负时,即sum(1,n)sum(n,s),可以继续加法计算。同时,还考虑了两种特殊情况:都是负数的情况和有0的情况。最后,通过使用Scanner类来获取输入数据。 ... [详细] 蜡笔小新 2023-12-14 13:11:00 main OC学习笔记之@property和@synthesize 本文介绍了OC学习笔记中的@property和@synthesize,包括属性的定义和合成的使用方法。通过示例代码详细讲解了@property和@synthesize的作用和用法。 ... [详细] 蜡笔小新 2023-12-14 12:05:06 jsp Mac OS 升级到11.2.2 Eclipse打不开了,报错Failed to create the Java Virtual Machine 本文介绍了在Mac OS升级到11.2.2版本后,使用Eclipse打开时出现报错Failed to create the Java Virtual Machine的问题,并提供了解决方法。 ... [详细] 蜡笔小新 2023-12-14 12:01:13 ip Voicewo在线语音识别转换jQuery插件的特点和示例 本文介绍了一款名为Voicewo的在线语音识别转换jQuery插件,该插件具有快速、架构、风格、扩展和兼容等特点,适合在互联网应用中使用。同时还提供了一个快速示例供开发人员参考。 ... [详细] 蜡笔小新 2023-12-13 20:01:16 jsp 《数据结构》学习笔记3——串匹配算法性能评估 本文主要讨论串匹配算法的性能评估,包括模式匹配、字符种类数量、算法复杂度等内容。通过借助C++中的头文件和库,可以实现对串的匹配操作。其中蛮力算法的复杂度为O(m*n),通过随机取出长度为m的子串作为模式P,在文本T中进行匹配,统计平均复杂度。对于成功和失败的匹配分别进行测试,分析其平均复杂度。详情请参考相关学习资源。 ... [详细] 蜡笔小新 2023-12-13 16:16:05 ip MooTools和JQuery并排 - MooTools and JQuery Side by Side IjustinheritedsomewebpageswhichusesMooTools.IneverusedMooTools.NowIneedtoaddsomef ... [详细] 蜡笔小新 2023-12-12 13:43:58 ip 常用的CSS属性及用法整理 本文整理了常用的CSS属性及用法,包括背景属性、边框属性、尺寸属性、可伸缩框属性、字体属性和文本属性等,方便开发者查阅和使用。 ... [详细] 蜡笔小新 2023-12-09 03:01:43 ip 简单的ajax与struts2实例 前言对于从事技术的人员来说ajax是这好东西,都会使用,而且乐于使用。但对于新手,开发一个ajax实例,还有是难度的,必竟对于他们这是新东西。leo开发一个简单的ajax实例,用的是 ... [详细] 蜡笔小新 2023-10-16 17:08:23 ip 用JavaScript实现的太空人手表 用JavaScript实现的太空人手表-JS写的太空人手表,没有用canvas、svg。主要用几个大的函数来动态显示时间、天气这些。天气的获取用到了AJAX请求。代码中有详细的注释 ... [详细] 蜡笔小新 2023-10-13 17:21:38 ip AJAX的POST请求及实现数据修改功能的方法 本文介绍了使用AJAX的POST请求实现数据修改功能的方法。通过ajax-post技术,可以实现在输入某个id后,通过ajax技术调用post.jsp修改具有该id记录的姓名的值。文章还提到了AJAX的概念和作用,以及使用async参数和open()方法的注意事项。同时强调了不推荐使用async=false的情况,并解释了JavaScript等待服务器响应的机制。 ... [详细] 蜡笔小新 2023-12-14 16:12:01 request Windows下配置PHP5.6的方法及注意事项 本文介绍了在Windows系统下配置PHP5.6的步骤及注意事项,包括下载PHP5.6、解压并配置IIS、添加模块映射、测试等。同时提供了一些常见问题的解决方法,如下载缺失的msvcr110.dll文件等。通过本文的指导,读者可以轻松地在Windows系统下配置PHP5.6,并解决一些常见的配置问题。 ... [详细] 蜡笔小新 2023-12-14 12:37:25 文竹a 这个家伙很懒,什么也没留下! Tags | 热门标签 typescript install header match cmd datetime client list version post join tree js jsp testing python3 python process triggers lua request ip less filter timezone export main rsa bytecode flutter RankList | 热门文章 1如何使用MATLAB调用摄像头进行人脸检测和识别 2Parity game(poj1733)题解及思路分析 3Magento模块实现前台用户发送邮件功能的细节 4CSS样式属性text-overflow、overflow、white-space、width的使用 5微信民众号商城/小顺序商城开源项目介绍及使用教程 6oracle11g 过程,oracle11g 安装过程 7三星透明手机的价格与技术性能成为消费者关注的焦点 8PeopleSoft安装镜像版本及导入语言包的方法 9红米3S3X|RROS-V7.0|安卓9.0|最强大的自定义|美观流畅|全新起航|魔幻动画|冰箱冻结|高级设置 10利用ARMA模型对平稳非白噪声序列进行建模的步骤及代码实现 11Python 教学 016 12Redis的默认端口、数据库使用和多端口配置 13vTiger CRM系统的导航和快捷键使用方法 14MySQL基础教程---mysql事务与储存引擎相关的知识介绍 15某点评网搜索策略的一些理解 PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具 Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有
How can I make the border also clickable? I've tried a Javascript solution:
如何使边框也可以点击?我尝试过Javascript解决方案:
Here the borders are handled, but it's not satisfactory, because in this case the "special" click types are not correctly handled (e.g. "ctrl + click" doesn't open a new tab).
这里处理了边框,但这并不令人满意,因为在这种情况下,“特殊”点击类型没有得到正确处理(例如“ctrl + click”不会打开新标签)。
Can we make the borders clickable in HTML/CSS? Do we have to use Javascript?
我们可以在HTML / CSS中点击边框吗?我们必须使用Javascript吗?
EDIT : here is a minimal sample of what I have right now: http://jsfiddle.net/pUunJ/1/
编辑:这是我现在所拥有的最小样本:http://jsfiddle.net/pUunJ/1/
1
first off, stay away from inline styling and inline Javascript.
首先,远离内联样式和内联Javascript。
I believe you issue is you apply the border to the table cells, if you want the link to include the borders apply the border to link link instead of the table cell
我相信你的问题是你将边框应用于表格单元格,如果你想要包含边框的链接应用边框链接链接而不是表格单元格
td { padding: 0; } a { height: 100%; width: 100%; display: block; border: 5px solid black; }
JSFIDDLE