css按钮按不了是因为图层覆盖，导致按钮没法使用，其解决办法：1、打开相应HTML和CSS文件；2、将p和span标签各增加相对定位为“position:relative;”；3、在span中增加优先级为“z-index: 1;”即可。
本教程操作环境：Windows10系统、CSS3版、DELL G3电脑
为什么css按钮按不了？
关于float属性导致button按钮无法点击问题的解决思路
问题描述：有两个标签p和span，p位于span上层，button位于span中，当点击button的时候，button没有动作。
立即学习“前端免费学习笔记（深入）”；
部分代码
HTML代码
{{ chapter.title }} 添加小节 编辑 删除
登录后复制
CSS代码
.chanpterList p{ float: left; font-size: 20px; margin: 10px 0; padding: 10px; height: 70px; line-height: 50px; width: 100%; border: 1px solid #3568cd; } .chanpterList .acts { float: right; font-size: 14px; }
登录后复制
如图此添加小节按钮无法使用
之前没细看，用网上的的方法，将.chanpterList p中的 float: left;注释掉，因为图层覆盖，导致按钮没法使用，果然起作用了，也没多想。但是当有了下面显示小节的组件的时候，样式就不对了，完全乱了。这才回过头来看问题
仔细看发现，p标签在span上面，导致span里的组件没法使用，那就提升span的优先级，把span定位在最上层就好了，
现在p和span中各增加相对定位position: relative;再在span中增加优先级z-index: 1;，完成！！成功
推荐学习：《css视频教程》
以上就是为什么css按钮按不了的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2920498.html
