问答详情
源自：5-5 CSS3背景 制作导航菜单综合练习题

选择器里面什么意思，为什么设背景是只有这部分才有渐变？求大牛解答


.nav li::before,
.nav li::after{
 content:"";/*在li之间插入空内容*/
 position:absolute;/*相对于li标签*/
 /*定位分割线的位置大小*/
 top:14px;
 height: 25px;
 width: 1px;
}
.nav li::after{
			  right: 0px;
			  background: -moz-linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,.2) 50%, rgba(255,255,255,0));
			  background: -webkit-linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,.2) 50%, rgba(255,255,255,0));
			  background: -o-linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,.2) 50%, rgba(255,255,255,0));
			  background: -ms-linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,.2) 50%, rgba(255,255,255,0));
			  background: linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,.2) 50%, rgba(255,255,255,0));
			}


提问者：格砸3206448 2016-04-16 01:34

个回答

  • 弹吉他的卡农
    2016-04-16 14:48:31

    只有部分渐变是因为.nav li::after里面设置了height 和width；

     background: linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,.2) 50%, rgba(255,255,255,0));

    意思是透明度为0的白色向上渐变为透明度为0.2的白色，再向上渐变为透明度为1的白色，其中中间临界点为50%；

    0