                        課程
                    
                        /前端開(kāi)發(fā)
                        
                            /JavaScript
                        
                        /圖片展示特效

這個(gè)效果怎么用css來(lái)寫(xiě)?。?/h1>
這個(gè)效果怎么用css來(lái)寫(xiě)?。?/p>

叮叮不鐺鐺

2015-08-20

源自：圖片展示特效 2-2

關(guān)注問(wèn)題我要回答

669

操作

收起

1 回答

Leyoz
2015-11-18

用 :hover ?a { top:0;}就可以了。

例如：

<!DOCTYPE?HTML>
<html>
<head>
????<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"?/>
????<title></title>
????<link?rel="stylesheet"?href="style.css"??/>
????<style?type="text/css">
????????.time?{
????????????position:?relative;
????????????height:?400px;
????????????width:?400px;
????????????background:?#ff6600;
????????????overflow:?hidden;
????????}
????????.time-a?{
????????????position:?absolute;
????????????top:?300px;
????????????display:?inline-block;
????????????height:?400px;
????????????width:?400px;
????????????background:?#000;
????????????opacity:?0.8;
????????????text-align:?center;
????????}
????????.time:hover?.time-a?{
????????????top:0;
????????}
????</style>
</head>

<body>
<div?class="content3">
????<div?class="time">
????????<a?href=""?class="time-a">321654987</a>
????</div>
</div>

</body>
</html>