قائمة احترافيه جديده بتقنية هتمل

111
قائمة احترافيه جديده

قائمة احترافيه جديده بتقنية هتمل, قائمة خضراء يمكنك وضعها في منتصف الصفحة بالاعلى ليتمكن زوارك من الانتقال في صفحات الموقع بكل سهولة.

معاينة الكود

قائمة احترافيه جديده بتقنية هتمل

تركيب الكود

ضع الكود التالي في المكان الذي تود ان تظهره القائمة فيه

             <meta name="viewport" content="width=1000, initial-scale=1.0, maximum-scale=1.0" /> <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet" />    
<!--   Loading Bootstrap   -->    <link href="http://designmodo.github.io/Flat-UI/dist/css/vendor/bootstrap.min.css" rel="stylesheet" />     
<!--   Loading Flat UI   -->    <link href="http://designmodo.github.io/Flat-UI/dist/css/flat-ui.min.css" rel="stylesheet" />    <link href="http://designmodo.github.io/Flat-UI/docs/assets/css/demo.css" rel="stylesheet" />         <style type="text/css">
      .heyo{
  
      }
      
      .col-xs-6{
        float:center;
      }
      
      .btn-toolbar {
          position: fixed;
    top: 20%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
      
    </style>                                  
<div class="heyo">
    
   <div class="col-xs-6 col-xs-offset-1">
             <br /><br /><br />           
      <div class="row demo-navigation">
                       
         <div class="col-xs-6">
                            
            <div class="btn-toolbar" style="display:inline-block">
                                 
               <div class="btn-group">
                                     <a class="btn btn-primary active" href="رابط المنتدى" onclick="document.getElementById('minima').innerHTML=document.getElementById('posts').innerHTML"><em class="fa fa-home"></em></a>                  <a class="btn btn-primary" href="رابط 1"><em class="fa fa-user"></em></a>                  <a class="btn btn-primary" href="رابط  2"><em class="fa fa-heart"></em></a>                  <a class="btn btn-primary" href="رابط  3"><em class="fa fa-link"></em></a>                                    <a class="btn btn-primary" href="رابط  4"><em class="fa fa-comment"></em></a>                  <a class="btn btn-primary" href="رابط  5"><em class="fa fa-plus"></em></a>                  
               </div>
                               
            </div>
               
            <!--   /toolbar   -->             
         </div>
          
      </div>
                                  <script src="https://designmodo.github.io/Flat-UI/dist/js/vendor/jquery.min.js"></script>    <script src="https://designmodo.github.io/Flat-UI/dist/js/flat-ui.min.js"></script>    <script src="https://designmodo.github.io/Flat-UI/docs/assets/js/application.js"></script>          
   </div>
</div>
Motasem Hanani
WRITTEN BY

Motasem Hanani

مطور مواقع، مصمم، ممنتج وكاتب محتوى. اسعى الى تغذية المحتوى العربي التطويري والثقافي في كل ما هو حصري ومفيد بعيداً عن النقل العشوائي والبرامج القديمه التالفة.