ICECSS
/
index.html

<html>
 <head>
  <link rel="stylesheet" href="css/icecss.min.css" />
  <meta charset="utf-8" />
  <title>ICECSS</title>
  <style>

    </style>
 </head>
 <body>
  <header class="ice-menu ice-menu-lucency ice-menu-hover">
   <div class="ice-menu-logo">
    <img src="http://www.besdlab.cn/img/mlogo.png" style="height: 100%;" />
   </div>
   <nav class="ice-main-nav">
    <ul>
     <li><a href="http://www.besdlab.cn/">Home</a> </li>
     <li><a href="http://blog.besdlab.cn/">BLOG</a> </li>
     <li><a href="http://cloud.besdlab.cn/">CLOUD</a> </li>
     <li><a href="">ICECSS</a> </li>
     <li><a href="http://www.besdlab.cn/cdn/">CDN</a> </li>
    </ul>
   </nav>
  </header>
  <div class="ice-div ice-intro-big ice-center" id="putrue" style="background-image:url(img/icebg.jpg);height:80%">
   <div class="ice-center-abs">
    <h1 style="color:#fff;padding:50px 0">ICECSS is a simple css frame.</h1>
    <a href="https://github.com/T-baby/ICECSS/"><button class="ice-button-big ice-button-ghost" style="color: white;border-color: white;">Download</button></a>
   </div>
  </div>
  <div class="ice-div ice-div-1-1 ice-text-center" style="background: #f9f9f9;">
   <p>You can see more of document</p>
   <a href="docs/index.html"><button class="ice-button ice-button-mini">view document</button></a>
  </div>
  <div class="ice-div ice-div-1-1" style="margin-top:50px">
   <div class="ice-common">
    <div class="ice-div ice-div-1-3">
     <div class="ice-div ice-div-3-10">
      <h1 class="ice-icon-paper-plane"></h1>
     </div>
     <div class="ice-div ice-div-7-10 ice-div-last">
      <p class="ice-title">Light</p>
      <p>ICECSS is a light CSS 's framework .The core just only 70k.</p>
     </div>
    </div>
    <div class="ice-div ice-div-1-3">
     <div class="ice-div ice-div-3-10">
      <h1 class="ice-icon-rocket"></h1>
     </div>
     <div class="ice-div ice-div-7-10 ice-div-last">
      <p class="ice-title">Simple</p>
      <p>Easy to use and had little difficulty.</p>
     </div>
    </div>
    <div class="ice-div ice-div-1-3 ice-div-last">
     <div class="ice-div ice-div-3-10">
      <h1 class="ice-icon-life-bouy"></h1>
     </div>
     <div class="ice-div ice-div-7-10 ice-div-last">
      <p class="ice-title">Clean</p>
      <p>Using the namespace way to name, reduce pollution .</p>
     </div>
    </div>
   </div>
   <div class="ice-div ice-div-1-1" style="margin-top:40px">
    <div class="ice-common">
     <div class="ice-div ice-div-1-3">
      <div class="ice-div ice-div-3-10">
       <h1 class="ice-icon-cloud"></h1>
      </div>
      <div class="ice-div ice-div-7-10 ice-div-last">
       <p class="ice-title">Service</p>
       <p>The official offer cloud serving and CND to ICECSS .</p>
      </div>
     </div>
     <div class="ice-div ice-div-1-3">
      <div class="ice-div ice-div-3-10">
       <h1 class="ice-icon-magnet"></h1>
      </div>
      <div class="ice-div ice-div-7-10 ice-div-last">
       <p class="ice-title">Compatible</p>
       <p>Super strong compatibility, compatible with other mainstream CSS framework .</p>
      </div>
     </div>
     <div class="ice-div ice-div-1-3 ice-div-last">
      <div class="ice-div ice-div-3-10">
       <h1 class="ice-icon-users"></h1>
      </div>
      <div class="ice-div ice-div-7-10 ice-div-last">
       <p class="ice-title">Support </p>
       <p>If have any problem when you are using? Timely response within 24 hours .</p>
      </div>
     </div>
    </div>
   </div>
  </div>
  <script src="js/jquery.min.js"></script>
  <script src="js/icecss.js"></script>
  <style>

  .ice-common .ice-div-3-10{
    text-align: right;
  }
  .ice-common .ice-div-3-10 h1{
    color: #3598dc;
    padding-right: 20px;
  }
 .ice-div .ice-title{
     color: #3598dc;
     font-weight: bold;
     padding-left: 0;
     border-left: 0;
  }
.ice-common p{
  color: #7f8c8d;
  font-size: 13px;
}

@media (max-width: 768px){
  .ice-div-3-10{
    float: left;
width: 28.8%;
  }
  .ice-div-7-10{
        float: left;
width: 67.2%;
  }
}
</style>
 </body>
</html>