html模糊搜索怎么实现,jQuery实现模糊搜索效果

body {

background-color:#f5f5f5;

}

.warp {

width:50%;

margin:0 auto;

}

/*清除input默认样式*/

input {

border:0;

background-color:transparent;

}

/*搜索栏*/

.search_box {

width:60%;

height:32px;

box-sizing:border-box;

box-shadow:1px 1px 4px #e2e2e2;

padding:0 10px;

border:1px solid #e2e2e2;

border-radius:4px;

background-color:#f5f5f5;

margin:50px auto 20px auto;

}

.search_box input {

width:80%;

height:30px;

line-height:30px;

font-size:15px;

color:#8c8282;

}

.search_box .search_icon {

float:right;

display:inline-block;

width:24px;

height:24px;

background:url("img/search.png") no-repeat center center;

background-size:cover;

margin-top:3px;

}

/*搜索内容*/

.search_content {

width:60%;

margin:0 auto;

background-color:#fff;

border-radius:8px;

}

.search_content ul {

padding-left:0;

}

.search_content li {

width:90%;

margin:0 auto;

height:40px;

line-height:40px;

box-sizing:border-box;

border-bottom:.4px solid #e2e2e2;

list-style:none;

}

.search_content li:last-child {

border-bottom:0;

}

.search_content li a {

color:#8c8282;

}