发表于: 2018-08-21 22:38:08

1 687


今天完成的事情:任务六基本完成。就差底部和一些小图标了。还有修改一些颜色和字体。


明天计划的事情:明天准备做完任务六 提交。


遇到的问题和收获:

1.导航栏的三块的均匀分布。

用了浮动的分成三个盒子,每个盒子占比33%。还有flex的justify-content属性定义了项目在主轴上的对齐方式。

space-between:两端对齐,项目之间的间隔都相等。

space-around:每个项目两侧的间隔相等。所以,项目之间的间隔比项目与边框的间隔大一倍。


2.下拉框还有hover效果

display 属性设置元素如何显示。

none  此元素不会被显示。

在通过hover触碰显示

.dropdown-content
{
display: none;
position: absolute;
top:.65rem;
width: 100%;
padding: 0;
background-color: #f9f9f9;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
.site:hover .dropdown-content{
display: block;
color: #333333;
}


3.向右的返回键和伪元素。

.value::after{
display: inline-block;
content: "";
width: 10px;
height: 10px;
margin: 0 .12rem;
border-top: 2px solid #5fc0cd;
border-right: 2px solid #5fc0cd;
transform: rotate(45deg);
}

跟任务五的向左返回键差不多。通过transform:rotate(- + deg)来。

今天还要看一下雪碧图的位置怎么来设。



返回列表 返回列表
评论

    分享到