טבלה - אחד החשוב ביותר, אך באותו אלמנטים מורכבים הזמן, כי צריך להיות נוכח על דפי האינטרנט. בעזרתם הוא נוח ליישם מידע חשוב ושימושי בצורה תמציתית למדי. כמובן, רוב העורכים בתבניות, עובדים על מנועים שונים, באופן אוטומטי להוסיף טבלה באתר שלך או הפרסום נפרד, אבל מה אם משאב עיצוב האתרים, דפיו נוצרים מאפס? ואז אדון הטירון עשוי לקבל בעיה: כיצד להפוך טבלה ב- HTML. בוא נראה כמה מהר ובצורה נכונה ליצור את הפריט.
לבחור עורך
קודם כל, מתחיל ליצור טבלה, אתה צריך להגדיר את העורך שבו אתה תעבוד. כמובן, הדרך הקלה ביותר לבחור את התכנית שבה אתה יוצר קוד אתר בסיסי. אבל עדיף להשתמש למטרה זו את הפנקס הישן והטוב.
אתה יכול לשאול, למה לסבך את החיים שלך, כי אם אתה עושה הכל נכון בעורך, אז התוצאה ניתן לראות מיד, מדי, ואפילו מבקש את התוכנית להשתמש.
כן, זה נכון, אבל כדי ליצור טבלה מאפס, אתה לא רק להיות מסוגל לבחון את עקרון הבריאה שלה ביסודיות, אלא גם כדי למנוע שגיאות כתיב וטעויות מביכות בקוד הבסיסי. לפעמים זה קורה במקרה כי הסמן מועבר למטה, ואת התהליך של כתיבת קוד השגיאה זוחל פנימה, וזה לפעמים קשה למצוא. יצירת טבלה במחברת, אתה יכול להעתיק את הקוד ולהדביק אותו במקום הנכון בשבילך.
האלגוריתם ליצירת השולחן
כדי להתחיל, לעשות אלגוריתם קצר, איך לעשות טבלה ב- HTML. זו היא להבטיח כי אתה מבין את הרצף של כל שלב. ואז לנתח בדיוק איך לבצע כל אחד מהפריטים.
בואו נתחיל עם פעולות הכנה.
1. צייר סכמטית על תמונת שולחן נייר.
2. ספירת שורות תאים. אם מספר העבר שונה - לחשוב על כל ryadochka בנפרד.
3. קביעת מספר בתאים-כותרת שורה (למשל, «№» התא, "שם" ו- T. ד).
4. רשמו את הפרמטרים העיקריים של השולחן - יישור הצבע, הגובה והרוחב, טקסט - בקיצור, כל מה שאתה נראה בכושר.
ואז ללכת ישירות אל היצירה של הטבלה:
1. הכנס את שולחן התגים.
2. הכניסו את התגים של קווים מבוססים על הסכום שאתה צריך.
3. השורות להכניס תגיות של תאים (נורמלים רישיות), גם על בסיס הסכום אשר נרשם על נייר.
4. מגדירים את הפרמטרים לכל השולחן.
5. אם אתה צריך להגדיר פרמטרים עבור תאים בודדים.
6. מלא את טקסט התא שלנו.
ליצור טבלה
אז, אתה בוחר עורך, עכשיו בואו נראה איך אפשר ליצור טבלה ב- HTML. תג המאפשר שולחן (
) מוכנס לתוך קוד הדף הוא זיווג, כלומר, הבנייה שלנו מתחילה עם תג זה ומסתיימת .
הוספת טבלת התגים, להמשיך ליצור שורות תאים.
עכשיו, נציין, כי אלמנטים אלה גם יחד. תג
הגדרת מחרוזת, ו | - תאים.
לקבלה-תאים עליונים יש להשתמש אלמנטים לזווג | .
כפי שכבר הוזכר, הצעד הראשון הוא לצייר קו, אז הם צריכים לרשום תא. על מנת למנוע בלבול, כדאי לעשות שום ריפוד בין כל בלוק ב שורה או שתיים, או אחר כדי לקבוע אלמנטים בלוק חדש באמצעות מקש "Tab".
איך זה יכול להיראות? משהו כזה:
-
; -
; -
№ p / p ; -
שם ; - ;
-
; -
| 1 | ; -
איבנוב ; - ;
- .
כפי שאתה יכול לראות, דבר מסובך על זה. העיקר - לא ללכת לאיבוד בתוך מספר שורות התאים. אחרת, את השולחן מוטה.
אנחנו פורקים כדי ליצור טבלה ב- HTML, עכשיו אנחנו יכולים לעבור את הפרמטרים של שניהם מטריקס ושורות תאיו.
אפשרויות שולחן כאשר הקוד כתוב, יש צורך לשים לב לנקודות הבאות: יישור הטבלה ה- HTML, צבע הגבולות, הרקע, הטקסט, וכן הלאה.
הפרמטרים שצוינו בתג הטבלה . אלה כוללים:
גבול 1. - רוחב הגבול. מוגדרת על ידי מספר שלם. כברירת מחדל, גבולות טבלה כלשהי להיעלם.
2. Bordercolor - הצבע של הגבול. זה יכול להינתן כמו צבע הקסדצימלי (# 00008B), ושם על angliykom (כחול כהה). כברירת מחדל, הוא תמיד אפור.
3. bgcolor - צבע הרקע. כפי שצוין על ידי קוד או שם.
יישר 4. - ליישר טקסט לטבלה. ברירת מחדל - בצד שמאל. ישנן האפשרויות הבאות עבור פרמטר זה:
- שמאל - גלישה תקינה;
- תקין -obtekanie שמאלה;
- מרכז - טבלת הפלט באמצע עם שום זרם.
5. רוחב וגובה - רוחב וגובה של השולחן. זה יכול להיות או בפיקסלים או באחוזים (ביחס לגודל חלון הדפדפן).
Prescribing אינדיקציה מסוימת, אתה צריך להקדיש תשומת לב מיוחדת לעיצוב. בסיום קביעת הפרמטר ללכת סימן "שווה", שלאחריו במרכאות מציין ערך קבוע מראש.
ובאשר צבע הטקסט, ולאחר מכן לבצע את זה באותו אופן כמו טקסט רגיל בפורמט HTML.
דוגמה של שולחן:
-
; -
; -
№ p / p ; -
שם ; - ;
-
; -
| 1 | ; -
איבנוב ; - ;
- .
שורות פרמטרים אז אנחנו כבר הבנו איך לעשות טבלה ב- HTML ו- לקבוע הפרמטרים העיקריים שלה. אבל מה אם אנחנו צריכים להקצות מחרוזת? עזיבה שלה לא כגוף העיקרי של השולחן?
פרמטרי קו כתובים התג | באותו אופן כמו בטבלת הנתונים. כדי לרפד את המשתנים הבאים ניתן להגדיר:
1. כבר ידוע לך הגבול, bordercolor ו bgcolor.
יישר 2. - ליישר את הטקסט בשורה. זה יכול להיות מוגדר לשמאל, מרכז וימין.
3. valign - התג מיישר את הטקסט באופן אנכי. זה לוקח את הערכים הבאים:
- העליון - הטקסט את מיושר הגבול העליון;
- באמצע - באמצע;
- בתחתית - בקצה התחתון.
אישור קו דוגמה:
-
; -
№ p / p ; -
שם ; - .
תאי פרמטרים והדבר האחרון שאתה צריך לשים לב למי שרוצה לדעת איך לעשות טבלה ב- HTML - הפרמטרים של תאים בודדים, הן נורמלית הון. למעשה, הכל נעשה באותו אופן כמו שולחן או בשורה. מוסף רק שני אלמנטים חשובים:
1. colspan - פרמטר זה מציין את מספר העמודות שעבורן התא עשוי להאריך.
2. rowspan - כבר מציין את מספר השורות הכבושה על ידי התא הזה.
מאז העיצוב אינו שונה מקו המרשם, זה לא יביא בקוד לדוגמא.
ממצאים הכינו טבלה לא קשה כמו שזה אולי נראה במבט ראשון. העיקר בעת כתיבת הקוד שלה - התמדה ותשומת לב.
באשר כיצד להוסיף טבלה ב- HTML, אז מספר הקוד שלה הוא מספיק כדי להעתיק ולהדביק אותו לתוך המקום של הדף שלך, שבו, לדעתך, צריך להיות ממוקם.
אל תפחדו להתנסות, ועד מהרה אתה שולט באופן מושלם את הטכניקה של יצירת טבלאות. מזל טוב!
| |
| | |
| | | |
|