منتديات الديسم
هذه النافذة تشير بأنك لم تسجل بعد في منتدانا
مالذي تنتظره ؟!!!
سيغيب كل من علاء و الزعيم عن المنتدى لما لايقل عن أسبوع لظروف عائلية فصبرا حتى عودتهم
المواضيع الأخيرة
➟ إختر لونك المفضل

[تم الحل] تعديل قالب footer


استعرض الموضوع السابق استعرض الموضوع التالي اذهب الى الأسفل

avatar
تشان
عضو جيد
البلد : dz
الجنس : ذكر
المساهمات : 95

مُساهمةتشان في 12.06.18 22:04

اهلا
بخصوص كود الروابط النصية في اسفل الذي اعطاه
لي الاخ الزعيم جزاه الله كل خيرا نجح لكنني لاحظت
انه احدث مشاكل بمنتدى و اتمنى تعديله و مشاكل هي
احدث خلل بصوت الموجود في المنتدى حيث انه يجعله يتكرر دون ان ينهي
و المشكل ثاني حقل تسجيل الدخول جعله ينحرف عن مكانه الاصلي
و المشكل الثالث قوانين القسم جعلها تنحرف الى اليسار اكثر مثل حقل الدخول
و هاته التي لاحظتها لانني عندما حذفته حلت هاته المشاكل
و عندما ارجته رجعت وهو كود رائع اتمنى تعديل فيه للتخلص من هاته المشاكل بذن الله 

