פסקאות וטקסט בשפת HTML

פסקאות וטקסט בשפת HTML

  • פרסומת

פסקאות בשפת HTML מוגדרות באמצעות התגית <p></p> (מלשון paragraph). השימוש בפיסקאות יוצר הפרדה בין חלקי טקסט. לדוגמה:

<p>זוהי פסקה בשפת HTML</p>
<p>זוהי פסקא נוספת</p>

פסקה בשפת HTML

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

  • <b></b>  – טקסט מודגש
  • <strong></strong> – טקסט מובלט
  • <i></i> – טקסט נטוי
  • <mark></mark> – טקסט מסומן
  • <del></del> – טקסט מחוק
  • <ins></ins> – טקסט עם קו תחתי

וכך ניתן להשתמש בהם בתוך פיסקה:

<p>זהו טקסט <strong>מובלט</strong> וזהו טקסט <i>נטוי</i></p>

עיצוב טקסט בשפת HTML

רווחים ושורות חדשות

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

<html>
    <body>
        <p>This is a paragraph</p>
    </body>
</html>

אם דפדפנים לא היו מתעלמים מרווחים ושורות חדשות, התוצאה הייתה מסמך מלא ברווחים ושורות חדשות וכדי להמנע מכך היינו צריכים לכתוב את כל הקוד בשורה אחת:

<html><body><p>This is a paragraph</p></body></html>

מה שכמובן היה מקשה על קריאת הקוד ומגביל אותנו בעת כתיבתו. בשביל לתת לכותבי הקוד חופשיות הדפדפנים מתעלמים מזה. איך, אם כך, ניתן בכל זאת לכתוב שורות חדשות ורווחים מבלי שהדפדפן יתעלם מכך? ובכן, יש שתי אפשרויות. האפשרות הראשונה היא על ידי שימוש בתגיות מיוחדות:

  • <br/> – מגדיר שורה חדשה
  • &nbsp;  – מגדיר רווח

וניתן להשתמש בהן כך:

<p>This is line 1<br/>
This is line 2<br/>
&nbsp;&nbsp;&nbsp;&nbsp;And this is a line indented by 4 white spaces
</p>

רווחים ושורות חדשות בשפת HTML

האפשרות השניה היא על ידי שימוש בתגית <pre></pre>  (מלשון preformatted text) אשר מגדירה לדפדפן לא להתעלם מרווחים ושורות חדשות. עם זאת, מטרת השימוש בתגית היא בדרך כלל הטמעה של קוד. לדוגמה:

<pre>
This is line 1
This is line 2
    And this is a line indented by 4 white spaces
</pre>

רווחים ושורות חדשות בשפת HTML