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

html-css016

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

<!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即可

CSS改变流动条的样式,代码如下:

scrollbar-face-color:#FEFAF1 (立体滚动条凸出部分的颜色) 

scrollbar-highlight-color:#FEFAF1 (滚动条空白部分的颜色) 

scrollbar-shadow-color:#FEFAF1 (立体滚动条阴影的颜色) 

scrollbar-arrow-color:#E6C3B9(上下按钮上三角箭头的颜色) 

scrollbar-base-color:#FEFAF1 (滚动条的基本颜色) 

scrollbar-darkshadow-color:#E6C3B9 (立体滚动条强阴影的颜色) 

scrollbar-3dlight-color:#E6C3B9(滚动条亮边的颜色) 

scrollbar-track-color:#FEFAF1} (滚动条的背景颜色)

CSS(层叠样式表)级联样式表是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。