.play-list-box { width: 300px; min-height: 612px; color: #fff; position: absolute; right: 0; top: 0; /* opacity: 1; transition: all .6s; */ } .play-list-box-hide { right: -100%; opacity: 0; } .play-list-box>h1 { color: #fff; opacity: .8; font-size: 18px; height: 36px; line-height: 36px; margin-top: 30px; margin-bottom: 20px; } .play-list-header { overflow: hidden; border-bottom:rgba(255,255,255,.1) solid 1px; } .play-list-body { margin-top: 10px; } .play-list-row { display: flex; justify-content: flex-start; text-align: left; margin-bottom: 10px; } .play-list-row>li { height: 30px; line-height: 30px; } .play-list-row>.sort { width: 30px; text-align: center; opacity: .6; } .play-list-row>.song-name { flex:1; opacity: .6; } .play-list-row>.singer-name { width: 80px; padding-left: 20px; box-sizing: border-box; opacity: .6; } .play-list-row>.operate { width: 80px; padding-right: 10px; box-sizing: border-box; display: flex; justify-content: space-around; } .play-list-row>.operate>button { font-size: 30px; width: 30px; height: 30px; opacity: .6; } .play-list-row>.operate>button:hover { opacity: .8; } ul.cur>.sort,ul.cur>.song-name,ul.cur>.singer-name { opacity: .8; }