יצירת קשר עם חברת בניית אתרים צור קשר

 077-7644819
חייגו או השאירו הודעתכם

 
מאמרים אחרונים מאמרים אחרונים
15/02/2022 22:51
ככה תיבנו חנות וירטואלית מותאמת סלולר שתשפר את חוויית המשתמש ותגדיל את ההמרות.
03/02/2022 0:06
תקן HTML5 לצד הלקוח באתרי אינטרנט הוא התקן המוביל בימינו. קראו על היתרונות של התקן.
31/01/2022 15:40
בניית אתר אינטרנט בשפת צד השרת PHP היא בחירה חכמה בשפת פיתוח ותיקה, מובילה ומהירה.
תגובות אחרונות תגובות אחרונות
מדריך CSS - מתחילים
17/01/2022 19:35
היי, עיצוב עושים עם CSS, ולא ...
מדריך CSS - מתחילים
16/01/2022 20:41
האם יש אפשרות לעצב רקע בתוך דף...
מדריך CSS - מתחילים
18/11/2021 10:18
היי ינון, אתה צריך את הטקסט ש...
תגובות אחרונות פוסטים אחרונים בפורום
27/06/2022 23:53
שלום רב, ישנה בעיה קטנה בא...
27/06/2022 23:51
שלום! הבעיה שלי אסביר אותה הר...
27/06/2022 23:49
הי,כיצד כדאי להשקיע בשיווק של ...

תגיות div, span ומאפיינים חשובים

  1. דף הבית
  2. מדריך HTML5
  3. תגיות div, span ומאפיינים חשובים

תגית div, תגית span ומאפיינים מיוחדים שחשוב להכיר: id, class, style, title.

תגית div ומאפייני id ו-class

תגית מיוחדת היא תגית div. תגית זו למעשה מגדירה אלמנט שאיננו אלמנט "סטנדרטי" (כגון פיסקה, כותרת, טבלה, וכו'). למעשה, בקוד שלנו, רוב התגיות יהיו תגיות div ולא תגיות סטנדרטיות, כאשר אלו יציינו אובייקטים כמו: תפריט, לוגו, טופס צור קשר, וכו'.

כל תגית (בין אם תגית div או כל תגית אחרת), ניתן לאפיין באמצעות המאפיין id או המאפיין class. מאפיין id הינו בעל ערך יחודי לכל אלמנט, כלומר, לא יתכנו בקוד 2 אלמנטים שונים עם מאפיין id בעל אותו ערך. לעומת id, נוכל לאפיין מספר אלמנטים שונים באמצעות המאפיין class עם אותו הערך.

דוגמא:

<div id="main_menu">
    <div class="button">
        <div id="home">
        </div>
    </div>
    <div class="button">
        <div id="about">
        </div>
    </div>
    <div class="button">
        <div id="contact">
        </div>
    </div>
</div>

בדוגמא זו יצרנו "תפריט" עם 3 כפתורים. כל לחצן מאופיין באמצעות המחלקה (ה- class) שערכו button. כלומר יש 3 אלמנטים שהם עם class זהה. כל כפתור מאופיין בערך של id שיחודי רק לו.

המאפיינים class ו-id נחוצים על מנת להקל עלינו לאפיין קבוצות של אלמנטים או אלמנטים ספציפיים. באופן הזה, נוכל לאחר מכן להתייחס בקוד לאלמנטים אלו ביתר קלות. למשל, נוכל להגדיר אצלנו ב-CSS עיצוב שמאפיין את כל האלמנטים שערך ה- class שלהם button להיות אדומים (במילים אחרות: להגדיר כי כל הכפתורים יהיו אדומים).

תגית span

תגית זו מגדירה חלק מאלמנט על מנת לעצבו.

<div class="topic">
    This is example number <span class="number">seven</span> in the tutorial
</div>

כעת, ניתן להתייחס ספציפית למילה seven המאופיינת במחלקה number (למשל: נוכל ב-CSS לעצב מילה זו בכחול כהה).

מאפייני title, style

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

מאפיין title הינו מאפיין המקשר תאור לאלמנט. שימוש בו עבור אלמנט נתון, יוסיף ערך tool tip לאלמנט, באופן שהתאור יוצג בעת מעבר עכבר על אלמנט זה.

<div class="button" title="press this button to continue">
</div>

מאפיין style הינו מאפיין המקשר עיצוב ספציפי לאלמנט. מומלץ למעט בשימוש במאפיין זה, ולהעביר כל עיצוב לתוך קובץ CSS נפרד. כיום, רוב השימוש שנעשה באמצעות מאפיין style הוא עבור תוכן מעוצב שנערך על ידי עורך תוכן ונשמר בבסיס הנתונים, כאשר עיצוב האתר הכללי נלקח אך ורק מתוך קובץ CSS.

<div class="button" title="press this button to continue" style="color:#ff0000; background-color:#ffff00; text-align:center; font-size:18px;">
</div>

את ערכי ה-style האפשריים לא נלמד כרגע, כיוון שחשוב יותר להבין את הפונקציונאליות והסמנטיקה של השפה ורק לאחר מכן ללמוד את העיצוב.

 

הוספת תגובה
YouTube previewPlay

שנקפיץ יחד את העסק שלך לגבהים חדשים?

בניית חנות אינטרנטית של מיזם גרופ תעזור לך ביצירת סיסטם עוצמתי שמגדיל מכירות.

ההצלחה מבוססת על בניית חנות וירטואלית בחוד החנית עם הקמת מערך שיווק אפקטיבי שמגדיל חשיפה והמרות.

 

אל תהססו! מלאו את הטופס או התקשרו עכשיו 077-7644819

 
שנקפיץ לך את העסק?
לחץ כאן
התקשר עכשיו 077-7644819
או מלא את הטופס להלן: