1.
פקודה של כותרת. כל כותרת שתרצו בתוך העמוד שלכם תהיה בתוך הפקודה הזאת. דוגמא:
3.
BODY - זהו בעצם תוכן המסמך שלכם. רוב התכנים והפקודות שאינם קושורות להגדרות על הדף כולו יהיו בתוך הפקודה הזאת. דוגמא:
קוד PHP:
<body>
so this is where you start..good for you
</body>
גופנים, טקסט וכל מה שקשור
1.
גודל הטקסט- בין אם מדובר בכותרת (HEAD) או בסתם טקסט תוכן. קרוב לוודאי שתצרו להיות מסוגלים לשנות את גודלם. בעיקר בכותרות.
ישנם שתי פקודות לשינוי גודל הטקסט:
א
. H - בעזרת פקודה זו נוכל לשנות את גודל הטקסט בין 1 ל-6 ע"י הצמדת המספר ל-H. כש1 זה הכי
גדול ו-6 הוא הכי
קטן.
דוגמא:
קוד PHP:
<h3>this is a mid size text</h3>
ב.
FONT SIZE - פקודה דומה, רק שכאן מדובר בגדלים מ-1 עד -7. כשהכי גדול זה 7. (הערה: שימו לב שכל פקודה שיש בה את המילה FONT נסגרת באותה צורה, את זה תבינו אח"כ). דוגמא:
קוד PHP:
<font size=7>this is large text</font>
2.
צבע טקסט - נעשה בעזרת פקודת FONT COLOR=000000 כשהמספרים מהווים קוד . לכל צבע יש קוד משלו. לרישמת הקודים של כל צבע עיינו פה:
http://html-color-codes.info/
דוגמא:
קוד PHP:
<font color=#FF0000>anything in here will be in red</font>
כל מה שיהיה בין פקודת הפתיחה והסיגרה של פקודה זו יהיה בצבע אדום.
3.
אות מודגשת - פקודה פשוטה שגורמת לכל מה שנמצא בין תחומיה להיות מודגש:
B. דוגמא:
קוד PHP:
<b>this word is in bold</b>
כמו שבטח הבנתם לבד, כל מה שנמצא בין תחומי הפקודה יהיה מודגש
4.
כתב נטוי - פקודה ליצירת אותיות נוטה באלכסון :
I. דוגמא:
קוד HTML:
<i>this is another text option</i>
5.
סוגנון פונט - פקודה שתגרום לשינוי בסוג הגופן:
FONT FACE.
דוגמא:
קוד HTML:
<font face="arial">now anything in here is in arial font</font>
כעת כל מה שנמצא בתוך הפקודה הזו יהיה בפונט ARIAL, שימו לב שבבחירת הפונט יש לשים מרכאות כפולות:
"שם פונט
".
------------------------
שיעור 2:
לינקים-קישורים
כל דף אינטרנט לא שווה כלום ללא היכולת לעבור מעמוד לעמוד (או למקומות בתוך העמוד).
בדף HTML יש אפשרות לתייג פקודת קישור בתוך כמעט כל דבר (טקטסט, תמונה וכו'..). כאשר יוצרים פקודת קישור יש לדעת את שמו
המדוייק של העמוד שאליו הקישור מכוון ובמידה והדף נמצא באותו שרת/מחשב אבל בתוך תקייה, יש לציין את המיקום המדוייק של הקובץ. פקודת קישור נעשית בעזרת
A HREF
1. "
A HREF="nextpage.html - פקודה זו מייצרת קישור לעמוד אחר
דוגמא:
קוד HTML:
<a href="page2.html">click here to go to my next page</a>
בדוגמא זו, התוצאה תהיה שלחיצה על click here to go to my next page, תגרום למעבר לעמוד שנקרא PAGE2.HTML - כמובן שאם עוד לא יצרתם כזה דף, הקישור לא יעבוד

. הערה: לא לשכוח מרכאות
"-" לפני ואחרי שם העמוד!
2.
"A HREF="#PLACEinTHISpage - פקודה זו תגרום למעבר לתוך מקום מוגדר מראש בתוך אותו עמוד, ידוע גם כעוגן. המבנה הוא די פשוט. אותה פקודה כמו מעבר לעמוד אחר, רק שלאחר המרכאות יש לרשום את הסימן
#. ולאחר מכן את שם העוגן שיצרתם (לא לשכוח מרכאות!)
יצירת עוגן (המקום עליו לחיצה על הקישור שנעשה בעזרת הפקודה הנ"ל יקפוץ עליו)-
"A NAME ="PLACEinTHISpage.
דוגמא:
קוד HTML:
<a href="#middlepage"></a>
קוד HTML:
<a name="middlepage></a>
בדוגמא הנ"ל יצרנו פקודה שכל לחיצה על הטקסט/תמונה שיהיה בין הפתיחה לסגירה יביא לקפיצת העמוד למיקום שבו הגדרנו את העוגן שלנו, שלצורך הדוגמא הוא במרכז העמוד..
שיעור 3:
סדרות ורשימות
סדרות ורשימות:
ישנם שני סוגי רשימות, סדרות לפי סדר מספרי או ללא סדר משפרי (כלומר רק לי כל נתון יופיע עיגול/ריבוע וכו'...)
1. ע"מ ליצור רשימה ממוספרת יש לפתוח את הפקודה
OL וכל נתון ברשימה יהיה לפני
LI. דוגמא:
קוד HTML:
<ol>
<li>object 1
<li>onject 2
<li>object 3
</ol>
זהו לבנתיים, תרגלו את זה. עד שאני יעדכן שוב..
בפועל זה יראה משהו כזה:
- object 1
- object 2
- object 3
ניתן ךקבוע מאפיינים שונים לאופן הצגת המספור, ע"י הוספת TYPE=X
לפקודת הOL בתוך התגיות (X= סוג הרשימה הממסופרת)
סוגים שונים לעיצוב ברשימה הממוספרת:
type=I - מספר רומי גדולות
type=i -מספר רומי קטן
type=A- מספור בעזרת אותיות גדולות
type=a - מספור בעזרת אותיות קטנות
type=1 - מספור עשרוני
start=x - פקודה זו תגרום לרשימה להתחיל את המספור מהמספר שאתם קובעים (במקום הX ) (תודה לעמלנט על הרשימה)
דוגמא לשימוש בסגנון מסויים ברשימה ממוספרת:
קוד HTML:
<ol type=I start=2>
<li>object 1
<li>onject 2
<li>object 3
</ol>
התוצאה של הקוד הזה יהיה רשימה ממוספרת באות רומית גדולה ומתחילה מ2.
2. רשימה לא ממוספרת תרשם בפקודת
UL. וכל נתון ברשימה ירשם בעזרת פקודת
LI. דוגמא:
קוד HTML:
<ul>
<li>object 1
<li>onject 2
<li>object 3
</ul>
בפועל זה יראה כך:
(הערה, כברירת מחדל הסימן שליד כל נתון יהיה עיגול שחור.. לא יודע למה באטרף זה שונה..

כנראה שינו את הגדרת ברירת המחדל )
כמו הרשימות הממוספרות (
OL) גם רשימות ב-
UL ניתן להגדיר תצורות שונות ע"י הוספת פקודת type=X לתוך פקודת הפתיחה של הטבלה, (X- מציין את סוג ההגדרה על הטבלה)
סוגי הגדרות:
type=circle - ליד כל נתון יופיע עיגול ריק
type=disc - ליד כל נתון יופיע עיגול מלא
type=square - ליד כל נתון יופיע ריבוע מלא
דוגמא לשילוב בקוד:
קוד HTML:
<ul type=square>
<li>object 1
<li>object 2
<li>object 3
</ul>
התוצאה של הדוגמא הנ"ל יהיה רשימה לא ממוסרת עם ריבועים קטנים ושחורים ליד כל נתון ברשימה.
3. סוג נוסף של רשימות זה רשימת הגדרות/מונחים.
שמאפר לנו ליצור רשימה עם כמה כותרות שרק נרצה לפי נושאים. הפקודה שפותחת את הרשימה היא
DL.
בתוך רשימת DL, ישנם שני פקודות:
DT- כותרת של פריט
DD- הפריט עצמו
כך ניתן ליצור רשימה בעלת כמה וכמה נושאים/כותרות וכו'..
לדוגמא:
קוד HTML:
<dl>
<dt>first title
<dd>object 1
<dt>second title
<dd>object 2
</dl>
בדוגמא הזו התוצאה תהיה רשימה בעלת שני כותרות שלכל אחד תת-נתון.
----
זהו לבנתיים. תרגלו את זה עד שיעוא הבא
-----
קרדיט לי. כל המבקש להעתיק את המדריך לפנות אליי בפרטי
--
VIPER