[散修弟子]PM-1590|2018年08月14日的日报-技能树.IT修真院

发表于： 2018-08-14 23:42:53

1 627

Today

1.重做了雪碧图,为啥我切出来的图片这么大,还要设置缩小一半...昨天的几张切图没导出png24,浪费了好多时间

2.菜单栏第一列<li>我全设置了右边有bottom了,但是第三列是没有右边的border

3.3个<li>平分宽度的时候,设置父容器display:flex ,子元素flex:1

#nav li ul {
display: none;
}

表示隐藏下拉菜单

#nav li:hover ul {
display: block;
background-color: #ffffff;
z-index: 999;
}

表示鼠标放在列表显示下拉菜单

5.鼠标放到一级菜单的时候,另外两个一级菜单中二级菜单的border-right 也显示了,改成<a>的border-right

6.对#nav li :text-align:center 可以让子菜单也居中

7.display只是改变了元素的显示方式，但是不能改变元素的性质

overflow: hidden;text-overflow:ellipsis;white-space: nowrap;

实现单行文本溢出时显示省略号

9.写蓝色箭头:

.iconInfoDate {
display: inline-block;
width: 10px;
height: 10px;
border-top: 2px solid #5fc0cd;
border-right: 2px solid #5fc0cd;
transform: rotate(45deg);
}

10.灰色小箭头:

.selectArrow {
width: 0;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #afbac0;
margin-left: 1rem;
}