منتدى صانع القرار
اهلا وسهلا ضيفنا العزيز يسعدنا ويشرفنا تسجيلك معنا



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

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

avatar
العالمي
المراقب العام
المراقب العام
البلد :
المهنه :
المـزاج :
الجنس : ذكر
نقاط : 3728
المساهمات : 256
تقييم : 19

مُساهمةالعالمي في 7/28/2015, 7:53 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;            }            /**تقنية جديدة تجعل الاقسام الفرعية بشكل جذاب**/












































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

للمشاركة انت بحاجه الى تسجيل الدخول او التسجيل

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

التسجيل

انضم الينا لن يستغرق منك الا ثوانى معدودة!


أنشئ حساب جديد

تسجيل الدخول

ليس لديك عضويه ؟ بضع ثوانى فقط لتسجيل حساب


تسجيل الدخول

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