html - 求解关于伪类和visibility的问题
迷茫
迷茫 2017-04-17 11:09:11
0
1
549

想把鼠标悬停在“用户”上时表格会显现出来,可是为什么以下代码不能实现?到底哪里错了好烦躁呀!

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="">用户</a>
    <table>
        <tr>
            <td>
                <a href="">好友</a>
            </td>
        </tr>
        <tr>
            <td>
                <a href="">关注</a>
            </td></tr>
        <tr>
            <td>
                <a href="">设置</a>
            </td>
        </tr>
        <tr>
            <td>
                <a href="">消息</a>
            </td>
        </tr>
    </table>
 
  </p>


</body>
</html>
迷茫
迷茫

业精于勤,荒于嬉;行成于思,毁于随。

全部回覆(1)
左手右手慢动作

css選擇器用錯了

cssa:hover table{
   visibility: visible;
}

表示一個祖先元素的是a元素,且該a元素狀態為hovertable 元素是可見的。
對於你的html, a元素是 table 元素的兄弟元素,應該是:

cssa:hover + table{
   visibility: visible;
}
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板