שימוש בבוררים מסוג Class ו – ID

במדריך CSS למתחילים הצגתי בוררים המתייחסים לאלמנטים של HTML בלבד, אך באפשרותך להגדיר בוררים משלך בעזרת שימוש ב – Class ו – ID.

היתרון בכך שהוא שאתה יכול להציג קוד HTML דומה במספר בלתי מוגדל של אופנים.

ב- CSS, הבורר Class מוגדר על ידי שם כלשהו בצירוף נקודה מקדימה (.) והבורר ID מוגדר על ידי שם כלשהו בצירוף סולמית מקדימה(#). לדוגמא :

  1. #top {
  2.     background-color: #ccc;
  3.     padding: 1em
  4. }
  5. .intro {
  6.     color: red;
  7.     font-weight: bold;
  8. }

על מנת לשייך את הקוד הנ"ל לאלמנטים של HTML עליך לעבוד Class ו – ID בצורה הבאה :

  1. <div id="top">
  2.     <h1>מדריך CSS למתקדמים</h1>
  3.     <p class="intro">זהו המדריך הטוב ביותר באינטרנט !</p>
  4.     <p class="intro">כן, הכי טוב שיש. </p>
  5. </div>

ההבדל בין ID ל – Class הוא שניתן להשתמש ב – ID על מנת להגדיר אלמנט בודד לעומת Class שניתן להגדיר באמצעותו אלמנטים רבים.

עמודים רלוונטים