אינטרנט ישראל
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
ראשי » פיתוח אינטרנט » פתרונות ומאמרים על פיתוח אינטרנט » שתי תגיות HTML נדירות אך שימושיות להפליא

שתי תגיות HTML נדירות אך שימושיות להפליא

רן בר-זיק מרץ 25, 2009 12:26 pm אין תגובות

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

כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.

שתי תגיות שימושיות להפליא שממעטים להשתמש בהן הן WBR ו-NOBR. שתיהן אינן תקניות מבחינת ה-W3C וכנראה שגם לא יהיו תקניות בתקן HTML 5 אך כמעט כל דפדפני האינטרנט תומכים בהן והן יכולות להיות מאד שימושיות באתר אינטרנט שיש בו טקסטים ארוכים שאסור שיישברו או שצריך שבירה.

על מנת להבין מה התפקיד שלהן, בוא ונניח שיש לנו אתר אינטרנט עם טקסט בעל משפטים ארוכים כמו למשל הטקסט הזה:

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

נניח שאני מעוניין שהטקסט הנלוז לעיל לא יישבר, כל מה שעלי לעשות זה להקיפו בתגית <nobr>.

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


<nobr>אתר אינטרנט טוב הוא אתר אינטרנט שבנוי היטב, אתר אינטרנט שנבנה היטב הוא אתר אינטרנט שנבנה על ידי בונה אתרי אינטרנט שיודע לבנות אתר אינטרנט. באתר אינטרנט אסור שיהיה ספאם אבל הטקסט הזה שמוצב באתר האינטרנט על ידי בונה אתר האינטרנט נראה כמו ספאם.</nobr>

הטקסט הזה לא נשבר ומתנהג בדיוק כמו שורה ארוכה מאד ללא רווחים, במקרה של העיצוב הנוכחי של אינטרנט ישראל, השורה בעצם 'מוסתרת' על ידי הגבול של div הטקסט. אך בעיצובים אחרים זה לא יהיה כך.

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

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


<nobr>אתר אינטרנט טוב הוא אתר אינטרנט שבנוי היטב.<wbr> אתר אינטרנט שנבנה היטב הוא אתר אינטרנט שנבנה על ידי בונה אתרי אינטרנט שיודע לבנות אתר אינטרנט.באתר אינטרנט אסור שיהיה ספאם אבל הטקסט הזה שמוצב באתר האינטרנט על ידי בונה אתר האינטרנט נראה כמו ספאם.</nobr>


כמובן שלא חייבים להשתמש ב-wbr רק בתוך nobr, אפשר להשתמש בו בכל טקסט והוא שימושי במיוחד בעיצובים שבהם המקום שמוקצה לטקסט משתנה לפי הרזולוציה של המסך ויש חשש שהטקסט יישבר בצורה מוזרה (כמו למשל באמצע מילת חיבור).

התגיות האלו לא סטנדרטיות אך נתמכות ברוב הדפדפנים. לאופרה וספארי יש קצת בעיה עם wbr: אופרה כלל לא תומך בתגית הזו וספארי לפעמים מפרש אותה בצורה מוזרה. ניתן להשתמש ב-&shy; במקום wbr. המינוס הוא ש-&shy; מתורגם למקף במקרה ויש שבירה.

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

כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.
מידע למפתחים עיצוב אתרי אינטרנט
ללמוד ג'אווהסקריפט בעברית

ללמוד לתכנת ג'אווהסקריפט בעברית שגייס יותר משלוש מאות אלף שקל ולמעלה מ-2000 תומכים - בואו ללמוד עכשיו איך לתכנת.

רשימת הנושאים
  • מדריכים
    • ריאקט
    • טייפסקריפט
    • ECMAScript 6
    • ES20XX
    • Node.js
    • Express
    • רספברי פיי
    • Babel
    • docker
    • MongoDB
    • Git
    • לימוד MySQL
    • SASS
    • jQuery
    • CSS3
    • HTML 5
    • SVN
    • LESS
  • פיתוח אינטרנט
    • פתרונות ומאמרים על פיתוח אינטרנט
    • jQuery Scripts
    • jQuery למתקדמים
    • יסודות בתכנות
    • נגישות אינטרנט
  • חדשות אינטרנט
  • מידע כללי על אינטרנט
    • רשת האינטרנט
    • בניית אתרי אינטרנט
  • rss logo

    לכל המאמרים

    לכל המאמרים שפורסמו באינטרנט ישראל משנת 2008 ועד עכשיו.
  • rss logo

    RSS Feed

    משתמשים בקורא RSS? אם כן, עקבו אחרי אינטרנט ישראל באמצעות פיד ה-RSS!
    מה זה RSS?
  • Twitter logo

    עקבו אחרי בטוויטר

    בחשבון הטוויטר שלי אני מפרסם עדכונים מהירים על חדשות בתחום התכנות והיזמות, התרעות על מצבי חירום ורכילות בוערת על תחום הווב.
    מה זה טוויטר?
  • facebook like image

    ערוץ הטלגרם של אינטרנט ישראל

    בערוץ הטלגרם של אינטרנט ישראל אני מפרסם את הפוסטים של באתר וכן עדכונים טכנולוגיים נוספים.
    מה זה טלגרם?
  • github logo

    הפרויקטים שלי בגיטהאב

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

כל הזכויות שמורות לרן בר-זיק ולאינטרנט ישראל | מדיניות הפרטיות של אתר אינטרנט ישראל | אתר אינטרנט ישראל נגיש לפי תקן WCAG 2.0 AA | הצהרת הנגישות של האתר | אבטחת מידע ודיווח על בעיית אבטחת מידע

גלילה לראש העמוד