אינדקס מאמרי HTML

רפרנס ל-HTML

 

רפרנס ל-HTML

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

חשוב: התגים מופיעים עם רווחים כדי למנוע את הופעתם בדף, זה מטעמי נוחות בלבד אנא הורידו אותם לפני שאתם משתמשים בהם.
הרווחים מופיעים בין < לשם התג ובין > לשם התג.

התגתאורדוגמא
< !DOCTYPE >מגדיר את סוגו של המסמך[1]
< a >קישור< a href="url">text< /a >
< abbr >תאור לראשי תיבות< abbr title="text" >text< /abbr >
< b >מלל בולט< b >text< /b >
< base >[2] בסיס הכתובת של האתר< base href="http://www.webmasters.co.il/" />
< bdo >הופך את המלל < bdo dir="rtl" >text< /bdo > ידפיס ההפך txet
< big >מלל גדול< big >big text< /big >
< blockquote >ציטוט< blockquote >quote< /blockquote >
< body >החלק העיקרי של האתרחלק מהשלד העיקרי של דף HTML
< br />ירידת שורהמלל מלל מלל < br /> מלל מלל
< button >כפתור< button type="button">You can click me< /button>
< code >קטע קוד[3]
< div >קטעבלוק באתר< div >text text< /div >
< form >התחלה של טופס< form >שאר קוד הטופס כאן< /form >
< h1 >כותרת עיקרית בדף< h1 >text< /h1 > [4]
< img >הצגת תמונה< img src="url" / >
< head >ראש הקודהחלק שבו יכנסו: תגי מטא, תג הכותרת של הדף, סקריפטים ועוד
< hr />יוצר קו רווח רוחבי< hr /> *טוב להפרדה בין פסקאות
< html >כאן יכנס כל קוד ה-HTML< html> our html code < /html>
< i >כתב נטוי< i >text< /i >
התגתאורדוגמא
< table >טבלה[5]
< td >תא בודד[5]
< tr >שורה של תאים[5]
< th >כמו td רק מתפקד בראש הטבלה[5]
< title >הכותרת שמופיע ב"טאב" של הדפדפן< title >text< /title >
< textarea >חלק מהטופס, נועד לקבל קלט של מלל רב< textarea > text text < /textarea >
< input >חלק מהטופס, נועד לקבל קלט של שורה בלבד< input type="text" / >
< p >נועד לתחום מלל< p > text text < / p >
< pre >משמש להצגת קוד מחשב כלשהו< pre > some code < / pre >
< small >מלל קטן< small > text < / smal>
< strong >מלל בולט, בדומה ל- < b >< strong > text < / strong >
< u >מלל עם קו תחתון< u >text < / u >
< option >חלק מהטופס, נועד להצגת אפשרויות בחירה< option > text < / option >
< span >משמש לעיצוב חלק מסויים במלל בעזרת CSS< span > text < / span >
< meta >תג שמופיע ב-< head > לשימושים טכניים --
< script >משמש להקצאת אזור לסקריפט (Javascript)[6]
< noscript >מיועד להודיע למשתמש שהדפדפן שלא לא תומך בסקריפט[7]
< iframe >יצירת חלון של דף או אתר אחר בדף הנוכחי[8]
< style >נועד להכניס מידע עיצובי של CSS[9]



[1] דוגמא לקוד <!DOCTYPE>:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

[2] את תג ה-<base> מציבים בתוך ה-<head> וזה נועד כדי שהלינקים באתר אם הם לא מלאים למשל "page.html" אז לתחילתם יתווסף ה-URL הבסיסי שאנחנו נבחר, במקרה הזה הדומיין של האתר שלנו.

[3] כך זה יראה:
<code>our code</code>


[4] אפשר מספרים מ-1 עד 7 כולל כדי לקבוע את גודל הכותרתמלל.


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

<table height="200px" width="100%" border="1px">
       <tr>
           <th>תא 1</th>
           <th>תא 2</th>
       </tr>
       <tr>
           <td>תא 3</td>
           <td>תא 4</td>
       </tr>
       <tr>
           <td>תא 3</td>
           <td>תא 4</td>
       </tr>
</table>


[6] דוגמא לשימוש ב-script:

<script type="text/javascript">
document.write("'webmasters.co.il!")
</script>


[7] משמש לכתוב למשתמש על כך שהדפדפן שלו לא תומך בסקריפט

<noscript>Your browser does not support JavaScript!</noscript>
* זה יוצג רק למי שבדפדפן שלו האופציה של Javascript כבויה.


[8] מיועד ליצור חלון בתוך הדף הנוכחי שמייבא אתר או דף אחר

<iframe src="http://www.webmasters.co.il/" height="300px" width="350px" /></iframe>

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

<style type="text/css">
h1 {color:red;}
p {color:blue;}
</style>