发表于: 2019-10-24 20:04:25
1 1051
今天完成的事情:大致写完任务七的第一个页面,效果
明天计划的事情:继续进行任务七
遇到的问题:在进行右边三角形定位的时候一直无法很好的定位在中间导致花费较长时间,了解了利用绝对定位来垂直居中。
收获:了解了几种用css画三角形的花费,基本代码
.q1{
width: 0;
height: 0;
border-top: 50px solid black;
border-right: 50px solid transparent;
border-left: 50px solid transparent;
}
实际效果
用此方法可以画出各种三角形可以不用切图更快捷,之后用绝对定位来固定三角形的位置,代码
.sjx2{
width: 0;
height: 0;
border-top: 14px solid transparent;
border-bottom: 14px solid transparent;
border-left: 14px solid #fbb435;
position: absolute;
right: 4px;
top: 50%;
margin-top: -31px;
}
.nd1{
position: relative;
}
实际效果
重点是在top:50%后需要margin-top: -31px;来调整位置,
明天继续任务七
评论