发表于: 2019-02-26 21:29:05

1 787


今天完成的事情,第三个页面,页头部分。


.wrapper{
 position: relative;
 display: grid;
 margin: 10px;
 grid-template-columns: 10% 10% 10% 10% 10% 10% 10% 10% 10% 10%;
 grid-template-rows: 10rem 2.5rem 2.5rem 2rem 2rem 2rem 3rem 3rem;
 border: 1px solid #eeeded;
 color: @gray-font;
}


.item12{
 display: flex;
 align-items: center;
 grid-column-start: 1;
 grid-column-end: 11;
 padding-left: 7px;
 font-size: .5rem;
 .item12-text{
   padding: 0 3px;
 }
}

遇到的问题,

最后一行的文字,最开始觉得是grid空间不够分配的问题。尝试把grid布局空间进行充分的分配,发现没有什么用,字体还是没有办法占据一行。调整字体大小之后,最低10px。字体空间还是会溢出空间。并且字体设置换行属性得话,会自动溢出空间。跑出外面。

请教师兄,师兄当时也遇到了这个问题,研究了一会发现还是没有太实质性的办法。只能让最后一段文字默认占据两行。


收获,任务14,之前就做过了。现在不用框架去写,还是感觉有的地方写的特别慢,很多边距,大小东西都要调整。不过对css方面的知识确实是一次,全面的运用了。很多地方,都忘记当初是怎么写了,反而需要看一下当初写的,在琢磨一下。


明天计划,做完14,15进js。


返回列表 返回列表
评论

    分享到