怎样实现鼠标移上去显示出下拉框,旁边的小箭头会旋转一个方向

 我来答
jiaozhuangfei
2016-12-06 · TA获得超过698个赞
知道小有建树答主
回答量:316
采纳率:100%
帮助的人:261万
展开全部
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        *{margin: 0; padding: 0;}
        div{width: 50px; height: 40px; background-color: #ccc;}
        div span{display: inline-block; border: 5px solid transparent; border-bottom-color: red; transform-origin: bottom;}
        div:hover span{transform: rotate(180deg);}
    </style>
</head>
<body>
<div><span></span></div>
</body>
</html>

划到上面的时候让里面代表尖头的子元素旋转180度就可以了,用transform:rotate即可

追问

要用ul li,整体效果是这样的

追答
这个没有影响啊,你第一栏里的三角肯定需要包一个标签的嘛,让划过第一个和最后一个li的时候里面那个标签旋转180度就可以了呀。
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式