hits counter
الرئيسيةس .و .جبحـثالتسجيلدخول
دعم شباب الآن: لدينا 8248 موضوع ، و 1991 عضو ، آخر عضو مسجل : نغم سات فمرحباُ به.



شرح تغير لون روابط معينة بالتحكم في css
avatar
THE QM
إدارة الموقع
 
المشاركات : 7657
القسم المفضل : تطوير المواقع
سجل في : 13/06/2008
النقاط : 22
موضوع: شرح تغير لون روابط معينة بالتحكم في css



لنقل بأن لدينا قائمتين من الروابط لأصناف مختلفة من الثمار، الخضار والفواكه، القائمتين في ملف HTML ستكونان بهذا الشكل:


الكود:

   <p>الخضار:</p>
   <ul>
   <li><a href="ab.htm">يقدونس</a></li>
   <li><a href="cd.htm">جزر</a></li>
   <li><a href="ef.htm">خيار</a></li>
   </ul>

   <p>فواكه:</p>
   <ul>
   <li><a href="gh.htm">تفاح</a></li>
   <li><a href="ij.htm">أناناس</a></li>
   <li><a href="kl.htm">بطيخ</a></li>
   </ul>


نريد أن تكون قائمة روابط الخضروات باللون الأصفر، وقائمة الفواكه باللون الأحر وبقية الروابط تبقى باللون الأزرق.
لإنجاز هذا نقسم الروابط إلى مجموعتين، يمكن فعل ذلك بتحديد فئة لكل رابط باستخدام الخاصية class.
لنقم بتحديد فئات للمثال أعلاه:


الكود:

   <p>خضار:</p>
   <ul>
   <li><a href="ab.htm" [b]class="veg"[/b]>بقدونس</a></li>
   <li><a href="cd.htm" [b]class="veg"[/b]>جزر</a></li>
   <li><a href="ef.htm" [b]class="veg"[/b]>خيار</a></li>
   </ul>

   <p>فواكه:</p>
   <ul>
   <li><a href="gh.htm" [b]class="fru"[/b]>تفاح</a></li>
   <li><a href="ij.htm" [b]class="fru"[/b]>أناناس</a></li>
   <li><a href="kl.htm" [b]class="fru"[/b]>بطيخ</a></li>
   </ul>





يمكن الآن تحديد خصائص محددة للروابط التي تتبع فئة الخضروات أو الفواكه بهذا الشكل:



الكود:
a {
      color: blue;
   }

   a.[b]veg[/b] {
      color: #FFBB00;
   }

   a.[b]fru[/b] {
      color: #800000;
   }
   



كن بالقرب :
follow me @HDagash


التعليقات
لا يوجد حالياً أي تعليق

تفضّل شارك بتعليقك

دعم شباب  :: تطوير المواقع والمنتديات :: تطوير المواقع :: عالم الاكواد :: اكواد الـ html واكواد css موحدة لجميع النسخ-