@charset "utf-8"; [v-cloak] { display:none } * { -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-touch-callout:text } body,h1,h2,h3,h4,h5,p,dl,dd,ul,ol,form,input,textarea,th,td,select { margin:0; padding:0 } html,body,div,span,object,,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video { margin:0; padding:0; border:0; outline:0; background:rgba(0,0,0,0) } a { outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0) } h1,h2,h3,h4,h5,h6,em,i { font-weight:100; font-style:normal } em { font-style:normal } ul,ol,li { list-style:none } a { text-decoration:none; outline:0 } img { border:none; vertical-align:top } table { border-collapse:collapse } input,textarea { outline:none } textarea { resize:none; overflow:auto } body { font-size:14px; font-family:"PingFangSC",Arial,Helvetica,STHeiTi,sans-serif } input { -webkit-appearance:none; outline:none } html,body { width:100%; height:100%; min-height:100vh; background-color:#eee } .wrapper { position:relative; box-sizing:border-box; margin:0 auto; width:100%; overflow-y:scroll; overflow-x:hidden } .content { padding:.1rem .2rem .4rem .22rem; font-size:.16rem; line-height:.24rem } .content a.tit-wrap { font:inherit; color:#F2F2F9 } .content .tit-wrap { display:flex; justify-content:space-between; align-items:center; padding-top:.12rem; margin-bottom:.18rem } .content .tit-wrap h2 { width:85%; font-size:.15rem; font-weight:600 } .content .tit-wrap i { transition:transform .3s ease; -moz-transition:-moz-transform .3s ease; -webkit-transition:-webkit-transform .3s ease; -o-transition:-o-transform .3s ease } .content .tit-wrap .up { transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -o-transform:rotate(180deg) } .content .desc-wrap { padding-right:.02rem; margin-bottom:.08rem } .content .desc-wrap h3 { margin-left:-0.06rem; font-weight:600; margin-bottom:.08rem; font-size:.15rem; text-align:justify } .content .desc-wrap .font-title { font-weight:600; font-size:.15rem; text-align:justify } .content .desc-wrap span.font-title { display:inline-block; margin-bottom:.08rem } .content .desc-wrap .sub-desc { margin-bottom:.12rem; font-size:.14rem; line-height:.2rem; text-align:justify } .content .desc-wrap .sub-desc p { margin-bottom:.06rem; text-align:justify } .content .desc-wrap .sub-desc span { display:inline-block; line-height:.18rem; font-size:.13rem; text-align:justify } .content .desc-wrap .sub-content:nth-child(2) { margin-top:.1rem } .content .desc-wrap .sub-content .sub-bottom-content:last-child .sub-desc { margin-bottom:.04rem } /* @media screen and (min-width:992px) and (max-height:579px) { .wrapper { height:558px; top:50%; transform:translateY(-50%); } }@media screen and (min-width:992px) { .wrapper { width:375px; height:667px; top:49%; transform:translateY(-50%); } ::-webkit-scrollbar { display:block; } ::-webkit-scrollbar-thumb { height:50px; outline-offset:-2px; outline:#fff solid 2px; border:2px solid #fff; background-color:#b2b3b4; border-radius:4px } ::-webkit-scrollbar-thumb:hover { height:50px; background-color:rgb(172,208,236); border-radius:4px } ::-webkit-scrollbar { width:8px; height:8px } ::-webkit-scrollbar-track-piece { background-color:transparent; border-radius:0 } ::-webkit-scrollbar { display:block; } }@media screen and (max-width:993px) { ::-webkit-scrollbar { display:none; } }*/
更新时间:2021-08-18 00:08:42
应用vue实现,列表项下拉箭头展示更多内容,核心代码 js:
this.$set(this.arrowup, index, !this.arrowup[index]);