频道选择 增加潮童 生活

@@ -88,15 +88,38 @@
            background-color: #000000;
            background-color: #000000;
 
 
            .index-channel-list {
            .index-channel-list {
-               padding-top: 50%;
-               width: 100%;
-               position: absolute;
-               top: 0;
+                padding-top: 50%;
+                width: 100%;
+                position: absolute;
+                top: -230rem / $pxConvertRem;
 
 
-               .homestyle {
+                .list-item {
+                    display: block;
+                    position: relative;
+                    margin: 0 auto 50rem / $pxConvertRem;
+                    width: 444rem / $pxConvertRem;
+                    height: 110rem / $pxConvertRem;
+                    text-align: center;
+                    font-size: 30rem / $pxConvertRem;
+                    line-height: 110rem / $pxConvertRem;
+                    color: #fff;
+                    background: #000;
+                    border: 5rem / $pxConvertRem solid #fff;
+                    font-weight: bold;
+                }
+                .lighter {
+                    font-weight: lighter;
+                }
+                .right-icon {
+                    position: absolute;
+                    right: 10rem / $pxConvertRem;
+                    top: 0;
+                    font-weight: bold;
+                }
+                .homestyle {
                   margin-bottom: 50rem / $pxConvertRem;
                   margin-bottom: 50rem / $pxConvertRem;
                   width: 287.3rem / $pxConvertRem;
                   width: 287.3rem / $pxConvertRem;
-              }    
+                }    
            }
            }
         }
         }
     }
     }

@@ -18,8 +18,10 @@
              <div class="index-channel">
              <div class="index-channel">
                    <img class="img" src="{{background}}" alt="">  
                    <img class="img" src="{{background}}" alt="">  
                    <div class="index-channel-list">
                    <div class="index-channel-list">
-                        <a href="/boys"><img class="homestyle" src="http://img10.static.yhbimg.com/adpic/2015/09/28/18/01bdbd27952eb5f780ac23641e70fd6e12.png"></a>
-                        <a href="/girls"><img class="homestyle" src="http://img13.static.yhbimg.com/adpic/2015/09/28/18/025a4056cad1c2b6704a5d7c83066a2d25.png"></a>
+                        <a href="/boys" class="list-item">男生 <span class="lighter">BOYS</span> <span class="iconfont right-icon">&#xe614;</span></a>
+                        <a href="/girls" class="list-item">女生 <span class="lighter">GIRLS</span> <span class="iconfont right-icon">&#xe614;</span></a>
+                        <a href="/kids" class="list-item">潮童 <span class="lighter">KIDS</span> <span class="iconfont right-icon">&#xe614;</span></a>
+                        <a href="/lifestyle" class="list-item">创意生活 <span class="lighter">LIFESTYLE</span> <span class="iconfont right-icon">&#xe614;</span></a>
                    </div> 
                    </div> 
                      
                      
              </div>
              </div>