כיצד להשתמש בצורה הטובה ביותר במאפייני טופס מתקדמים של HTML?



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

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

המצביעים הבאים יוסקרו במאמר זה,





אז בואו נתחיל במאמר זה,

תכונות טופס מתקדמות של HTML

HTML לבדו אינו יכול לעשות את הצדק עם כמה מהעיצובים האהובים ביותר שאנו רואים כיום. זה דורש עזרה וזה ניתן על ידי CSS אוֹ גיליון סגנון מדורג . ניתן להשתמש ב- HTML & CSS יחד ליצירת כמה דפי אינטרנט אטרקטיביים.



ממשיך במאמר זה על תכונות טופס מתקדמות של HTML

תגים ותכונות ב- HTML

שניהם הם יסודות ה- HTML ושניהם עובדים יחד אך מבצעים פונקציות שונות.

תגיות: תגים משמשים לסימון ההתחלה של אלמנט ה- HTML והוא מוקף בסוגריים הזוויתיים.



דוגמא:

דפוסי עיצוב ב- php לדוגמא

התג שלעיל הוא תג הכותרת ב- HTML.

מאפיינים: זהו המידע הנוסף אודות התגים ומצוין בתוך התג.



דוגמא:

 ”My

התג שלעיל הוא תג תמונה ו- alt הוא המאפיין של התג ומספק את התיאור לתמונה hello_world.jpg

כפי שדנו ביסודות הדרושים לנו, אז כעת נוכל להמשיך הלאה עם המניע של מאמר זה שהוא כמה תגי HTML ו- CSS מתקדמים.

ממשיך במאמר זה על תכונות טופס מתקדמות של HTML

תכונות מקסימום, מקסימום אורך ומינימום

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

מקסימום

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

הערה:

התכונה Max הוצגה עם HTML 5.

דוגמא:

מספר תלמידים:

קישור GistHub Gist:

לא ניתן להעלות את ערך התלמידים מעבר ל -50.

פלט - תכונות טופס מתקדמות ב- HTML - אדוריקה

הערה: פעולת התכונה של התג מציינת לאן יישלחו הנתונים שהוזנו להמשך התהליך. במקרה זה זהו submit_detail.php שהוא קובץ PHP.

מספר התלמידים הוא הפרט שיש להזין בתיבת הטקסט.

התכונה max בתג הראשון קובעת את הערך המספרי המקסימלי שניתן להזין בתיבת הטקסט, שהוא ערכים העולים על 50 לא יתקבל וזה המניע העיקרי של התכונה max.

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

דוגמא:

הזן את תאריך הלידה שלך בפורמט YYYY-MM-DD: 
מקס DOB: 2000-03-31

קישור GistHub Gist:

השתמשנו ב 31רחובמרץ 2000 כתאריך המקסימלי והאפשרות היא לוח שנה מוגבלת עד לתאריך זה בלבד.

בשדה קלט זה המשתמש לא יוכל להזין את התאריך שאחרי התאריך שצוין בתכונה max.

ממשיך במאמר זה על תכונות טופס מתקדמות של HTML

אורך מקסימלי

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

דוגמא:

הכנס שם משתמש:

קישור GistHub Gist:

מגבלת שדה הקלט היא 15 תווים, ולכן הקלט מוגבל ל -15 תווים בלבד.

תכונה זו של אורך מקסימלי בתג תגביל את המשתמש למסור קלט שאינו גדול מהערך שצוין שהוא 15.

הערה ערך ברירת המחדל של התכונה maxlength הוא 524288.

ממשיך במאמר זה על תכונות טופס מתקדמות של HTML

דקה

התכונה min מציינת את הערך המינימלי עבור הערך שיוזן בשדה הקלט.

דוגמא:

הזן את הגיל:

קישור GistHub Gist:

התכונה min בתג הקלט מגדירה שגיל הקלט לא יכול להיות פחות מ 18.

עֵצָה: אתה יכול להשתמש בתכונה min ו- max עם קלט כדי לספק לקלט טווח חוקי או טווח מקובל.

דוגמא:

הזן את הגיל:

קישור GistHub Gist:

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

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

עכשיו שאתה יודע מה זה HTML, בדוק את מאת אדוריקה. הדרכת הסמכת פיתוח אתרים תעזור לך ללמוד כיצד ליצור אתרים מרשימים באמצעות HTML5, CSS3, Twitter Bootstrap 3, jQuery ו- Google APIs ולפרוס אותו לשירות אחסון פשוט של אמזון (S3).

יש לך שאלה עבורנו? אנא הזכיר זאת בסעיף ההערות במאמר ונחזור אליך.