发表于: 2019-02-17 10:02:06
1 777
今天完成的事情:(一定要写非常细致的内容,比如说学会了盒子模型,了解了Margin)
1.完成任务9,顺便看一下《CSS揭秘》
2.学一下SASS,LESS相关知识
明天计划的事情:(一定要写非常细致的内容)
完成任务9
遇到的问题:(遇到什么困难,怎么解决的)
1.折叠栏(collapse)一直调的不好,后来结合官网的代码,感觉效果差异还是很大,后来花了好几个小时调啊调,终于解决,但后面完成之后还是有点瑕疵就是没有缓慢下拉的效果
2.还有就是职业选择方面,hover的时候,慢慢弹出的覆盖效果也比较麻烦
HTML部分
<div class="row">
<!--小表格-->
<div class="col-md-6 col-xs-12">
<div class="table-fuck">
</div>
</table>
<div class="table-look">
<p>IOS工程师</p>
</div>
</div>
CSS
.table-fuck{
margin-bottom: 20px;
position: relative;
overflow: hidden;
}
.table-look{
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
position: absolute;
top: 0;
width: 100%;
height: 100%;
left: 100%;
color: #ffffff;
text-align: center;
opacity: 0.7;
background: rgb(61,61,61);
}
.table-fuck:hover .table-look{
left: 0;
transition: left 1.5s;
}
3.还有就是表格方面的,在td中可以选择colspan,rowspan,来达到合并的效果,也是用了蛮久时间,最后还是请教其他人得出来的。
收获:(通过今天的学习,学到了什么知识)
任务8还是学到了挺多的
1.关于Bootstrap的应用知识多了一点,有轮播图(carousel),折叠栏(collapse),还有其他布局方面的
2.好像最近出了ES2019的,看看吧
评论