כיצד להשתמש בתג HR עבור מסמך אינטרנט
תג HR משמש באופן מסורתי להוספת שורה אופקית (הנקראת לעיתים כלל אופקי) למסמך אינטרנט. כדי להוסיף שורה, אתה מקליד:
כדי להורות לדפדפן לצייר קו על פני הרוחב המלא של הדף או אלמנט האב באמצעות הגדרות ברירת המחדל. קו ברירת המחדל הוא פשוט ולעתים קרובות משרת את מטרתו, אך ניתן להקצות תכונות לשינוי גודל הקו, צבעו ומיקומו בין מאפיינים אחרים. השיטה לשינוי המראה של שורה אופקית השתנתה בין HTML4 ו- HTML5 .
האם תג סמנטיק HR?
ב- HTML4, תג ה- HR לא היה סמנטי. אלמנטים סמנטיים מתארים את משמעותם במונחים של הדפדפן והיזם יכולים בקלות להבין. תג ה- HR היה רק דרך להוסיף שורה פשוטה למסמך בכל מקום שתרצה. עיצוב רק את הגבול העליון או התחתון של האלמנט שבו אתה רוצה את הקו יופיע להציב שורה אופקית בחלק העליון או התחתון של האלמנט, אבל באופן כללי, תג HR היה קל יותר לשימוש למטרה זו.
החל מ- HTML5, תג ה- HR הפך לסמנטי, והוא מגדיר כעת הפסקה ברמת נושא ברמת הפסקה, שהיא הפסקה בזרימה של התוכן שאינה מצדיקה דף חדש או מחלף חזק יותר - זהו שינוי נושא . לדוגמה, ייתכן שתמצא תג HR לאחר שינוי סצינה בסיפור, או שהוא עשוי להצביע על שינוי הנושא במסמך הפניה.
תכונות HR ב- HTML4 ו- HTML5
ב- HTML4, תג ה- HR יכול להקצות תכונות פשוטות, כולל "יישור", "רוחב" ו- "noshade". ניתן להגדיר את היישור לשמאל, למרכז, לימין או להצדיק. הרוחב התאים את רוחב הקו האופקי מ -100% ברירת המחדל שהרחיבה את הקו לאורך הדף. תכונה noshade שניתנו קו צבע מוצק במקום צבע מוצל. תכונות אלה מיושנות ב- HTML5, ועליך להשתמש ב- CSS כדי לסמן את תגי ה- HR שלך ב- HTML5. לדוגמה, ב- HTML 4:
מייצר קו אופקי בגובה של 10 פיקסלים.
באמצעות CSS עם HTML5, קו אופקי גבוה 10 פיקסלים הוא מנוסח:
באמצעות CSS בסגנון קו אופקי שלך נותן לך הרבה חופש בעיצוב דף האינטרנט שלך. אתה יכול לראות דוגמאות רבות של סגנונות עבור תגי HR בסגנון זה תג תג HR . רק סגנונות הרוחב והגובה יהיו עקביים בכל הדפדפנים, לכן ייתכן שיהיה צורך בניסוי ובשגיאה בעת שימוש בסגנונות אחרים. רוחב ברירת המחדל הוא תמיד 100 אחוז מהרוחב של דף האינטרנט או אלמנט ההורה. גובה ברירת המחדל של הכלל הוא שני פיקסלים.