发表于: 2018-10-20 21:08:00

1 629


今天完成的事情:


任务十的页头和导航栏

.wait{
   float: right;
   border-left: 0.5px solid #fff;
   border-right: 0.5px solid #fff;
}
.rank{
   color: #fff;
   padding: 10px 10px 10px 10px;
   line-height: 40px;
}
.rank:hover{
   color: black;
   background-color: #fff;
   padding: 12px 30px 12px 30px;
}
.history{
   height: 70px;
   background-color: #f8f8f8;
}
.nav{
   margin-top: 5px;
}
@media (min-width: 768px) {
   .nav{
       float: right;
       margin-top: 5px;
   }
}


明天计划的事情:继续任务十的其他部分


遇到的问题:今天遇到了一个我自己都觉得自己蠢的问题,导航栏缩小以后无法居中,后来被师兄点醒,是我忘记了权重问题。


收获:今天加深了我对权重的认识,
对于前端工程师来说,这是一个很基础的问题,如果前端工程师没有深刻理解这个概念,则很难写出高质量的CSS代码。讨论CSS的权重,则必须想了解而且是深刻的了解CSS样式的6种基础选择器:ID选择器、类选择器、属性选择器、伪类和为对象选择器、标签选择器以及统配选择器。所有在CSS样式中定义的选择符都是由这6种基础选择符组合而成的,组合的方式也分为三种:后代选择符、子选择符、相邻选择符。CSS的权重指的是这些选择符的优先级,优先级高的CSS样式会覆盖优先级低的样式,优先级越高说明权重越高,反之亦然。按照规则,基础选择器具有这样的优先级:ID > 类 | 伪类 | 属性选择 > 标签类型 | 伪对象 > 通配符


返回列表 返回列表
评论

    分享到