~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
开发工具与关键技术：
作者：黄瑞民
撰写时间：2021/12/08
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
本次分享的案例是手风琴
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
*{
margin: 0;
padding: 0;
list-style: none;
text-decoration: none;
}
.SFQ{
margin-top: 50px;
margin-left: 500px;
}
/* 市内新闻 */
.SN{
position: relative;
width: 247px;
height: 52px;
overflow: hidden;
transition: all 1s ease;
}
.SN:hover{
width: 247px;
height: 200px;
}
.SFQ .SN a{
position: relative;
display: inline-block;
line-height: 52px;
width: 247px;
height: 52px;
background: #72f0e8;
font-size: 18px;
color: #ff9f0e;
border-bottom: 2px #c2cfce solid;
}
.SFQ .SN span{
position: absolute;
text-align: center;
margin-top: -21px;
最低0.47元/天 解锁文章
611
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
