html - 求解关于伪类和visibility的问题
问题描述
想把鼠标悬停在“用户”上时表格会显现出来,可是为什么以下代码不能实现?到底哪里错了好烦躁呀!
html<!DOCTYPE html><html><head lang='en'> <meta charset='UTF-8'> <title></title> <style> table{ visibility: hidden; } a:hover table{visibility: visible; } </style></head><body><p> <a href='https://www.haobala.com/wenda/6147.html'>用户</a> <table><tr> <td><a href='https://www.haobala.com/wenda/6147.html'>好友</a> </td></tr><tr> <td><a href='https://www.haobala.com/wenda/6147.html'>关注</a> </td></tr><tr> <td><a href='https://www.haobala.com/wenda/6147.html'>设置</a> </td></tr><tr> <td><a href='https://www.haobala.com/wenda/6147.html'>消息</a> </td></tr> </table> </p></body></html>
问题解答
回答1:css选择器用错了
cssa:hover table{ visibility: visible;}
表示一个祖先元素的是a元素,且该a元素状态为hover 的 table 元素是可见的。对于你的html, a元素是 table 元素的兄弟元素,应该是:
cssa:hover + table{ visibility: visible;}
相关文章:
1. css - chrome下a标签嵌套img 显示会多个小箭头?2. sql语句 - mysql中关联表查询问题3. python - django models 为生成的html元素添加样式。4. javascript - 如何将一个div始终固定在某个位置;无论屏幕和分辨率怎么变化;div位置始终不变5. javascript - vscode alt+shift+f 格式化js代码,通不过eslint的代码风格检查怎么办。。。6. javascript - 有什么比较好的网页版shell前端组件?7. javascript - 原生canvas中如何获取到触摸事件的canvas内坐标?8. javascript - iframe 为什么加载网页的时候滚动条这样显示?9. html - vue项目中用到了elementUI问题10. mysql updtae追加数据sql语句
