vue2.0多条件搜索组件使用详解(2)

<style scoped> /*临时样式*/ .retrievalmian{ margin: 20px; width:75%; } /**/ /*.retrievaltitle{*/ /*background: #FCFCFC;*/ /*}*/ .retrievaltitle .tabbtn:first-child{ margin-right: -5px; } .retrievaltitle .tabbtn:hover{ text-decoration: none; } .retrievaltitle .tabbtn{ padding: 2px 8px; background: #FBFBFB; border: 1px solid #DFDFDF; margin-bottom: -1px; } .retrievaltitle .tabbtn.checked{ color: #E50F10; padding-top: 8px; border-bottom: 1px solid #FBFBFB; } .retrievalbar{ border: 1px solid #E5E5E5; background: #FCFCFC; } .formbody{ position: relative; margin: 10px 0px; } .formoperate{ position: absolute; top:10px; right: 20px; } .formoperate .tipsicon{ color: #59A4D2; display: inline-block; line-height: 15px; cursor: pointer; margin-left: 15px; width: 20px; height: 20px; } .formoperate .addplus{ background: url(../static/img/addplusicon.png) no-repeat center; } .formoperate .removeminus{ background: url(../static/img/removeicon.png) no-repeat center; } .formline{ padding: 5px 30px; } .formtips{ display: inline-block; margin-bottom: 10px; margin-right: 10px; } .formgroup{ display: inline-block; } .formcontrol{ border: 1px solid #999; width: 80px; height: 22px; } .forminp{ border: 1px solid #146AC4; width: 120px; height: 22px; } .formcontrollarg{ width:120px; height: 25px; } .formsearch{ position: absolute; bottom:10px; right: 20px; } .retrievalsearch{ padding: 5px 20px; } .formgroup .catalog{ border: 1px solid #999; width:120px; height: 22px; cursor: pointer; background: url(../static/img/dropdown.png) no-repeat; background-position: 95% 45%; } .cataloghint{ position: relative; } .cataloglist{ position: absolute; top: -1px; left: 0; padding: 0; border: 1px solid #999; background: #fff; z-index: 10; width: 120px; } .cataloglist li{ padding:2px 5px; } .cataloglist li:hover{ background: #1e90ff; } .checkbox { margin:0px; } </style>