ما هو id وما هو class والفرق بينهم
الرئيسيةCSSCSS3

ما هو id وما هو class والفرق بينهم

325x285
مساحة إعلانية

ما هو id وما هو class والفرق بينهم css, html, xml, php, blogger



السلام عليكم ورحمة الله وبركاته
درسنا اليوم من دروس دورة تعلم تقنية CSS وهو التعرف على الفئات والمعرفات id و class والفرق بينهم
728x90
الـ id و الـ class هما المعرفات الاساسية التي توضع داخل وسوم  HTML و XML لتتعرف عليها تقنية الـ CSS ويتاح لك التعديل على كل كبيرة وصغيرة بالموقع من خلفية للموقع واطارت و الوان للخطوط و الوان لكل شئ و خلفيات للصور و تحديد حجم الصور و الخطوط ايضاً وشكلها
باختصار تستطيع ان تقول ان تقنية الـ CSS مسئولة عن كل شئ مرتبط بشكل وتنسيق وتصميم الموقع.

إجابة سؤالنا, ما هو id وما هو class والفرق بينهم، التالي :
728x90
id يسمى مُعرف .. class يسمى فئة
id يمكن أن يندرج تحته فئات كثيرة ولا يمكن ان يتكرر اسمه .. class يمكن ان يتكرر اسمه مرات ومرات على عكس id
id يكتب قبله #  .. class يكتب قبله دائماً . نقطة ,, ودعونا نأخذ مثال عملي :

-id مكتوب في صفحة HTML:
<div id='welcome'>to MiniSoft</div>
-id مكتوب في صفحة CSS
  #welcome {
    color: #000;
    font: normal normal 12px Tahoma, Geneva, sans-serif;
  } 
نلاحظ أن id اصبح ( # ) وكتبت بجانبه welcome لأنها مكتوبة بجانب id في صفحة HTML

-class مكتوب في صحفحة HTML
<div class='mini'>soft</div>
-class مكتوب في صفحة CSS
  .mini {
    background-color: #CC0000;
    text-align: center;
  }
نلاحظ أن class اصبح نقطة ( . )  و كتبت بجانبها mini لأنها مكتوبة بجانب class في صفحة HTML

نأخذ مثال آخر على كيفية تكرار الفئة class :
<div class='mini'>ميني سوفت على تويتر</div>
<div class='mini'>ميني سوفت على جوجل كروم</div>
<div class='mini'>ميني سوفت ع الفيس بوك</div>
 كل هذه الوسوم المتشابهه تكتب في صفحة CSS هكذا:
  .mini {
    background-color: #CC0000;
    text-align: center;
  }
.إذاً فهمنا أن الوسم هو الملون و الذي يوجد بداخله كلمات كما رأينا, هذا بعكس المعرف id لا يمكن ان يتكرر نفس الوسم في نفس الصفحة او القالب كاملاً,,,

اتمنى ان تكون وصلت المعلومة والى اللقاء ان شاء الله في درس آخر من دروس الدورة 
السلام عليكم 
الرجاء مساعدتي على نشر الموضوع من خلال المشاركة على مواقع التواصل الإجتماعي بواسطة الأزرار اسفل التدوينة وجزاكم الله خيراً
تحميل...
الاسم

اخبار تقنية,54,أدوات بلوجر,13,اضافات بلوجر,14,أكواد,11,البلوجر,34,التنصيب الصامت,6,الربح من الانترنت,13,أندرويد,20,اندرويد,15,برامج الإنترنت,58,برامج البرمجة,23,برامج التنظيف,16,برامج التنظيف والتحسين,11,برامج الحماية,21,برامج الصوت والفيديو,15,برامج الصور,1,برامج الكمبيوتر,29,برامج الميديا,25,برامج متنوعة,38,برامج مجانية,106,برامج مدفوعة,23,بيتكوين,1,تطبيقات اندرويد,24,تمارين ومكملات,19,حماية,2,رياضة كمال الاجسام,23,سوفت وير,4,شرح الويندوز,36,شروحات البرامج,89,شروحات بلوجر,81,شروحات عامة,75,شروحات مواقع,67,شروحات وتعريب,13,شعر,1,صحة وجمال,28,عملات رقميه,7,قوالب بلوجر,4,قوالب معربة,3,موبايلات,27,ميكروسوفت اوفيس,4,blogger,82,blogger widgets,1,Cars,3,City,3,CSS,51,CSS3,47,Entertainment,4,Facebook,35,Fashion,7,featured,5,Foods,7,Gallery,6,Graphic Design,8,HTML,19,HTML 5,14,Motion Design,8,Movies,2,Music,12,Nature,6,People,11,Phone,5,php,1,Print Design,2,SEO,20,Server,2,Short,1,Sports,7,Technology,17,Test,1,Title,2,Travel,5,Update,4,Video,7,Web Design,9,Windows,52,Windows 10,3,Windows 7,21,
rtl
item
ميني سوفت: ما هو id وما هو class والفرق بينهم
ما هو id وما هو class والفرق بينهم
ما هو id وما هو class والفرق بينهم css, html, xml, php, blogger
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEip8FmGTV-36ti2Prr5u44Eg8RiS9m8v1wEB4nDeTilTAXohJ3sBWcLaXanYQeexfZHnuXuBep7aY3gKb1-KwCrOz5cW_ih-iiv-mtSKv9dWXY98LHeoAp7MicuAypHBoPf5qy6PGwnKloN/s1600/MiniSoft.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEip8FmGTV-36ti2Prr5u44Eg8RiS9m8v1wEB4nDeTilTAXohJ3sBWcLaXanYQeexfZHnuXuBep7aY3gKb1-KwCrOz5cW_ih-iiv-mtSKv9dWXY98LHeoAp7MicuAypHBoPf5qy6PGwnKloN/s72-c/MiniSoft.png
ميني سوفت
https://www.minisoftwre.com/2013/11/id-class.html
https://www.minisoftwre.com/
https://www.minisoftwre.com/
https://www.minisoftwre.com/2013/11/id-class.html
true
3808147084449263890
UTF-8
تحميل جميع الموضوعات لم يتم العثور على اي موضوعات عرض الكل إقرأ المزيد رد إلغاء الرد حذف بقلم الرئيسية الصفحات موضوع عرض الكل زوارنا اعجبهم ايضاً القسم الأرشيف بحث جميع الموضوعات لم يتم العثور على اي موضوع متطابق مع طلبك عودة للرئيسية الأحد الإثنين الثلاثاء الأربعاء الخميس الجمعة السبت Sun Mon Tue Wed Thu Fri Sat يناير فبراير مارس ابريل مايو يونيو يوليو اغسطس سبتمبر اكتوبر نوفمبر ديسمبر Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec الآن قبل دقيقة قبل $$1$$ دقيقة قبل ساعة قبل $$1$$ ساعة بالأمس قبل $$1$$ يوم قبل $$1$$ يوم قبل اكثر من 5 اسابيع متابعون متابعة هذا المحتوى مميز من فضلك شارك لإظهار المحتوى نسخ الكود تحديد تم نسخ الكود إلى الحافظة لم يتم النسخ، إضغط CRTL+C للنسخ او CMD+C إذا كنت تستخدم نظام الماك