קהילות פורומים, הורדות, יעוץ ותמיכה


אשכולות דומים

  1. [שיעור מס' 1] HTML
    על ידי -Smoxer- בפורום בית הספר לתכנות
    תגובות: 22
    הודעה אחרונה: 26-12-2017, 14:52
  2. מאמר: בית ספר לתכנות שיעור 1, HTML
    על ידי -Smoxer- בפורום כתבות / מאמרים
    תגובות: 3
    הודעה אחרונה: 08-09-2013, 20:19
  3. [HTML] מדריך html - שיעור 1
    על ידי AS productions בפורום שפות צד לקוח
    תגובות: 4
    הודעה אחרונה: 12-04-2011, 15:17
  4. [HTML] בית הספר לתכנות - לימוד html - שיעור 3 - קישורים
    על ידי AS productions בפורום שפות צד לקוח
    תגובות: 0
    הודעה אחרונה: 04-08-2010, 13:18
  5. [HTML] מדריך html - שיעור 2 - טקסט
    על ידי AS productions בפורום שפות צד לקוח
    תגובות: 1
    הודעה אחרונה: 26-07-2010, 02:16
+ תגובה לנושא
מציג תוצאות 1 עד 10 מתוך 10

[שיעור מס' 2] HTML

  1. #1
    Smoxer in your mind
    משתמש כבוד
    האוואטר של -Smoxer-
    תאריך הצטרפות
    11/2011
    הודעות
    8,881
    לייקים
    1181
    נקודות
    483
    פוסטים בבלוג
    3
    משפט מחץ
    Further gets colder until nothing was all that I saw around
    מין: זכר

    ברירת מחדל [שיעור מס' 2] HTML

    שם:  whtyuwymzyor.png
צפיות: 558
גודל:  42.3 קילובייט
    הקדמה
    בשיעור הקודם למדנו מספר דברים:
    • מהו HTML, ולמה הוא טוב.
    • מה טוב הגרסא החדשה של HTML(הגרסה הנוכחית היא 5) עדיפה על גרסאות ישנות יותר.
    • איך ליצור דף HTML בסיסי ולשים לו כותרת.
    מה זה צד לקוח?
    באינטרנט, המחשב הביתי מהווה כ"לקוח" שמקבל את המידע מהשרת. במילים אחרות, אנחנו כותבים קוד או סקריפט והשרת מעבד את זה לטקסט (או תמונה וכ'ו).
    בואו נעשה סדר;
    המשתמש כותב קוד אשר יציג איך יראה הדף, הטופס וכ'ו. הלקוח (כלומר המשתמש שגולש) רואה את הדף כדף אינטרנט מוכן.
    בגלל שהמחשב שלו עושה עיבוד לקוד אשר מוצג בדפדפן ומכך מסדר את זה ע"פ הקוד אשר יצרנו.

    מה זה צד שרת?
    אותו דבר כמו צד לקוח, רק שהקוד מעובד על השרת.

    מתחילים
    ניקח את הקובץ שיצרנו שיעור קודם ונעשה:
    קליק ימני -> פתח באמצעות -> Notepad.
    אנגלית: קליק ימני -> Open With ->ע Notepad.

    מי שמשתמש ב-Notepad++:
    קליק ימני -> Edit With Notepad++.

    כאמור יהיה לנו את הקוד שרשמנו שיעור קודם:
    קוד HTML:
    <!DOCOTYPE HTML>
    <html>
        <head>
            <title>My First WebSite!</title>
        </head>
        <body>
        </body>
    </html>
    נכון?
    בינתיים יש לנו רק דף ריק, עם כותרת שרשום שם "My First WebSite!" לא הרבה, נכון?

    זוכרים שאמרתי מה ההבדל בין התג <head> לתג <body>?
    <head>
    תג ה-head אומר שזה כל הקטע של "מאחורי הקלעים", אפשר לשים שם דברים כמו כותרת הדף, הגדרת מילות מפתח, הגדרת מילות תיאור ועוד.
    <body>
    פה יהיה כל התוכן, כל מה שכתוב.
    שימו לב
    בשיעורי בית ראיתי כמה מגישים את השיעורים תוך כדי שהתגים על אותיות גדולות, כלומר במקום לרשום <html> הם רשמו <HTML>.
    דבר האסור בתכלית האיסור, חוץ מ-"<!DOCOTYPE HTML>" אין לרשום תגים אחרים עם אותיות גדולות. הכל באותיות קטנות. (תקנים..)

    אוקיי, אז עכשיו יש לנו קובץ HTML, אבל מה נעשה איתו? בשביל לרשום טקסט נרשום את המלל בתגית ה-<body>.
    לדוגמה אם נרשום בעורך טקסט בתוך תגית ה-<body> לדוגמה "TEST". נפתח את הדפדפן (אם הוא כבר פתוח אז נלחץ על "רענן" או על F5) ונראה שפתאום רשום "TEST", אולי לא כ"כ יפה, אבל יש!

    אז כבר הבנו שצריך לרשום טקסט בתוך תגית ה-<body>.[/LIST]
    משימה
    את הדבר הבא אני רוצה שתעשו תוך כדי מה שרשום פה. זה יעזור לכם, מומלץ לעשות.

    כל פעם אתן תג, תג סוגר ותג פותח. אני רוצה שתרשמו את זה בתגית ה-<body> תרשמו משהו בין שני התגים תשמרו ותראו מה יצא בפדפן.
    ברור?

    אז מתחילים:
    תג פותח תג סוגר
    <b> </b>
    <i> </i>
    <u> </u>
    <code> </code>

    לאחר שעשיתם זאת, תסתכלו בספויילר. אמור לצאת לכם אותו דבר:
    ספוילר:

    תג פותח תג סוגר תוצאה
    <b> </b> טקסט מודגש
    <i> </i> טקסט נטוי
    <u> </u> טקסט עם קו תחתון
    <code> </code> יציג טקסט בצורת מונוספייס


    אמור לצאת אותו דבר, לא אמור להיות משהו שגוי. אבל אם כן כנראה שבשמירה של הקובץ היה משהו פגום.
    לדוגמה יצא קובץ בשם X.html.txt (בד"כ בסביבת חלונות). אם כן תעשו עוד פעם את מה שהסברתי בשיעור הראשון.

    ירידת שורה ופסקאות.
    כפי שכבר ראיתם, אי אפשר לרדת שורה בעורך טקסט וזה ירד גם שורה בדפדפן, או לעשות כמה רווחים נכון?
    בשביל זה.
    לדוגמה אם נרשום את הקוד הבא בתגית ה-<body>:
    קוד HTML:
    זוהי השורה הראשונה.
    זוהי השורה השנייה (לא נכון).
    <p>
    זוהי השורה השלישית.
    </p>
    זוהי השורה הרביעית
    עשה פסקה רק איך שרשמנו את התג <p> ונגמרה הפסקאה איך שסגרנו את התג </p>.

    אבל אם אני לא רוצה לעשות פסקאה? רק לרדת שורה?
    בשביל זה יש את התג <br /> (שימו לב, אין לו תג סוגר ובסוף התג יש מקף "/").
    נרשום את זה כך:
    קוד HTML:
    זוהי השורה הראשונה.
    <br />
    זוהי השורה השנייה.
    כפי ששמתם לב, זה ירד שורה ולא עשה פסקאה.

    ותשימו לב שוב, אין לזה תג סוגר!!! כל תג שאין לו תג סוגר נרשם בסוף עם סלש ( / ) ישנם עוד תגים בלי תג סוגר אך אפרט עליהם בהמשך

    לתגיות הללו יש גם תגים מחליפים לדוגמה:
    שם התג התג המחליף
    <b> <strong>
    <i> <em> או <cite> או <address>
    <code> <kbd>
    לא רשמתי תגים סוגרים, כי ידוע שיש ומיותר לכתוב.
    הפעולה שהם עושים הינה אותה פעולה, זה לא משנה מה תבחרו.

    אם אני רוצה לעשות כמה עיצובים במקביל?
    אם אתם רוצים לעשות טקסט נטוי, וטקסט מודגש ביחד. או טקסט נטוי ומונוספייס ביחד. או כל פעולה שתרצו זה פשוט מאוד.
    אתם רק "מקוננים" את התגים.
    דוגמה א':
    קוד HTML:
    <i><u>TEXT</u></i>
    דוגמה ב':
    קוד HTML:
    <b><i>TEXT</i></b>
    דוגמה ג':
    קוד HTML:
    <code><b>TEXT</b></code>
    הבנתם את העיקרון לא?

    שימו לב
    אחד מהתקנים שאתם צריכים לדעת כבר עכשיו!
    שאתם מקוננים תגים ביחד, כלומר שמים תג אחד בתוך השני אתם צריכים לשים את התגים בצורת j,hfv, כלומר:
    אם פתחתם את התג <i> ראשון אז תסגרו אותו אחרון. דוגמה א':
    טוב:
    <i><u>TEXT</u></i>
    לא טוב:
    <i><u>TEXT</i></u>

    דוגמא ב':
    טוב:
    <b><u>TEXT</u></b>
    לא טוב:
    <b><u>TEXT</b></u>

    הבנתם את העיקרון כן?

    סימנים מיוחדים
    אם למשל תרצו לרשום: <i>? זה לא יציג לכם את זה, כי זה יחשוב שאתם רוצים להראות תג.
    בשביל זה יש תגים מיוחדים.

    להלן רשימה:
    הסימן מספר הסימן שם הסימן
    > & #060; & lt;
    < & #062; & gt;
    רווח קשיח & #160; & nbsp;
    © & #169; & copy;
    ® & #174; & reg;
    שימו לב, רשמתי את הסימן "&" ואז רווח, כי בלי הרווח זה יציג את התו.
    וכשרשמתי "מספר הסימן" ו"שם הסימן" זה לא משנה מה מהם תרשמו, התוצאה היא אותה תוצאה.
    וכשרשמתי "רווח קשיח" הכוונה הייתה לכך שזה יעשה רווח.(זוכרים שאמרתי שאי אפשר לעשות יותר משני רווחים?
    אפשר לרשום את הקוד הזה במקום רווח וזה יעשה!)

    וזהו!
    ש.ב
    תרשמו לי את הטקסט הזה בקוד HTML ותשלחו לי בפרטי:
    כל הזכויות שמורות לאטרף ©
    (במקום הסימן © תרשמו את הקוד ה"מיוחד" של זה)

    לשיעור הקודם - שיעור מס' 1 לחצו כאן.
    שאלות על HTML בפורום שפות צד לקוח.
    נערך לאחרונה על ידי -Smoxer-; 09-10-2012 בשעה 16:54.

  2. קישורים ממומנים

  3. #2
    משתמש כבוד
    הכאב הוא רגעי, הגאווה היא נצחית
    האוואטר של ExcluSive
    שם פרטי
    גבי
    תאריך הצטרפות
    05/2007
    גיל
    24
    הודעות
    24,083
    לייקים
    1801
    נקודות
    2,325
    משפט מחץ
    Where there's a will, there's a way
    מין: זכר

    ברירת מחדל

    אחלה שיעור, הש"ב בדרך
    ".It always seems Impossible until it's done"

  4. #3
    משתמשת כבוד

    שם פרטי
    זוהר ツ
    תאריך הצטרפות
    04/2010
    הודעות
    7,440
    לייקים
    860
    נקודות
    25,119
    מין: נקבה

    ברירת מחדל

    כבר שולחת לת את השיעורים


  5. #4
    משתמש כבוד האוואטר של .Dor.
    שם פרטי
    דור
    תאריך הצטרפות
    10/2010
    הודעות
    9,660
    לייקים
    461
    נקודות
    46
    מין: זכר

    ברירת מחדל

    ציטוט נכתב במקור על ידי -Smoxer- צפיה בהודעה
    בשיעור הקודם למדנו מספר דברים:
    • מהו HTML, ולמה הוא טוב.
    • מה טוב הגרסא החדשה של HTML(הגרסה הנוכחית היא 5) עדיפה על גרסאות ישנות יותר.
    • איך ליצור דף HTML בסיסי ולשים לו כותרת.
    מה זה צד לקוח?
    באינטרנט, המחשב הביתי מהווה כ"לקוח" שמקבל את המידע מהשרת. במילים אחרות, אנחנו כותבים קוד או סקריפט והשרת מעבד את זה לטקסט (או תמונה וכ'ו).
    בואו נעשה סדר;
    המשתמש כותב קוד אשר יציג איך יראה הדף, הטופס וכ'ו. הלקוח (כלומר המשתמש שגולש) רואה את הדף כדף אינטרנט מוכן.
    בגלל שהמחשב שלו עושה עיבוד לקוד אשר מוצג בדפדפן ומכך מסדר את זה ע"פ הקוד אשר יצרנו.

    מה זה צד שרת?
    אותו דבר כמו צד לקוח, רק שהקוד מעובד על השרת.

    מתחילים
    ניקח את הקובץ שיצרנו שיעור קודם ונעשה:
    קליק ימני -> פתח באמצעות -> Notepad.
    אנגלית: קליק ימני -> Open With ->ע Notepad.

    מי שמשתמש ב-Notepad++:
    קליק ימני -> Edit With Notepad++.

    כאמור יהיה לנו את הקוד שרשמנו שיעור קודם:
    קוד HTML:
    <!DOCOTYPE HTML>
    <html>
        <head>
            <title>My First WebSite!</title>
        </head>
        <body>
        </body>
    </html>
    נכון?
    בינתיים יש לנו רק דף ריק, עם כותרת שרשום שם "My First WebSite!" לא הרבה, נכון?

    זוכרים שאמרתי מה ההבדל בין התג <head> לתג <body>?
    <head>

    <body>


    שימו לב
    בשיעורי בית ראיתי כמה מגישים את השיעורים תוך כדי שהתגים על אותיות גדולות, כלומר במקום לרשום <html> הם רשמו <HTML>.
    דבר האסור בתכלית האיסור, חוץ מ-"<!DOCOTYPE HTML>" אין לרשום תגים אחרים עם אותיות גדולות. הכל באותיות קטנות. (תקנים..)

    אוקיי, אז עכשיו יש לנו קובץ HTML, אבל מה נעשה איתו? בשביל לרשום טקסט נרשום את המלל בתגית ה-<body>.
    לדוגמה אם נרשום בעורך טקסט בתוך תגית ה-<body> לדוגמה "TEST". נפתח את הדפדפן (אם הוא כבר פתוח אז נלחץ על "רענן" או על F5) ונראה שפתאום רשום "TEST", אולי לא כ"כ יפה, אבל יש!

    אז כבר הבנו שצריך לרשום טקסט בתוך תגית ה-<body>.[/LIST]
    משימה
    את הדבר הבא אני רוצה שתעשו תוך כדי מה שרשום פה. זה יעזור לכם, מומלץ לעשות.

    כל פעם אתן תג, תג סוגר ותג פותח. אני רוצה שתרשמו את זה בתגית ה-<body> תרשמו משהו בין שני התגים תשמרו ותראו מה יצא בפדפן.
    ברור?

    אז מתחילים:
    תג פותח תג סוגר
    <b> </b>
    <i> </i>
    <u> </u>
    <code> </code>

    לאחר שעשיתם זאת, תסתכלו בספויילר. אמור לצאת לכם אותו דבר:
    ספוילר:

    תג פותח תג סוגר תוצאה
    <b> </b> טקסט מודגש
    <i> </i> טקסט נטוי
    <u> </u> טקסט עם קו תחתון
    <code> </code> יציג טקסט בצורת מונוספייס


    אמור לצאת אותו דבר, לא אמור להיות משהו שגוי. אבל אם כן כנראה שבשמירה של הקובץ היה משהו פגום.
    לדוגמה יצא קובץ בשם X.html.txt (בד"כ בסביבת חלונות). אם כן תעשו עוד פעם את מה שהסברתי בשיעור הראשון.

    ירידת שורה ופסקאות.
    כפי שכבר ראיתם, אי אפשר לרדת שורה בעורך טקסט וזה ירד גם שורה בדפדפן, או לעשות כמה רווחים נכון?
    בשביל זה.
    לדוגמה אם נרשום את הקוד הבא בתגית ה-<body>:
    קוד HTML:
    זוהי השורה הראשונה.
    זוהי השורה השנייה (לא נכון).
    <p>
    זוהי השורה השלישית.
    </p>
    זוהי השורה הרביעית
    עשה פסקה רק איך שרשמנו את התג <p> ונגמרה הפסקאה איך שסגרנו את התג </p>.

    אבל אם אני לא רוצה לעשות פסקאה? רק לרדת שורה?
    בשביל זה יש את התג <br /> (שימו לב, אין לו תג סוגר ובסוף התג יש מקף "/").
    נרשום את זה כך:
    קוד HTML:
    זוהי השורה הראשונה.
    <br />
    זוהי השורה השנייה.
    כפי ששמתם לב, זה ירד שורה ולא עשה פסקאה.

    ותשימו לב שוב, אין לזה תג סוגר!!! כל תג שאין לו תג סוגר נרשם בסוף עם סלש ( / ) ישנם עוד תגים בלי תג סוגר אך אפרט עליהם בהמשך

    לתגיות הללו יש גם תגים מחליפים לדוגמה:
    שם התג התג המחליף
    <b> <strong>
    <i> <em> או <cite> או <address>
    <code> <kbd>
    לא רשמתי תגים סוגרים, כי ידוע שיש ומיותר לכתוב.
    הפעולה שהם עושים הינה אותה פעולה, זה לא משנה מה תבחרו.

    אם אני רוצה לעשות כמה עיצובים במקביל?
    אם אתם רוצים לעשות טקסט נטוי, וטקסט מודגש ביחד. או טקסט נטוי ומונוספייס ביחד. או כל פעולה שתרצו זה פשוט מאוד.
    אתם רק "מקוננים" את התגים.
    דוגמה א':
    קוד HTML:
    <i><u>TEXT</u></i>
    דוגמה ב':
    קוד HTML:
    <b><i>TEXT</i></b>
    דוגמה ג':
    קוד HTML:
    <code><b>TEXT</b></code>
    הבנתם את העיקרון לא?

    שימו לב
    אחד מהתקנים שאתם צריכים לדעת כבר עכשיו!
    שאתם מקוננים תגים ביחד, כלומר שמים תג אחד בתוך השני אתם צריכים לשים את התגים בצורת j,hfv, כלומר:
    אם פתחתם את התג <i> ראשון אז תסגרו אותו אחרון. דוגמה א':
    טוב:
    <i><u>TEXT</u></i>
    לא טוב:
    <i><u>TEXT</i></u>

    דוגמא ב':
    טוב:
    <b><u>TEXT</u></b>
    לא טוב:
    <b><u>TEXT</b></u>

    הבנתם את העיקרון כן?

    סימנים מיוחדים
    אם למשל תרצו לרשום: <i>? זה לא יציג לכם את זה, כי זה יחשוב שאתם רוצים להראות תג.
    בשביל זה יש תגים מיוחדים.

    להלן רשימה:
    הסימן מספר הסימן שם הסימן
    > & #060; & lt;
    < & #062; & gt;
    רווח קשיח & #160; & nbsp;
    © & #169; & copy;
    ® & #174; & reg;
    שימו לב, רשמתי את הסימן "&" ואז רווח, כי בלי הרווח זה יציג את התו.
    וכשרשמתי "מספר הסימן" ו"שם הסימן" זה לא משנה מה מהם תרשמו, התוצאה היא אותה תוצאה.
    וכשרשמתי "רווח קשיח" הכוונה הייתה לכך שזה יעשה רווח.(זוכרים שאמרתי שאי אפשר לעשות יותר משני רווחים?
    אפשר לרשום את הקוד הזה במקום רווח וזה יעשה!)

    וזהו!
    ש.ב
    תרשמו לי את הטקסט הזה בקוד HTML ותשלחו לי בפרטי:
    כל הזכויות שמורות לאטרף ©
    (במקום הסימן © תרשמו את הקוד ה"מיוחד" של זה)

    לשיעור הקודם - שיעור מס' 1 לחצו כאן.
    שאלות על HTML בפורום שפות צד לקוח.
    שיעור מעולה, תודה רבה.

    שאלב בקשר לשיעור:
    למה צריך לעשות / בסוף פקודות ללא סוגר (כמו br)? זה נקלט גם ללא הסלאש.
    תודה :]

  6. #5
    Smoxer in your mind
    משתמש כבוד
    האוואטר של -Smoxer-
    תאריך הצטרפות
    11/2011
    הודעות
    8,881
    לייקים
    1181
    נקודות
    483
    פוסטים בבלוג
    3
    משפט מחץ
    Further gets colder until nothing was all that I saw around
    מין: זכר

    ברירת מחדל

    ציטוט נכתב במקור על ידי .Dor. צפיה בהודעה
    שיעור מעולה, תודה רבה.

    שאלב בקשר לשיעור:
    למה צריך לעשות / בסוף פקודות ללא סוגר (כמו br)? זה נקלט גם ללא הסלאש.
    תודה :]
    כאמור, אני מלמד לפי התקנים.
    אחד מהם הוא לשים סלאש בסוף תג.
    הסיבה שאתה מקבל את זה, בגלל שהתקנים לא נכנסו סופית.
    שהתקן ייכנס כחובה, הדפדפים יוציאו גרסא חדשה ששם זה לא ייקבל תג כך ופשוט לא יעשה ירידת שורה.


    אם יש לכם שאלה לא להתבייש, זה טבעי לא להבין!

  7. #6
    משתמש מתחיל
    תאריך הצטרפות
    12/2008
    הודעות
    57
    לייקים
    0
    נקודות
    0
    מין: זכר

    ברירת מחדל

    תודה

  8. #7
    מורחקים
    שם פרטי
    דין
    תאריך הצטרפות
    06/2013
    הודעות
    80
    לייקים
    0
    נקודות
    0
    מין: זכר

    ברירת מחדל

    תודה רבה

  9. #8
    מורחקים
    שם פרטי
    דין
    תאריך הצטרפות
    06/2013
    הודעות
    80
    לייקים
    0
    נקודות
    0
    מין: זכר

    ברירת מחדל

    תודה רבה

  10. #9
    משתמש מתחיל
    תאריך הצטרפות
    06/2013
    הודעות
    24
    לייקים
    0
    נקודות
    0
    מין: זכר

    ברירת מחדל

    ,usv

  11. #10
    משתמש מתחיל
    תאריך הצטרפות
    10/2012
    הודעות
    22
    לייקים
    0
    נקודות
    0
    מין: זכר

    ברירת מחדל

    מדריך מעולה.

+ תגובה לנושא


תגיות בנושא זה

הרשאות פרסום

  • אין באפשרותך לפרסם נושאים חדשים
  • אין באפשרותך לפרסם תגובות
  • אין באפשרותך לצרף קבצים
  • אין באפשרותך לערוך את הודעותיך


כל הזמנים הם לפי GMT +3. השעה כרגע היא 11:35.
מופעל על ידי vBulletin™ © גרסה 4.1, 2011 vBulletin Solutions, Inc. כל הזכויות שמורות.
פעילות הגולשים
אומנות וגרפיקה
מוזיקה
ספורט
סדרות טלוויזיה
סרטים וקולנוע
קנייה ומכירה
רשתות חברתיות
הבורר 3
פורומי פנאי ובידור
סרטים
סדרות
משחקים
דיבורים
אקטואליה
בעלי חיים
בדיחות והומור
משחקי ספורט
הבורר
מחשבים וטכנולוגיה
תמיכה טכנית
חומרה ומודינג
תוכנות להורדה
סלולארי וגאדג'טים
רקעים למחשב
ציוד הקפי למחשב
אבטחת מידע
תכנות ובניית אתרים
כסף ברשת
אייפון
בריאות ואורח חיים
כושר ופיתוח גוף
דיאטה
צבא וגיוס
יעוץ מיני
מה שבלב
אומנות הפיתוי
יהדות
מיסטיקה ורוחניות
אתאיזם ודתות

נושאים: 1,756,278 | הודעות: 7,453,675 | משתמשים: 315,626 | המשתמש החדש ביותר: upizijoj | עיצוב גרפי: סטודיו עודד בביוף | קידוד: rellect