开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

我的带有zmdi图标的html按钮不工作

问题描述：我的带有zmdi图标的HTML按钮不工作。

解决方案：

确保正确引入了zmdi图标库：在HTML文件的<head>标签中，使用<link>标签引入zmdi图标库的CSS文件。例如：<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/zmdi@latest/css/zmdi.min.css"><button class="zmdi zmdi-check">确认</button><button class="zmdi zmdi-check my-button">确认</button>.my-button { /* 自定义样式 */ }<button class="zmdi zmdi-check my-button" onclick="myFunction()">确认</button>function myFunction() { // 在这里编写按钮点击后的逻辑 }
检查按钮的HTML代码：确保按钮的HTML代码正确无误。例如：
检查CSS样式：确保按钮的CSS样式正确应用。例如，可以为按钮添加一个自定义的CSS类，并在CSS文件中定义该类的样式：
检查JavaScript代码：如果按钮需要通过JavaScript来实现某些功能，确保相关的JavaScript代码正确无误，并且在按钮被点击时触发相应的事件处理函数。例如：
检查依赖项：如果使用了其他库或框架，例如jQuery或Vue.js，确保这些依赖项正确引入，并且没有冲突或错误。

如果以上步骤都没有解决问题，可以尝试以下额外的调试方法：

在浏览器的开发者工具中查看控制台是否有任何错误信息。
检查网络请求是否正常加载zmdi图标库的CSS文件。
尝试在其他浏览器或设备上测试按钮是否正常工作，以确定是否是特定环境的问题。

腾讯云相关产品推荐：

如果您的应用程序需要在云端运行，可以考虑使用腾讯云的云服务器（CVM）产品。云服务器提供了灵活的计算资源，可以满足各种规模和需求的应用程序。
如果您需要在云端存储和管理大量的数据，可以考虑使用腾讯云的对象存储（COS）产品。对象存储提供了高可靠性和可扩展性的存储服务，适用于各种数据存储需求。
如果您的应用程序需要进行人工智能相关的任务，可以考虑使用腾讯云的人工智能服务，例如人脸识别、语音识别等。这些服务可以帮助您快速实现各种人工智能功能。

请注意，以上推荐的腾讯云产品仅供参考，具体选择应根据您的实际需求和情况进行决策。您可以访问腾讯云官方网站（https://cloud.tencent.com/）了解更多关于腾讯云产品的详细信息和文档。

相关搜索:按钮在我的HTML的某些部分不工作超链接工作 - 带提交按钮的Html表单不工作我的导航栏按钮的动画不工作为什么我的带有RecyclerView的DiffUtil不工作？我的Bootstrap Carousel不工作，按钮不显示为什么我的bootstrap下拉按钮不工作？为什么我的cookie弹出按钮不工作？单击带有chrome扩展名的按钮(错误/不工作)我的Slick的视频播放按钮不工作我的舵图不工作，但原来的yamls是的为什么我的html按钮不能正常工作？为什么我的带有awk的linux命令不工作？我的带有'sys.argv‘的python代码不工作我的bootstrap 5转盘按钮不工作我的按钮不工作了，我怎么在android studio上让它工作？我的“滑出”菜单在HTML中工作，但在PHP中不工作 Android -地图-我的位置按钮不工作，蓝点不显示我不希望代码工作时，键盘上的删除按钮我的carousal "next“按钮不工作，carousal没有自动转换为什么我的按钮在Electron JS中不工作？

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

做了七年前端开发，我最近才意识到可访问性的必要......

