body,div,p,img,a,table,tr,td,h1,h2,h3,h4,ul,li,dl,dd,dt,input,form,video,b,em {
padding:0;
margin:0;
}
body {
color:#333;
font-family:"Microsoft YaHei";
height:100%;
font-size:12px
}
a {
text-decoration:none;
}
ul,li {
list-style-type:none;
}
img {
border:0;
display:block;
width:100%;
}
em,i {
font-style:normal;
}
.over {
overflow:hidden;
}
.fl {
float:left;
}
.fr {
float:right;
}
.re {
position:relative;
}
.fx {
position:fixed;
}
/* 滚动条样式 */::-webkit-scrollbar {
width:6px;
height:6px;
}
::-webkit-scrollbar-thumb {
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
background-color:#c3c3c3;
}
::-webkit-scrollbar-track {
background-color:transparent;
}
/* 滚动条样式End */
.chooseZh {
padding-top:30px;
}
.right {
width:80%;
border:1px solid #e6e6e6;
border-radius:5px;
padding:5px 0 0;
margin:auto;
}
.defaultSpan {
display:inline-block;
height:26px;
line-height:26px;
margin-bottom:5px;
margin-left:5px;
}
.groupSpan {
float:left;
width:90%;
margin-left:5px;
overflow-x:hidden;
overflow-y:auto;
max-height:150px;
}
.item {
background:aliceblue;
border-radius:5px;
padding:5px;
margin-right:5px;
margin-bottom:5px;
}
.delG {
width:15px;
height:15px;
margin-left:3px;
border:1px solid #e6e6e6;
border-radius:50%;
background-color:#f2f2f2;
}
.clear {
width:15px;
height:15px;
margin-right:5px;
margin-top:6px;
}
.pull {
width:15px;
height:15px;
margin-top:6px;
margin-right:5px;
}
.pullItem {
overflow-x:hidden;
overflow-y:auto;
width:80%;
margin:auto;
max-height:150px;
margin-bottom:10px;
border:1px solid #e6e6e6;
border-top:none;
border-radius:0 0 5px 5px;
}
.pullItem p {
height:30px;
line-height:30px;
padding:0 5px;
}
.pullItem p:HOVER {
background-color:cornflowerblue;
color:white;
}
在做项目的过程中,需要批量操作的,但是又要把选中的显示出来,又非让用select那样显示的,所以就写了这个东西,相当于自定义的一个下拉框,实现了多选的功能