أهلا وسهلا بك يا زائر في منتديات ملوك النوبه
 
الرئيسيةس .و .جبحـثالتسجيلدخول
ادارة منتديات ملوك النوبه ترحب بجميع الزوار ونتمنى لهم الإنتساب إلينا وكذالك نرحب بالأعضاء اللذين منتسبين لدينا
ونأمل أن يستمتعوا معنا ويستفيدومن المنتدى ويفيدوا منتدانا مع خالص تحياتى * إدارة المنتدى *

شاطر | 
 

 تقنية جديدة تجعل الاقسام الفرعية بشكل جذاب

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

الجنس : انثى
الدولة : مصر

الهواية : الكتابة
السٌّمعَة : 0
المساهمات : 10
نقاط : 764
تاريخ التسجيل : 15/03/2017

مُساهمةموضوع: تقنية جديدة تجعل الاقسام الفرعية بشكل جذاب   الثلاثاء مارس 21, 2017 10:15 pm

تقنية جديدة تجعل الاقسام الفرعية بشكل جذاب
الكود هو عبارة عن شكل جديد لاقسام الفرعية في المنتدى

صوره كمثال

نتوجه الى:




[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]


لوحة الاداره >> ادارة عامة >> منتدى >> المنتديات والفائات>> 
وندخل الى اى قسم ونضغط على ايقونة تعديل ,
مثال؟


[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]

     
الكود: [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]---------تضليل المحتوى
الكود:
  <table>
                                         
           <tbody>
              <tr>
                                           
                 <td>
                                                    
                    <div class="desc10">
                                                             
                       <div class="class1">
                                                  <a href="رابط القسم"><span style="color: #FFFFFF;
         font-weight: bold;"> اسم القسم </span></a><br />                    
                       </div>
                                                           
                       <div class="class1">
                                                  <a href="رابط القسم"><span style="color: #FFFFFF;
        font-weight: bold;"> اسم القسم </span></a><br />                    
                       </div>
                                                     
                       <div class="class1">
                                                  <a href="رابط القسم"><span style="color: #FFFFFF;
        font-weight: bold;"> اسم القسم </span></a><br />                    
                       </div>
                                                     
                       <div class="class1">
                                                  <a href="رابط القسم"><span style="color: #FFFFFF;
        font-weight: bold;"> اسم القسم </span></a><br />                    
                       </div>
                                                         
                       <div class="class1">
                                                  <a href="رابط القسم"><span style="color: #FFFFFF;
         font-weight: bold;"> اسم القسم </span></a><br />                    
                       </div>
                                                           
                    </div>
                                                  
                 </td>
                                           
                 <td>
                                                    
                    <div class="desc9">
                                                             
                       <div class="class1">
                                                  <a href="رابط القسم"><span style="color: #FFFFFF;
        font-weight: bold;"> اسم القسم </span></a><br />                    
                       </div>
                                                         
                       <div class="class1">
                                                 <a href="رابط القسم"><span style="color: #FFFFFF;
         font-weight: bold;"> اسم القسم </span></a><br />                  
                       </div>
                                                      
                       <div class="class1">
                                                  <a href="رابط القسم"><span style="color: #FFFFFF;
        font-weight: bold;"> اسم القسم </span></a><br />                    
                       </div>
                                                     
                       <div class="class1">
                                                  <a href="رابط القسم"><span style="color: #FFFFFF;
        font-weight: bold;"> اسم القسم </span></a><br />                    
                       </div>
                                                         
                       <div class="class1">
                                                  <a href="رابط القسم"><span style="color: #FFFFFF;
        font-weight: bold;"> اسم القسم </span></a><br />                    
                       </div>
                                                           
                    </div>
                                                  
                 </td>
                                         
              </tr>
                                      
           </tbody>
        </table


        
ثم نضع الكود التالى 
اذا ارت ذيادة عدد الاقسام يمكنك تزويده بهذا الكود 
الكود: [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]---------تضليل المحتوى
الكود:

                       <div class="class1">
                                                  <a href="رابط القسم"><span style="color: #FFFFFF;
        font-weight: bold;"> اسم القسم </span></a><br />                    
                       </div>



لأن نتوجه الى:




 ورقة تصميم css
لوحة الاداره >> مظهر المنتدى >> الصور والألوان >> ألوان >> ورقة تصميم css
تعطيل كود ال CSS الأصلي: لا
تفعيل نظام تحسين مردودية ال CSS المشخص: نعم
ثم اضف هذا الكود الى ورقة تصميم css 
     
الكود: [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]---------تضليل المحتوى
الكود:
/**تقنية جديدة تجعل الاقسام الفرعية بشكل جذاب**/
          .class1 {
          opacity: 0.8;
          width: 120px;
          margin-bottom: 2px;
          -webkit-transition: all 0.4s linear;
          background-color: #096EA1;
          font-family: bold;
          font-size: 10.5px;
          padding: 2px 0px 2px 10px;
          line-height: 120%;
          border-right: 15px solid #454C1F;
          border-radius: 30px 30px 30px 30px;
          list-style-type: none;
          text-align: right;
        }
            .class1:hover{
            opacity:1;
            border-left:30px solid #454C1F7;/*لون جنب اليسار*/
            background-color:#075A96;/*لون خلفية عند مرور الماوس على اسم القسم */
            border-radius:30px 30px 30px 30px;
            color: #000;
            }
            .desc9 {
          width: 140px;
          height: 80px;
          /* margin-top: -25px; */
          padding: 20px display: block;
          margin-left: 15px;
        }
            .desc10 {
            width: 140px;
            height:54px;
            margin-top: -25px;
            padding: 20px;
            display: block;
            }
            /**تقنية جديدة تجعل الاقسام الفرعية بشكل جذاب**/



تم الشرح بواسطتى
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
المتطوع المساعد




ارجوا ان اكون قد افدتكم
انتهي الموضوع




الرجوع الى أعلى الصفحة اذهب الى الأسفل
 
تقنية جديدة تجعل الاقسام الفرعية بشكل جذاب
استعرض الموضوع السابق استعرض الموضوع التالي الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1

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