作者 | Deepak K Vijayan 译者 | Phoenix 策划 | 闫园园作为一名 7 年多的前端开发者，我从未想过我的工作需要具有可访问性，直到最近才领悟。...确保 tab 可用以及删除多余的 tab 链接可访问的图标按钮 —— 至少使用带有适当标签的焦点指示器 —— 除非有替代方案，否则不要禁用默认的焦点样式尽可能提供视觉标签描述性信息图——为屏幕阅读器提供回退文本描述...1 HTML 语义有一种叫做 ARIA 地标的东西，它能简单地将网页划分为不同的地标，使屏幕阅读器更容易在网页内部导航。...等其他元素，再将样式设置为按钮的样子，我知道我们这样做已经很久了，但是时候改变了。原因正如 HTML 语义部分所述，原生元素有很多内置的 ARIA 特性。...这里也有一些注意事项：不设置按钮样式以及设置按钮样式的理想方法针对于没有任何文本、只有图片的按钮，可遵循以下三个步骤中的任何一个：使用隐藏的来指明按钮标签在上使用

1.7K3 0

前端如何提高用户体验：增强可点击区域的大小

为了更加清楚，请参见下图，左图可点击区别(圈红部分)明显比右图的小很多，所以右图的实现用户体验会更好。 ? 对于本文，会介绍一些事例，并通过事例演示如何增加可点击区别，提高用户体验。...不要在移动设备屏幕上将按钮设置得太小，以免按下正确的按钮。触摸目标的最小尺寸最好至少为44 x 44像素。...在下面的图中，我模拟了两个按钮的不同情况。在左侧，按钮更小，更远，用户需要更多的时间与它互动。在右侧，按钮大小更大，更接近于它的同级输入元素，这将使交互更容易、更快。 ?...复选框和单选按钮当存在复选框或单选按钮元素时，我希望可以单击它或关联的标签来激活/禁用它。 ? 从用户体验的角度来看，这是难以访问和糟糕的。...这样，问题得以解决，整个复选框或单选按钮都是可单击的，如下图所 ? 侧边栏对于带有类别的页面，有时我会注意到列表链接没有扩展到其父页面的整个宽度。也就是说，可点击区域仅在文本上，如下图所示： ?

4.8K2 0

Web 隐藏技术：几中隐藏 Web 中的元素方法及优缺点

只有当视口宽度大于400px时，才会显示该图。我向元素添加了hidden`属性。在CSS中，我使用hidden属性仅在所需的视口大小中显示元素。...控制颜色和字体大小虽然这两种技术不像我们前面讨论的那样常见，但它们可能对某些用例有用。颜色透明通过使文本的颜色透明，它将隐藏在视觉上。这对于只有图标的按钮非常有用。...它甚至可以在不更改颜色的情况下工作，但是我出于解释目的添加了它。 image.png 事例源码：https://codepen.io/shadeed/pe......-- --> 在上面的例子中，我们有一个带有标签和图标的菜单按钮。为了向屏幕阅读器隐藏图标，添加了aria-hidden。...隐藏按钮 image.png 在Twitter上，有一个名为“查看新推文”(See New Tweets)的按钮，对于带有aria-hidden内容的屏幕阅读器来说是隐藏的，只有在有新推文可用时才会显示出来

5.1K3 0

初次尝试使用VisualSFM记录

大家好，又见面了，我是你们的朋友全栈君。...实际上，VisualSFM只做了一部分工作，优化是用MeshLab做的，所以分两个环节： 1.VisualSFM做”图像匹配”、“SFM”（CMVS）、”BA” 官网下载的UI不带cmvs...2.4 清除杂点就是把那些离散的很远的，点都去掉，把不是我们想要的目标的点去掉，还有就是明显错误的点（例如：不在本来的平面上）都去掉。...： 2.8 完成了，就可导出了，不导出下次可就看不到了； —————————————————————————————————————————– 好了，完事了，总结一下：图越多，效果越好哈，真的是；...（这是一句废话） 2.4栅格化的时候，删除多余的面，如果手动删除的话也是可行的，这样鼠标的表面就不会被删除了，最终的结果就不会镂空那么多了。

1.1K1 0

ug4入门教程

图1-5 UG NX的操作界面在工具栏上单击“应用模块”按钮，在下拉列表中选择“建模”进入设计模块。进入设计模块后，主菜单以及工具栏都将发生一些变化，如图1-6所示，这时才可以进行各项设计工作。...UG在退出时将提示“是否真的要退出”，如图1-7所示，单击“是”按钮退出UG NX，并关闭窗口。 1.3 UG NX的操作界面图1-8所示是UG NX的常见工作界面。...绘图区即是UG的工作区，其可用于显示绘图后的图素、分析结果、刀具路径结果等。（6）导航按钮与导航器：当单击导航按钮时，导航器会显示出来。导航器是让用户管理当前零件的一个树形界面。...1.4 UG NX中鼠标的应用使用UG时，应该选用含有3键功能的鼠标。在UG的工作环境中，鼠标的3个按键即左键MB1、中键MB2、右键MB3均含有其特殊的功能。...图1-17 动态旋转 è STEP 5显示为线框方式单击“视图”工具条中的显示方式下拉按钮（原显示项为“带边着色”），选择“带有变暗边的线框”，如图1-18所示，则模型将显示为线框方式，如图1-19

3.4K3 0

MySQL的图形化工具——MySQL Workbench

安装过程在这里不在详述，过程非常简单，需要帮助的可以查看在线手册的内容：https://dev.mysql.com/doc/workbench/en/wb-installing.html 使用过程中，首先需要创建一个连接...1：主要是执行各种命令的按钮。⚡️表示执行区域2所选的SQL语句，如果不选择将全部执行。⚡️旁边带有一个游标的按钮表示执行当前光标行的语句。...右边还有一个带放大镜的按钮，该按钮可以显示查询语句的执行计划。 2：在这里输入各种查询语句。...Tip：这里给大家介绍一个小窍门，在区域1的右侧有一个小扫把的图标，该按钮可以美化你的查询语句。 ? 两条语句是一样的，上面是美化前的，下面是经过美化具有缩进格式。生成ER图。...接下来，给大家展示的是Workbench的一个优秀的功能，通过反向工程生成ER图。这个功能个人觉得在工作中应该要经常使用。简单来说，它可以连接现有的数据库，然后生成ER图。

7.2K3 2

小白学电脑计算机的组成,新手学电脑步骤,从零开始学电脑「建议收藏」

大家好，又见面了，我是你们的朋友全栈君。...，对于办公而言，手机还是有很大的局限性，掌握电脑知识，熟悉电脑基本操作是胜任工作的必备技能。...4、网线我们需要一根双向带有水晶头的网线，一头接路由器，一头接主机的网卡插口，连接好后，在开机状态下网卡显示灯会亮，说明连接正常，这样我们就可以正常上网了。...三、电脑基本操作 1、开关机初学者，首先需要学的是正确的开机和关机步骤。开机很简单，直接按主机的电源按钮即可打开主机，按显示器的开关即可。...以下是鼠标的实物图：左键：使用鼠标左键，单击(点一下)表示选中，按住不放可以拖动文件，双击(连续点两下)一般是打开文件或者打开软件。

3.1K2 0

ps切图怎么做成html,PS切图怎么导出网页 PS切图怎么生成源代码

PS切片的网址和源代码功能在PS切片的编辑功能里，添加URL地址，切片存储为WEB所有格式，优化存储结果保存成“HTML和图像”或者“仅HTML”。这样保存出来的切片就是网页的图片，带有源代码功能。...点击鼠标的右键就会出来这个然后点编辑切片选项 4、在URL中输入你要链接的位置去，这里我连接的就是浏览器的首页 5、存储为WEB所有格式 6、然后保存为PNG-24并点击保存 7、保存的格式为...HTML与图像并点击保存 8、在桌面上找到对应的保存文件并打开 9、保存之后再将此保存的打开就可以看到下链接的地址了 PS切图怎么生成源代码 1、用PS打开需要切片加链接的图片。...PS文字切片怎么制作导航条 1、首先打开PS软件，新建一个长1024像素X50像素的导航条，再用着色按钮涂上你喜欢的颜色，如图所示： 2、然后，进一步美化一下导航条。...本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至举报，一经查实，本站将立刻删除。

4.2K4 0

这四种最最常见的按钮类型，设计师必须掌握

实心按钮的启用和禁用状态使用正确的按钮形状。关于形状，有两种流行的选择——方角和圆角。带有圆角的按钮在人眼看来确实更好看（我们自然倾向于避免具有锋利边缘的物体）。...最后但并非最不重要的一点是，幽灵按钮是视觉上的多功能按钮，这意味着它们可以在不同类型的背景上很好地工作。它使幽灵按钮适用于深色和浅色主题。...Google文档中的图标当您需要呈现大量动作但由于某种原因不希望将它们堆叠在一起时，仅图标按钮可以很好地工作。设计要点确保图标的含义对用户来说是清楚的。图标的含义对用户来说应该是非常清楚的。...FAB 是一个只有图标的按钮，设计有微妙的阴影，通常位于屏幕的右下角。何时使用由于 FAB 是一个相对紧凑的按钮，它通常用作移动应用程序的主要操作。FAB 通常用于一项操作。...所有用户组都应该理解图标的含义。我进行的可用性测试表明，当用户不理解 FAB 图标的含义时，他们不会与之交互，这对您的应用程序来说可能是一个关键问题。 FAB 仅用于一项操作。

3.7K1 0

制作一个简单的chrome扩展

想做到这些,你得先知道chrome的扩展的开发流程是什么! ? chrome商店我们要做这样一个小玩意儿: ? 动图_效果演示什么是扩展: 可以简单把扩展理解为浏览器的插件....扩展的结构从结构来看,扩展像是一个配置文件(manifest.json),加一个完整的网页(包括html, css , js, images) ?..., // 定义运行扩展后默认打开的文件 "default_popup": "index.html" } } 写主程序(一个完整的网页): 其实就是写一个带有后台逻辑的网页...,我已经把代码相关注释标注完整,附在了文末......= the_menu; // 更新按钮显示的文字,只是第一次起作用 btn.innerHTML = "换一个"; }) }; 教程涉及到的资源我都通过百度网盘分享给大家

1.2K13 0

上那学计算机,从零开始学电脑（学电脑从哪开始）

大家好，又见面了，我是你们的朋友全栈君。...从零开始学电脑(学电脑从哪开始)如今，手机已经成为我们生活中不可缺少的必需品，各种手机应用软件的层出不穷，使得智能手机占据了互联网的半壁江山，似乎手机无所不能了，平时，很多人觉得一手机在手便可以仗剑走天涯...4、网线我们需要一根双向带有水晶头的网线，一头接路由器，一头接主机的网卡插口，连接好后，在开机状态下网卡显示灯会亮，说明连接正常，这样我们就可以正常上网了。...三、电脑基本操作 1、开关机初学者，首先需要学的是正确的开机和关机步骤。开机很简单，直接按主机的电源按钮即可打开主机，按显示器的开关即可。...以下是鼠标的实物图：左键：使用鼠标左键，单击(点一下)表示选中，按住不放可以拖动文件，双击(连续点两下)一般是打开文件或者打开软件。

7731 0

HTML表单和组件

表单基本所有的网页无非就是在做两件事情：1.呈现数据给客户看，2.接收用户输入的数据。所以表单就是用来收集用户输入的数据，然后提交给服务器。示例图： ?...3.表单按钮：包括提交按钮、复位按钮和一般按钮；用于将数据传送到服务器上的CGI脚本或者取消输入，还可以用表单按钮来控制其他定义了处理脚本的处理工作。...当我们注册某个网站的用户时，就能看到一堆的组件，让我在这些组件里输入、选择相关的信息，然后点击提交按钮后，这些信息就会提交到服务器上，这就是组件的一个主要作用，收集组件里的数据并提交到服务器上这是表单的作用...enctype属性，enctype指定了HTTP请求的Content-Type。简单来说就是指定数据提交的类型，通常来说有两种类型：一种是带有文件的数据提交，一种是不带有文件的数据提交。...在默认情况下，HTML的form表单中的enctype属性默认指定的是：application/x-www-form-urlencoded类型，也就是不带有文件的数据提交类型。

2.7K6 0

java学习之路：32.史上最全的Swing常用组件

这是基础代码，创建一个空白窗体，为了文章不臃肿，我就只列出一次。...三.JButton | 代表Swing按钮 JButton类拥有5种构造方法：构造方法解释 JButton() 创建没有设置文本或图标的按钮 JButton(String text) 创建带有文本的按钮...JButton(Icon icon) 创建带有图标的按钮 JButton(String text, Icon icon) 创建带有初始文本和图标的按钮 JButton(Action a) 创建一个按钮...如果这里有疑问可查看：布局管理器 2.创建带有文本的按钮 JButton jb=new JButton("我是按钮"); jb.setBounds(50,50,100,100);//使用绝对布局...3.创建带有图标的按钮想使用带有图标的按钮，需要使用Icon接口：Icon import java.awt.*; import javax.swing.*; public class DrawIcon

7K3 2

origin如何绘制双y轴柱状图_Graphpad柱状图双Y轴

大家好，又见面了，我是你们的朋友全栈君。思路：在两个图层上分别绘制两个柱状图，然后将两个图层合并。第一步：建立一个X列，四个Y列。...其中，两列数据中间加上两个空列第二步：绘制第一个柱状图第三步：绘制第二个柱状图第四步：两图层合并点击合并按钮第五步：接下来就是坐标轴的显示基本上就完成了 tips...：origin横坐标的标注如何修改成双行显示呢？...本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至举报，一经查实，本站将立刻删除。...发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/187579.html原文链接：https://javaforall.cn

3.2K1 0

Android Material UI控件之MaterialButton

① 准备工作在activity_main.xml中增加一个按钮，同时增加id ? 进入MainActivity。 ?...我选择了第二种方式，使样式的作用域只对这个Activity生效，那么现在你再重新运行，我跟你说，不阔能报错。就是这么滴的自信。运行后的效果图如下： ? 3....因为这个描边是内外描边，如果不加这个1dp的填充，会出现上下按钮最边缘出描边宽度一半的切割，我之前在低版本的Android手机上就是这样写的，不过在Android11中好像修复了这个问题，我不设置padding...因为在设计这种图的时候就只有这种标准的尺寸，注意它们都是2的倍数，在实际开发中也要遵循这个原则，这是设计的原则，不遵守也没关系。...现在我们都知道这个图标是.png的白色图标，如果我现在要改变这个图标的颜色，现在我既不想重新弄一个图标，又不想通过代码来改变这个颜色。

3.3K2 0

分享Nexus桌面插件的安装及使用，超级好看、好用的插件。附下载链接。「建议收藏」

大家好，又见面了，我是你们的朋友全栈君。效果图，如图所示！害怕win11的一系列bug，又想拥有像win11一样的桌面图标插件！Nexus可以满足你的需求！！！...这时候大家可能会发现为啥不是小编这样子的，而是一堆问号，真是因为上述格式备份文件，备份是大神门电脑的图标路径，我们需要对所有问号按钮进行删除，进行重新添加！删除方式如下图所示。...然后选择查找项目，选择想添加程序图标的exe文件即可。注：图标文件的路径可以在开始菜单里面看！好了，最后等你全都插入完了，可以选择关闭所有桌面图标的显示！...屏幕下方的任务栏也可以进行隐藏处理，最后的结果图就变成了这样，简直是治愈强迫症患者！！！！！！！！！！！这样的桌面，即使每天写论文，我都不是那么痛苦了！！！...本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至举报，一经查实，本站将立刻删除。

63.9K2 0

解放你的双手——UI设计稿全自动切图和标注的工具推荐

自动切图工具　　这里切图推荐一个插件：Cutterman，更多切图工具介绍请移步：扶朕起来，朕还能切 Cutterman 是个国产的切图工具，广告语就叫“最好用的切图工具” Cutterman致力于改善设计师的工作效率...支持多倍图多种格式多图层导出可以设置固定大小操作简单免费，只需要注册个账号即可一键切图，真正解放双手　　Cutterman能够让你只需要点击一个按钮，就自动输出你需要的各种各样的图片，快到没有朋友...几款强大的标注工具　　设计师不帮我们标注，咋们自己来，借助工具标注也是分分钟的事情，假如复杂的标注蹂躏了你，不要悲伤，不要哭泣。　　...（内心竟有点小小的惶恐…） 6.在蓝湖上，还可以基于设计图快速制作一个高保真的交互原型，让工程师不用再跑来问你“这个按钮跳到哪啊”，该原型还可以在蓝湖手机端App和微信上进行操作和预览。 ?...，适合个人和企业协同合作开发； Zeplin适合小型的团队，还带有一部分协作办公的功能（留言和更新状况），要求前端也能适应这种新的方式； Sketch Measure更传统一些，本地文档、打包切图等等，

3K3 0

【移动端网页布局】流式布局案例 ③ ( 实现搜索栏功能 | 伪元素选择器 | 子绝父相 | 外边距塌陷处理 | 二倍精灵图处理方案 )

: 两侧的半圆形圆角矩形框是通过定位设置的 ; 中间矩形子容器 : 中间的白色矩形框是通过标准流盒子实现的 , 该盒子不设置宽度 , 自动充满父容器 ; 为了不让该白色矩形影响到两侧的半圆...390 x 44 像素 , 该父容器的高度是 44 像素 ; 由于设备宽度不同 , 这里不设置宽度 , 让宽度自适应即可 ; css 样式实例 : .search-btn { /* 左侧按钮布局...*/ background-color: #ccc; } 6、二倍精灵图处理方案放大镜按钮实现 , 下图放大镜所在的盒子尺寸为 18 x 15 像素 ; 该图片是一张精灵图中的图片 , 图片地址为..., 放大镜图标的左上角在 81, 0 坐标位置 , 设置 background-position 时 , 设置为 -81, 0 即可 ; css 样式实例 : .sou { /* 二倍精灵图...-- 右侧的登录按钮 --> 登陆 2、CSS 样式本章节核心代码

2K3 0

Excel实战技巧65：制作漂亮的用户窗体按钮——当鼠标移动到按钮上时高亮显示

下面，我们来实现当鼠标移动到用户窗体按钮上时，会使用颜色高亮显示，让用户窗体更生动，如下图1所示。 ? 其实，你在图1中看到的按钮并不是用户窗体内置的传统命令按钮，而是使用图像控件来制作的。...然后，使用VBA代码来根据鼠标的位置切换这两个图像的可见性，从而实现按钮的动态变化。在Excel工作表中创建按钮图像使用文本框在Excel中创建按钮图像。...本例中，将使用绿色和白色/灰色格式来指示用户是否将鼠标悬停在特定按钮上。下图2是我制作的用于按钮图像的文本框。 ? 这里要注意的是，四个文本框的大小和格式设置都必须完全相同。...编写代码使用MouseMove事件来响应鼠标的动作，这个事件当鼠标移动到特定控件中时，执行其中的代码。...但是，如果用户将鼠标放置在除这两个按钮之外的其他地方时，我们不希望这两个按钮显示绿色，因此要使用用户窗体的MouseMove事件： Private SubUserForm_MouseMove(ByVal

8.3K2 0

【新！超详细】Figma组件属性完全指南

在组件属性之前，我需要生成 48 个变体，但是对于组件属性，我只用了 12 个变体就完成了。除了节省我们创建许多变体的时间之外，组件属性还减少了维护设计系统 UI 套件所需的工作量。...布尔属性在我看来，这是最强大的属性。布尔值是代码中使用的术语，表示真或假。使用此属性，您可以隐藏或显示组件中的元素。例如，让我们看一个包含图标的按钮。...如果您希望图标出现在按钮内，请将其切换为 ON (true)。如果没有，请将其切换为 OFF（假）何时使用布尔属性？布尔属性非常适合显示和隐藏图层。例如，对于带有和不带有图标的按钮。...通过查看我在 Figma 社区中共享的带有插槽组件的灵活模式 Figma 文件来了解它是如何工作的。...如果你这样工作，列表中的动作就会更少，而且会更有条理。

11.8K2 2

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