Tools数据图片代码框架。

static/css/pictures.css

@@ -0,0 +1,25 @@
+
+    .example_box a {
+        text-decoration: none;
+        font-size: 14px;
+        color: #FFFFFF;
+        background: #1E9FFF;
+        text-align: center;
+        padding:15px;
+        border-radius: 2px;
+    }
+
+    .example_box img {
+        display: none;
+        width: 643px;
+        height: auto;
+        position: absolute;
+        /*如果大盒子不想被撑开高或者图片位置不是想要的位置，就给定位子绝父相，*/
+        left: 823px;
+        top: 85px;
+    }
+
+    .example_box a:hover>img {
+        /*鼠标放在a上图片显示*/
+        display: block;
+    }

templates/tools/blast.html

@@ -1,3 +1,5 @@
+<link href="/static/css/pictures.css" rel="stylesheet"/>
+
 <div class="layui-bg-gray" style="float: left; padding: 30px; width:45%">
 
     <div class="layui-panel">
@@ -22,6 +24,13 @@
                                     seq file
                                 </button>
 
+                                <div type="button" class="example_box" style="float: right;margin-top: 14px;" id="example_blast_seq">
+                                    <a href="#">
+                                        <span>example seq file</span>
+                                        <img src="/static/img_eg/ex_img/fasta.png" style="z-index: 999;" alt="Can't Display">
+                                    </a>
+                                </div>
+
                             </div>
                         </div>