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


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

  1. [שיעור מס' 1] HTML
    על ידי -Smoxer- בפורום בית הספר לתכנות
    תגובות: 22
    הודעה אחרונה: 26-12-2017, 14:52
  2. [HTML] הורדת ספר לימוד - OReilly Head First HTML with CSS
    על ידי isrhammer בפורום שפות צד לקוח
    תגובות: 14
    הודעה אחרונה: 14-09-2015, 17:14
  3. [שיעור מס' 2] HTML
    על ידי -Smoxer- בפורום בית הספר לתכנות
    תגובות: 9
    הודעה אחרונה: 25-05-2014, 16:09
  4. מאמר: שיעור מס' 2 - HTML
    על ידי -Smoxer- בפורום כתבות / מאמרים
    תגובות: 1
    הודעה אחרונה: 08-09-2013, 20:19
  5. [שיעור מס' 2] HTML
    על ידי -Smoxer- בפורום בית ספר לתכנות - VIP
    תגובות: 0
    הודעה אחרונה: 08-10-2012, 13:18
+ תגובה לנושא
מציג תוצאות 1 עד 11 מתוך 11

[שיעור מס' 3] HTML ו-CSS

  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
    מין: זכר

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

    שם:  whtyuwymzyor.png
צפיות: 354
גודל:  42.3 קילובייט
    הקדמה
    בשיעור הקודם למדנו כמה דברים:
    • מה עושים התגים <b>, <u>, <i> ו-<code> ושיש להם תגים מחליפים עם אותה פעולה.
    • איך עושים שורות.
    • איך עושים פסקאות.
    • איך לעשות סגירת תגים נכונה.
    • סימנים מיוחדים.
    מתחילים

    עברית
    אם קרה לכם שניסיתם לכתוב משהו בתגית ה-body ויצא לכם בעברית תפעלו ע"פ ההוראות הבאות:
    1. בתגית ה-<head> רשמו
      קוד HTML:
      <meta charset="utf-8" /> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-8" />
      זה ישים קידוד טוב למה שאנו לומדים.
    2. במקום תגית ה-<body> תרשמו:
      קוד HTML:
      <body dir="rtl">
      זה אומר לשים את כתיבת הטקסט מימין לשמאל.
    עכשיו יהיה לנו דף בשפה שלנו.

    כותרות
    אנחנו כותבים הרבה דברים ואנחנו רוצים לחלק אותם לחלקים, איזה דרך טובה יותר להפריד ביניהם עם כותרות?

    בשביל זה יש את התגים <h1>, <h2>, <h3>, <h4>, <h5> ו-<h6>. (יש תג סוגר)
    התגים מחולקים מהגדול לקטן, כלומר <h1> הוא הכי גדול ו-<h6> הוא הכי קטן.
    אתם מזומנים לנסות ע"פ הדוגמה:
    קוד HTML:
    <h1>Text</h1>
    <h2>Text</h2>
    <h3>Text</h3>
    <h4>Text</h4>
    <h5>Text</h5>
    <h6>Text</h6>
    קל לא?

    התג <pre>
    בשיעור הקודם הסברתי שאי אפשר לרדת שורה בלי התג <br /> או שאי אפשר לעשות כמה רווחים בלי & nbsp; נכון?
    בשביל זה יש את התג <pre> (יש תג סוגר) שאומר לעשות עיצוב איך שאנחנו רושמים. דוגמה:
    קוד HTML:
    <pre>
    Text                              Text
    
    
    
    
    Text        Text
    </pre>
    ואתם יכולים כבר לנחש מה זה יציג.

    קווים אופקיים
    אם שמתם (או לא שמתם) לב יש לנו תמיד את הקו הזה:


    ^ קו פשוט שעושה הפרדה בין דברים.

    דוגמה:
    קוד HTML:
    First row
    <hr />
    Second row
    כפי ששמתם לב ל-hr כמו ל-br אין תג סוגר, אז רושמים " / ".

    HTML ו-CSS
    פעם, בתקופת HTML 4 לא היינו צריכים לדעת CSS(Cascading Style Sheets)g בכדי לעצב קטעי טקסט.
    אלה מה? כיום, התקנים השתדרגו וצריך לעצב טקסט עם CSS.
    אנו משתמשים ב-CSS בכדי:
    • לשים צבעים בטקסט
    • לשנות פונט(סוג כתב)
    • לשנות גודל של טקסט
    • ועוד הרבה דברים
    בשביל להוסיף קטע CSS לקוד HTML, צריך להוסיף את המאפיין Style לתג שבוא נו רוצים לעצב.
    בשביל זה הכי מומלץ לכתוב קוד CSS, על התג <span> (יש תג סוגר) שהוא בעצם תג ריק. נועד בכדי עיצוב CSS.
    נשתמש בזה כך:
    קוד HTML:
    <span style="CSS Code">There is a text</span>
    כפי שראיתם, הוספתי אחרי הקטע "<span" (עדיין לא סגרתי את תחילת התג) קטע, שזה נקרא "מאפיין".
    כל "מאפיין" צריך סימן שווה ואז ערך, כלומר:
    קוד HTML:
    <tag parameter="value">Text..</tag>
    תבנית פשוטה ^

    אז אם נרצה לדוגמה לעשות צבע כחול נצטרך לרשום כך:
    קוד HTML:
    There is a <span style="color: Blue;">Blue</span> text!
    ויצא כחול למה שהגדרנו!

    שימו לב שרשמנו בתוך הפרמטר "color: Blue;".
    שאומר מה לעשות ואז את הערך, כלומר:
    קוד HTML:
    <tag style="parameter: value;">Text</tag>
    אז זה יעשה בכחול.

    באותה מידה אפשר גם לעשות קוד RGB במקום לרשום "Blue" או כל צבע אחר. (עדיף קוד RGB, על שם).

    איך משנים גודל כתב ב-CSS?
    בשביל זה נכתוב כך:
    קוד HTML:
    <span style="font-size: 18pt;">Text</span>
    וזה יציג את הכתב כך:
    Text

    רשמנו "font-size: 18pt;"
    אז:
    font-size:
    אומר שמתחילה פקודה לשינוי גודל טקסט
    18
    גודל הטקסט
    pt
    סוג הגודל(נקודות)
    ;
    סיום פעולת CSS

    להלן טבלה עם סוגי גדלים:
    שם הגודל ערך
    pt Points - נקודות
    px Pixels - פיקסלים

    אם נרצה להגדיר שני דברים במקביל?
    זאת לא אמורה להיות בעיה, אם נרצה למשל לרשום טקסט כחול בגודל של 16 נקודות נרשום כך:
    <span style="color: #0000FF; font-size: 16pt;">Text</span>
    די ברור לא?

    להלן טבלה של אפשרויות (כמו font-size), הערכים שלהם (pt וכ'ו) ולמה זה משמש (גודל טקסט):
    אפשרות ערך שימוש
    font-size מספר גודל כתב
    color קוד RGB או שם צבע שינוי צבע הטקסט
    font-weight bold נכתוב את הערך לכתב מודגש
    font-family Font נכתוב את שם הפונט במדויק בכדי לשנות סוג כתב
    text-decoration underline נכתוב underline בערך בשביל לעשות כמו <u>
    text-align center נכתוב center בערך בשביל למרכז את הטקסט
    ברור שזה מצומצם יחסית למה ש-CSS מציעה לנו.
    הבאתי רק את החיוניים.

    רשימות
    יש לכם דברים ארוכים באתר ואתם רוצים לעשות אותו יותר מסודר?
    בשביל זה יש רשימות!
    לדוגמה כל רשימה מתחילה בתג <ol> ובתוכו הפרמטרים.
    דוגמה:

    קוד HTML:
    <ol>
    <li>One</li>
    <li>Two</li>
    </ol>
    יצא:
    1. One
    2. Two
    אפשר גם להגדיר את זה שזה יהיה עם אותיות במקום מספרים עם נוסיף את הפרמטר type כך:
    <ol type="a">
    <li>One</li>
    <li>Two</li>
    </ol>

    רשמנו a ויצא לנו אותיות קטנות.

    טבלת ריכוז לפרמטרים:
    Type (סוג) מתכונת המספר דוגמה
    1 מספר סטנדרטי, ברירת מחדל. 1, 2, 3
    a אותיות קטנות. a, b, c
    A אותיות גדולות. A, B, C
    i מספר לטיני באותיות קטנות. i, ii, iii
    I מספר לטיני באותיות גדולות. I, II, III
    תשנו את הסוג ותראו איך זה נראה.

    מאפיין נחמד שאפשר להוסיף זה start שאומר ממה להתחיל לדוגמה, נכתוב שזה יתחיל מ-24:
    קוד HTML:
    <ol type="A" start="24">
    <li>One</li>
    <li>Two</li>
    </ol>
    זה עובד בכל סוג(Type) בחרתי ב-A רק לדוגמה, זה לא משנה מה תרשמו.

    רשימות עם תבליטים
    למדנו איך לעשות ממוספר עם אותיות וכ'ו. אבל אם אני רוצה לעשות עם תבליטים, כמו זה:
    • One
    • Two
    בשביל זה במקום <ol> נרשום <ul>, נשתמש בזה כך:
    קוד HTML:
    <ul>
    <li>One</li>
    <li>Two</li>
    </ul>
    ויצא איך שרצינו.

    שינוי סוג התבליט
    התבליטים נחמדים, אך אתה רוצה משהו אחר? גם לזה יש מאפיין type וגם בזה משתמשים אותו דבר!
    קוד HTML:
    <ul type="type">
    <li>One</li>
    <li>Two</li>
    </ul>
    להלן טבלה של כל הדברים שאפשר לכתוב ב-type:
    Type (סוג) מתכונת הצורה
    disc בצורת תקליטור, ברירת מחדל.
    circle עיגול ריק.
    square ריבוע.
    ש.ב
    1) עשו את שיעורי הבית מהשיעור הקודם.
    2) תרשמו את הטקסט משיעור קודם בעזרת CSS.
    לשיעור הקודם - שיעור מס' 2 לחצו כאן.
    שאלות על HTML ו-CSS בפורום שפות צד לקוח.
    נערך לאחרונה על ידי -Smoxer-; 09-10-2012 בשעה 16:52.

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

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

    ברירת מחדל

    שיעור טוב מאוד, השיעורי בית בדרך
    *יש לי שאלה, מה ההבדל בין PL ו PT? מה כל אחד מהם מביא?
    *ובשביל מה צריך ב CSS לעשות קו מתחת, BOLD ועוד כמה דברים אם יש תג פשוט יותר של >b> ודברים כאלה?
    נערך לאחרונה על ידי ExcluSive; 08-10-2012 בשעה 18:09.
    ".It always seems Impossible until it's done"

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

    ברירת מחדל

    ציטוט נכתב במקור על ידי ExcluSive צפיה בהודעה
    שיעור טוב מאוד, השיעורי בית בדרך
    *יש לי שאלה, מה ההבדל בין PL ו PT? מה כל אחד מהם מביא?
    *ובשביל מה צריך ב CSS לעשות קו מתחת, BOLD ועוד כמה דברים אם יש תג פשוט יותר של >b> ודברים כאלה?
    1 זה מתכוון ליחידות מידה, כמו שיש מטרים וסנטימטרים.
    2 זה עיניין של נוחות, אני באופן אישי מעדיף ב-CSS אבל זאת כבר בחירה שלך.

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

    ברירת מחדל

    ציטוט נכתב במקור על ידי -Smoxer- צפיה בהודעה
    1 זה מתכוון ליחידות מידה, כמו שיש מטרים וסנטימטרים.
    2 זה עיניין של נוחות, אני באופן אישי מעדיף ב-CSS אבל זאת כבר בחירה שלך.
    אז אם אני יעשה 16PT ו 16PX
    מה יהיה ההבדל, אתה יכול להעלות תמונה בבקשה?
    ".It always seems Impossible until it's done"

  6. #5
    משתמשת כבוד

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

    ברירת מחדל

    שלחתי אלייך את השיעורים


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

    ברירת מחדל

    ציטוט נכתב במקור על ידי ExcluSive צפיה בהודעה
    אז אם אני יעשה 16PT ו 16PX
    מה יהיה ההבדל, אתה יכול להעלות תמונה בבקשה?
    אתה תמיד יכול לנסות ולראות מה יוצא! הדוגמה הכי טובה.

  8. #7
    משתמש מכור
    שם פרטי
    אלי
    תאריך הצטרפות
    11/2011
    גיל
    18
    הודעות
    1,991
    לייקים
    111
    נקודות
    36
    משפט מחץ
    תרשום תרשום :"אל תעצבנו אותי אני במחזור" -ג'סטין ביבר
    מין: זכר

    ברירת מחדל

    שיעור טוב למדתי הרבה ממך (:

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

    ברירת מחדל

    תודה

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

    ברירת מחדל

    מה התג הסוגר של ה<body dir="rtl">

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

    ברירת מחדל

    מדריך מעולה.

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

    ברירת מחדל

    מדריך מעולה.

+ תגובה לנושא


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

הרשאות פרסום

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


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

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