发表于: 2020-08-18 23:22:48
1 1305
今天完成的事情:
完成任务3页面的布局
body {
background-color: #29bde0;
}
.nav {
display: flex;
justify-content: space-between;
align-items: center;
height: 4rem;
font-size: 1.7rem;
color: white;
margin-bottom: 1rem;
padding: 0 2%;
border-bottom: 1px solid #74d4eb;
}
.nav img {
zoom: .5;
}
main {
margin-top: 4rem;
display: flex;
justify-content: center;
align-items: center;
}
.boxs {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 70%;
height: 325px;
background-color: #ffedc5;
border: 3px solid white;
}
.shuzi {
position: absolute;
top: -1.5rem;
width: 3rem;
height: 3rem;
line-height: 3rem;
text-align: center;
background-color: white;
color: #f56b81;
border: 2px solid #ffedc5;
border-radius: 50%;
}
.pic1 {
background: url("./images/翻牌_07.png") no-repeat 50%;
width: 30rem;
height: 30rem;
border-radius: 50%;
zoom: .5;
}
/* 查看身份 */
.last {
text-align: center;
margin-top: 20px;
}
.last button {
width: 70%;
height: 50px;
font-size: 2rem;
color: white;
background-color: orange;
border: 0;
}
明天的计划:
实现js点击显示下一张页面的效果
评论