.goods-page { .list-nav { border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; > li { float: left; width: 20%; height: 66px; text-align: center; font-size: 23px; line-height: 66px; } .bytouch { background: #eee; } a { display: block; box-sizing: border-box; width: 100%; height: 100%; color: #999; } .active > a { color: #000; .span-test { display: inline-block; box-sizing: border-box; width: auto; height: 100%; } .iconfont { color: #999; &.cur { color: #000; } &.drop { color: #000; } } } .new .iconfont { font-weight: bold; transform: scale(0.8); } .filter .iconfont { font-size: 24px; transition: transform 0.1 ease-in; } .filter.active .iconfont { transform: rotate(-180deg); } .icon { position: relative; i { position: absolute; font-weight: bold; transform: scale(0.8); } .up { top: -22px; } .down { top: -8px; } } .drop { font-size: 12PX; } } .drop-list { padding-left: 30px; position: absolute; z-index: 10; background: #fff; width: 100%; li { width: 100%; height: 88px; font-size: 28px; color: #b0b0b0; line-height: 88px; border-bottom: 1px solid #e0e0e0; } li:last-child { border-bottom: none; } .active { color: #444; .chose { display: inline-block; width: 30px; height: 22px; background-image: url("img/product/chose.png"); background-size: 100%; float: right; margin-top: 33px; margin-right: 30px; background-repeat: no-repeat; } } } .no-result { margin-top: 320px; color: #ccc; vertical-align: middle; text-align: center; font-size: 1.2em; } .goods-container { position: relative; padding-top: 8px; padding-left: 15px; min-height: 640px; } .new-list { width: 100%; background-color: #fff; font-size: 28px; color: #444; position: absolute; z-index: 5; li { margin-left: 35px; height: 88px; line-height: 88px; border-bottom: 1px solid #e0e0e0; padding-right: 38px; &:last-child { border-bottom: none; } &.active { background: url("img/product/shop/check.png") no-repeat 94% center; background-size: 36px 26px; } } } }