الكود:
       <footer>
                <div class="right lists">
                    <ul class="list1">
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                    </ul>
                    <ul class="list1">
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                    </ul>
                    <ul class="list1">
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                    </ul>
                  
                </div>
                <div class="logo" alt="{L_INDEX}" title="{L_INDEX}"></div>
                <div class="social">
                    <ul>
                      <a href="https://www.fb.com" target="_blank" title="صفحتنا على فيس بوك"><li id="fb"></li></a>          
                      <a href="https://www.twitter.com/" target="_blank" title="صفحتنا على تويتر"><li id="tw"></li></a>            
                      <a href="https://www.youtube.com/" target="_blank" title="قناتنا على يوتيوب"><li id="yt"></li></a>          
                      <a href="http://www-msila-info.ahlamontada.com/" target="_blank" title="موقعنا"><li id="web"></li></a>
                    </ul>
                </div>
          </footer>
          <div class="foot">
              <p>جميع الحقوق محفوظة لـ: منتدى المسيلة التعليمي الجزائري {L_INDEX}</p>
          </div>
        
        <style>
          *{
          margin:0;
          padding:0;
          box-sizing:border-box;
        }
        .right{
          float:right;
        }
        .left{
          float:left;
        }
        footer{
          width:100%;
          height:330px;
          padding:50px;
          position:relative;
        
        }
        .logo{
          width:202px;
          height:64px;
          position:absolute;
          left:50px;
        }
        .lists ul{
          list-style:none;
        }
        .list1 {
          float:right;
          margin-left:30px;
        }
        .list1 li{
          display:block;
          padding:10px 30px;
          background-color:#6d4c4f;
          margin-bottom:10px;
          transition:all ease-in-out 0.3s;
          -webkit-transition:all ease-in-out 0.3s;
        }
        .list1 li:hover{
          padding:10px 40px;
        }
        ul.list1 a {
            color: #fff;
        }
        .list1 a{
          text-decoration:none;
          color:#fff;
        }
        .social{
                margin: 90px 0 0 30px;
            display: inline-block;
            float: left;
            position: relative;
            top: -30px;
        }
        .social li{
          display:inline-block;
          float:left;
          transition:all .2s ease-in-out;
          -webkit-transition:all ease-in-out 0.2s;    
        }
        #web{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:0px 0px;
        }
        #web:hover{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:0px -33px;
        }
        #yt{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:-98px 0px;
        }
        #yt:hover{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:-98px -33px;
        }
        #tw{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:-195px 0px;
        }
        #tw:hover{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:-195px -33px;
        }
        #fb{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:-226px 0px;
        }
        #fb:hover{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:-226px -33px;
        }
        .foot{
          height:50px;
          padding:0 70px;
          position:relative;
        }
        .foot p{
          text-align:right;
          color:#fff;
          font-size:14pt;
          line-height:0px;
          position: absolute;
            top: 25px;
            right: 70px;
        }
        .foot h5{
          display:inline-block;
          margin-left:10px;
          color:#fff;
          line-height:50px;
          float:left;
        }
        .copy{
          background-image: url(https://i.imgur.com/c9YfuHe.png);
            width: 65px;
            height: 65px;
            float: left;
            left: -200px;
            position: relative;
        }
        </style>


عدل سابقا من قبل تشان في 12.06.18 23:51 عدل 1 مرات
avatar
alla13
المدير
البلد : dz
الجنس : ذكر
المساهمات : 3126
http://alla13.blogspot.com

مُساهمةalla13 في 12.06.18 23:35

جربيه الان
الكود:
        <footer>
                <div class="right listz">
                    <ul class="listz">
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                    </ul>
                    <ul class="listz">
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                    </ul>
                    <ul class="listz">
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                      <li><a href="#" alt="رابط نصي" title="رابط نصي">رابط نصي</a></li>
                    </ul>
               
                </div>
                <div class="logoz" alt="{L_INDEX}" title="{L_INDEX}"></div>
                <div class="social">
                    <ul>
                      <a href="https://www.fb.com" target="_blank" title="صفحتنا على فيس بوك"><li id="fb"></li></a>       
                      <a href="https://www.twitter.com/" target="_blank" title="صفحتنا على تويتر"><li id="tw"></li></a>         
                      <a href="https://www.youtube.com/" target="_blank" title="قناتنا على يوتيوب"><li id="yt"></li></a>       
                      <a href="http://www-msila-info.ahlamontada.com/" target="_blank" title="موقعنا"><li id="web"></li></a>
                    </ul>
                </div>
          </footer>
          <div class="foot">
              <p>جميع الحقوق محفوظة لـ: منتدى المسيلة التعليمي الجزائري {L_INDEX}</p>
          </div>
     
        <style>
        footer{
          margin:0;
          padding:0;
          box-sizing:border-box;
        }
        footer{
          width:100%;
          height:330px;
          padding:50px;
          position:relative;
     
        }
        .logoz{
          width:202px;
          height:64px;
          position:absolute;
          left:50px;
        }
        .listz ul{
          list-style:none;
        }
        .listz {
          float:right;
          margin-left:30px;
          padding: 1px;
        }
        .listz li{
          display:block;
          padding:10px 30px;
          background-color:#6d4c4f;
          margin-bottom:10px;
          transition:all ease-in-out 0.3s;
          -webkit-transition:all ease-in-out 0.3s;
        }
        .listz li:hover{
          padding:10px 40px;
        }
        ul.listz a {
            color: #fff;
        }
        .listz a{
          text-decoration:none;
          color:#fff;
        }
        .social{
                margin: 90px 0 0 30px;
            display: inline-block;
            float: left;
            position: relative;
            top: -30px;
        }
        .social li{
          display:inline-block;
          float:left;
          transition:all .2s ease-in-out;
          -webkit-transition:all ease-in-out 0.2s; 
        }
        #web{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:0px 0px;
        }
        #web:hover{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:0px -33px;
        }
        #yt{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:-98px 0px;
        }
        #yt:hover{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:-98px -33px;
        }
        #tw{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:-195px 0px;
        }
        #tw:hover{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:-195px -33px;
        }
        #fb{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:-226px 0px;
        }
        #fb:hover{
          width:33px;
          height:33px;
          background-image:url('http://i35.servimg.com/u/f35/19/45/12/26/social10.png');
          background-position:-226px -33px;
        }
        .foot{
          height:50px;
          padding:0 70px;
          position:relative;
        }
        .foot p{
          text-align:right;
          color:#fff;
          font-size:14pt;
          line-height:0px;
          position: absolute;
            top: 25px;
            right: 70px;
        }
        .foot h5{
          display:inline-block;
          margin-left:10px;
          color:#fff;
          line-height:50px;
          float:left;
        }
        .copy{
          background-image: url(https://i.imgur.com/c9YfuHe.png);
            width: 65px;
            height: 65px;
            float: left;
            left: -200px;
            position: relative;
        }
        </style>




توقيعalla13



صفـحتنا على الفايسبوك


قناتنا على اليوتيوب
    
avatar
تشان
عضو جيد
البلد : dz
الجنس : ذكر
المساهمات : 95

مُساهمةتشان في 12.06.18 23:50

شكرا شكرا شكرا لقد نجح اخي علاء جزاك الله كل خير
avatar
alla13
المدير
البلد : dz
الجنس : ذكر
المساهمات : 3126
http://alla13.blogspot.com

مُساهمةalla13 في 12.06.18 23:55

[sol]ينقل لارشيف المواضيع المحلولة[/sol]




توقيعalla13



صفـحتنا على الفايسبوك


قناتنا على اليوتيوب
    

استعرض الموضوع السابق استعرض الموضوع التالي الرجوع الى أعلى الصفحة

أفتح حسابا أو أدخل لحسابك

يتوجب عليك أن تكون عضوا لتترك ردا

إفتح حسابا في منتدانا

إنضم لأسرتنا لنشارك خبراتنا ومعارفنا مع بعض


قم بتسجيل

تسجيل الدخول

أتمتلك حسابا قم بتسجيل الدخول من هنا


أدخل

 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى