diff --git a/app/main/views.py b/app/main/views.py
index d0d3297..f515f1a 100644
--- a/app/main/views.py
+++ b/app/main/views.py
@@ -52,8 +52,12 @@ def query():
         return render_template('query.html', query_data=query_data)
     if request.method == 'POST':
         args = request.form
-        query_data = queries.get_query_data(**args)['data']
-        return render_template('tablerow.html', data=query_data, ladder_type='query')
+        if 'list' in args.get('region'):
+            query_data = queries.get_query_data(**args)['data']
+            return render_template('tablerow.html', data=query_data, ladder_type='query')
+        if 'img' in args.get('region'):
+            query_data = queries.get_query_data(**args)['data']
+            return render_template('playerlistimg.html', data=query_data)
 
 
 @main.route('/help', methods=['GET'])
diff --git a/app/static/css/lolhf.css b/app/static/css/lolhf.css
index 911dd7d..a8c4187 100644
--- a/app/static/css/lolhf.css
+++ b/app/static/css/lolhf.css
@@ -80,12 +80,13 @@ hr.divider {
 /*left_filter*/
 .left_filter {
     float: left;
-    padding-top: 30px;
-    padding-left: 50px;
+    padding-top: 20px;
+    padding-left: 150px;
 }
 
 .panel {
     width: 180px;
+    margin-top: 25px;
 }
 
 .panel-heading {
@@ -126,10 +127,11 @@ hr.divider {
 /*player_list*/
 .player_list {
     clear: right;
+    width: 70%;
     margin-left: 200px;
-    padding-left: 80px;
+    padding-left: 180px;
     padding-right: 80px;
-    padding-top: 30px;
+    padding-top: 50px;
 }
 
 .player_list ul {
@@ -144,13 +146,13 @@ hr.divider {
 }
 
 .player_list a.thumbnail {
-    margin-bottom: 10px;
-    width: 200px;
+    margin-bottom: 5px;
+    width: 110px;
 }
 
 .player_list .thumbnail {
     margin-bottom: 15px;
-    width: 220px;
+    width: 130px;
     padding-left: 5px;
     padding-right: 5px;
     margin-left: 5px;
@@ -160,7 +162,7 @@ hr.divider {
 .player_list .caption {
     padding: 0;
     text-align: center;
-    font-size: 18px;
+    font-size: 14px;
 }
 
 .player_list .col-md-3 {
diff --git a/app/static/js/lolhf.js b/app/static/js/lolhf.js
index 536dc08..1360754 100644
--- a/app/static/js/lolhf.js
+++ b/app/static/js/lolhf.js
@@ -66,11 +66,15 @@ $(function () {
         $(this).parent().siblings().children().removeClass("active");
         $(this).addClass("active");
         var url = '/query';
-        var args = {};
+        var args1 = {};
+        var args2 = {};
         $(".left_filter .active").each(function () {
-            args[$(this).parent().parent().attr("class")] = $(this).text();
+            args1[$(this).parent().parent().attr("class")] = $(this).text();
+            args2[$(this).parent().parent().attr("class")] = $(this).text();
         });
-        $.post(url, args, function (data) {
+        args1['region'] = 'list';
+        args2['region'] = 'img';
+        $.post(url, args1, function (data) {
             if (data) {
                 $(".ladder-row").empty().append(data);
             } else {
@@ -78,6 +82,14 @@ $(function () {
                 return false;
             }
         });
+        $.post(url, args2, function (data) {
+            if (data) {
+                $(".player_list").empty().append(data);
+            } else {
+                alert('指定条件没有查询到数据');
+                return false;
+            }
+        });
     });
 });
 
diff --git a/app/templates/playerlistimg.html b/app/templates/playerlistimg.html
new file mode 100644
index 0000000..197548f
--- /dev/null
+++ b/app/templates/playerlistimg.html
@@ -0,0 +1,12 @@
+{% for item in data %}
+    <div class="col-sm-6 col-md-2">
+        <div class="thumbnail">
+            <a href="#" class="thumbnail">
+                <img src="{{ url_for('static',filename='img/player/'~item.player_name~'.png') }}" alt="..." width="180" height="180">
+            </a>
+            <div class="caption">
+                <a href="#">{{ item.player_name }}</a>
+            </div>
+        </div>
+    </div>
+{% endfor %}
diff --git a/app/templates/query.html b/app/templates/query.html
index 17648a2..ace5544 100644
--- a/app/templates/query.html
+++ b/app/templates/query.html
@@ -65,76 +65,20 @@
         </div>
     </div>
     <div class="player_list">
-        <div class="col-sm-6 col-md-3">
-            <div class="thumbnail">
-                <a href="#" class="thumbnail">
-                    <img src="{{ url_for('static',filename='img/tmp/tmp_img.jpg') }}" alt="..." width="180" height="180">
-                </a>
-                <div class="caption">
-                    <a href="#">LOOPER</a>
+        {% for item in query_data %}
+            {% if item.player_name!='路人' %}
+                <div class="col-sm-6 col-md-2">
+                    <div class="thumbnail">
+                        <a href="#" class="thumbnail">
+                            <img src="{{ url_for('static',filename='img/player/'~item.player_name~'.png') }}" alt="..." width="100" height="100">
+                        </a>
+                        <div class="caption">
+                            <a href="#">{{ item.player_name }}</a>
+                        </div>
+                    </div>
                 </div>
-            </div>
-        </div>
-        <div class="col-sm-6 col-md-3">
-            <div class="thumbnail">
-                <a href="#" class="thumbnail">
-                    <img src="{{ url_for('static',filename='img/tmp/tmp_img.jpg') }}" alt="..." width="180" height="180">
-                </a>
-                <div class="caption">
-                    <a href="#">UZI</a>
-                </div>
-            </div>
-        </div>
-        <div class="col-sm-6 col-md-3">
-            <div class="thumbnail">
-                <a href="#" class="thumbnail">
-                    <img src="{{ url_for('static',filename='img/tmp/tmp_img.jpg') }}" alt="..." width="180" height="180">
-                </a>
-                <div class="caption">
-                    <a href="#">UZI</a>
-                </div>
-            </div>
-        </div>
-        <div class="col-sm-6 col-md-3">
-            <div class="thumbnail">
-                <a href="#" class="thumbnail">
-                    <img src="{{ url_for('static',filename='img/tmp/tmp_img.jpg') }}" alt="..." width="180" height="180">
-                </a>
-                <div class="caption">
-                    <a href="#">UZI</a>
-                </div>
-            </div>
-        </div>
-        <div class="col-sm-6 col-md-3">
-            <div class="thumbnail">
-                <a href="#" class="thumbnail">
-                    <img src="{{ url_for('static',filename='img/tmp/tmp_img.jpg') }}" alt="..." width="180" height="180">
-                </a>
-                <div class="caption">
-                    <a href="#">UZI</a>
-                </div>
-            </div>
-        </div>
-        <div class="col-sm-6 col-md-3">
-            <div class="thumbnail">
-                <a href="#" class="thumbnail">
-                    <img src="{{ url_for('static',filename='img/tmp/tmp_img.jpg') }}" alt="..." width="180" height="180">
-                </a>
-                <div class="caption">
-                    <a href="#">UZI</a>
-                </div>
-            </div>
-        </div>
-        <div class="col-sm-6 col-md-3">
-            <div class="thumbnail">
-                <a href="#" class="thumbnail">
-                    <img src="{{ url_for('static',filename='img/tmp/tmp_img.jpg') }}" alt="..." width="180" height="180">
-                </a>
-                <div class="caption">
-                    <a href="#">UZI</a>
-                </div>
-            </div>
-        </div>
+            {% endif %}
+        {% endfor %}
     </div>
     <div class="table-responsive table-ladder table_style">
         <table class="table table-stripped table-hover">