home

หน้าแรก
 Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

การเพิ่มแท็ก Space ใน HTML

เมื่อเขียน HTML คุณจะสังเกตว่าเว้นวรรคเพิ่มเติมที่เกิดจากการกดแท็บ spacebar ไม่ปรากฏเมื่อข้อความถูกเรนเดอร์ในเบราว์เซอร์

ตัวอย่าง: 

<p>April is the cruelest month,</p> <p>April is the cruelest month,</p>

ในแท็ก <p> แรก มีเว้นวรรคเพียงหนึ่งช่องระหว่างคำ แต่ในแท็ก <p> ที่สอง มีเว้นวรรคสามช่องระหว่างคำ ไม่ว่าจะอย่างไร แต่ละบรรทัดเรนเดอร์บนหน้าเว็บในลักษณะเดียวกัน:

April is the cruelest month, April is the cruelest month,

ในบทความนี้ เราจะพูดถึง 3 วิธีแก้เพื่อเพิ่มพื้นที่ว่างเพิ่มเติมในโค้ด HTML ของคุณ

แท็ก HTML สำหรับเพิ่มช่องว่าง

การเพิ่มแท็ก Space ใน HTML

Non-Breaking Space HTML Character

เพื่อสร้างช่องว่างก่อน ระหว่าง หรือหลังข้อความของคุณ คุณสามารถใช้ non-breaking space, ` ` tag นี่คือตัวอย่างวิธีใช้งานตัวอักษร HTML นี้:

<p>i carry your heart with me(i carry it in my heart)</p> <p>i carry your &nbsp; heart &nbsp; with me(i carry it in my heart)</p>

ซึ่งเรนเดอร์เป็น:

i carry your heart with me(i carry it in my heart)

i carry your   heart   with me(i carry it in my heart)

81% of participants stated they felt more confident about their tech job prospects after attending a bootcamp. Get matched to a bootcamp today.

The average bootcamp grad spent less than six months in career transition, from starting a bootcamp to finding their first job.

Preformatted Text Element

The <pre> tag is an HTML tag used to designate preformatted text. The <pre> tag preserves the spacing, line breaks, and displays the text in a fixed-width font. Let’s look at an example: 

 <p>I was a child and she was a child, In this kingdom by the sea, But we loved with a love that was more than love— I and my Annabel Lee—</p> <pre>I was a child and she was a child, In this kingdom by the sea, But we loved with a love that was more than love— I and my Annabel Lee—</pre>

which renders:

I was a child and she was a child, In this kingdom by the sea, But we loved with a love that was more than love— I and my Annabel Lee—

I was a child and she was a child,

   In this kingdom by the sea,

But we loved with a love that was more than love—

   I and my Annabel Lee—

Line Break

If you want to add space between lines of text, the line break tag, or <br> tag, would work best. Here’s an example of how to implement the <br> tag:

<p>so much depends upon a red wheel barrow glazed with rain water beside the white chickens</p> <p>so much depends<br> upon<br> <br> a red wheel<br> barrow<br> <br> glazed with rain<br> water<br> <br> beside the white<br> chickens</p>

Which renders:

การเพิ่มแท็ก Space ใน HTML

สรุป

สรุปคือ เราเรียนรู้ 3 วิธีในการเพิ่มช่องว่างโดยใช้แท็ก HTML หากคุณใหม่ใน HTML ให้ดูคู่มือของเราที่นี่: Learn HTML: A Guide to Learning Hypertext Markup Language หรืออ่านบทความ How Long Does It Take to Learn HTML?


No