Computer >> คอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

HTML ขึ้นบรรทัดใหม่โดยใช้และ

คุณสามารถเพิ่มบรรทัดใหม่ในหน้า HTML โดยใช้แท็ก
หรือ

<p>
Test<br>
</p>

แท็ก
จะเพิ่มบรรทัดใหม่หลังคำว่า "Test" แท็กนี้ไม่มีแท็กปิด แต่คุณจะต้องเพิ่ม
ในตำแหน่งใดก็ได้ที่คุณต้องการขึ้นบรรทัดใหม่ มาดูตัวอย่างโดยละเอียดกันดีกว่า:

ต่อไปนี้จะใช้ต่อจากแต่ละบรรทัดในที่อยู่:

81% ของผู้เข้าร่วมกล่าวว่าพวกเขารู้สึกมั่นใจมากขึ้นเกี่ยวกับโอกาสในการทำงานด้านเทคโนโลยีหลังจากเข้าร่วม bootcamp จับคู่กับ Bootcamp วันนี้

ผู้สำเร็จการศึกษาจากหลักสูตร bootcamp โดยเฉลี่ยใช้เวลาน้อยกว่าหกเดือนในการเปลี่ยนอาชีพ ตั้งแต่เริ่มต้น bootcamp ไปจนถึงหางานแรก

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Line Breaks</title>
</head>
<body>
   <div>
       <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima, veritatis. Soluta pariatur nesciunt voluptatum id incidunt minus ratione obcaecati laborum unde? Voluptatibus officia quia ducimus odio labore atque aperiam sint. Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque dolores provident animi deserunt maxime. Officiis explicabo odit vitae. Doloremque nemo nobis voluptates ducimus aperiam libero maiores accusamus earum ipsam voluptate! Lorem, ipsum dolor sit amet consectetur adipisicing elit. Ea nostrum commodi et exercitationem, maiores eum facere dicta repellendus laborum voluptatibus amet ipsam animi repellat distinctio deleniti quis? Dicta, aperiam nobis.</p>
 
       <address>
           <span>123 Main St</span><br>
           <span>Hometown, USA</span><br>
           <span>23455-2345</span>
       </address>
       <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dignissimos tempora modi eius omnis provident sit itaque vel ad porro nulla vero sequi ullam aperiam placeat consectetur, assumenda in autem dolorum! Lorem ipsum dolor sit amet consectetur adipisicing elit. Et, cumque tenetur quos sit assumenda consectetur voluptas veritatis soluta. Alias accusamus similique odio iste. Laudantium vitae exercitationem illum suscipit assumenda enim! Lorem ipsum dolor sit amet consectetur, adipisicing elit. Dignissimos architecto deleniti debitis alias recusandae, optio ab nihil in neque nam impedit at a corporis delectus quas! Aliquid, modi earum. Quidem.</p>
   </div>
</body>
</html>

ในโค้ดนี้ เราใช้แท็ก
หลังแท็ก HTML แต่ละแท็กในแท็ก

จะเป็นการเพิ่มบรรทัดใหม่ในแต่ละส่วนของที่อยู่

HTML
<pre>
This is a sentence.
</pre>

รหัสนี้จัดรูปแบบข้อความ “นี่คือประโยค” เหมือนกับที่ปรากฏระหว่างแท็ก

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Line Breaks</title>
</head>
<body style="max-width: 800px; width: 100%;">
   <pre style="width: 100%;">
       <p style="width: 800px;">
       Lorem, ipsum dolor sit amet consectetur adipisicing elit. Ut temporibus dolores
       iure molestias porro, esse, ducimus provident ipsam voluptas rerum veniam vero
       inventore tempora molestiae error sapiente veritatis, neque eligendi. Lorem ipsum
       dolor sit amet consectetur adipisicing elit. Accusamus soluta ipsam eligendi
       nesciunt hic explicabo vel doloremque quod eaque minima. Fugit enim fugiat neque
       quos, eligendi commodi sint architecto repellendus? Lorem ipsum dolor sit amet
       consectetur adipisicing elit. Laboriosam, saepe ipsam! Fugiat id quod esse
       obcaecati vitae at commodi distinctio, praesentium labore eveniet corporis aut,
       sint qui nostrum iure in!
       </p>
 
       <address>
           2345 Main St.
           Hometown, Anywhere, USA
           12345-3456
       </address>
 
       <p style="width: 800px; height: 500px; background: pink;">
      
       Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque assumenda,
       explicabo aspernatur odit saepe a dicta eveniet accusamus laudantium,
       molestiae quae sunt cumque iusto? Tenetur eligendi architecto atque tempora.
      
       Placeat? Lorem ipsum dolor sit amet consectetur, adipisicing elit.
       Ullam sit libero quibusdam, ex ut, possimus iure non architecto
       doloremque consectetur quam eligendi repellat facere vero omnis officiis
       aperiam modi ea. Lorem ipsum dolor sit amet consectetur adipisicing elit.
       Iusto quas, autem impedit, ratione enim porro illum fugit natus voluptatem
       sunt error non accusamus nulla blanditiis aspernatur nemo repudiandae sequi
       reiciendis!
      
       </p>
   </pre>
</body>
</html>

เราเพิ่มแท็ก

 ต่อจากแท็ก  ในโค้ดของเรา ข้อความทั้งหมดภายในแท็ก — แท็กย่อหน้า HTML และแท็ก 
ของเรา — มีรูปแบบตามที่ปรากฏในโปรแกรมแก้ไขข้อความ

เราไม่จำเป็นต้องใช้แท็ก
ในที่อยู่ เนื่องจากเราได้แทรกบรรทัดใหม่โดยใช้ปุ่ม Enter ในโปรแกรมแก้ไขข้อความของเรา

โดยปกติจะไม่ให้เราเพิ่มบรรทัดใหม่ลงในเอกสารของเรา เนื่องจากเราใช้แท็ก

 บรรทัดใหม่ของเราที่สร้างด้วยคีย์ Enter จึงปรากฏในเอกสารขั้นสุดท้าย

บทสรุป

มีสองวิธีในการแทรกตัวแบ่งบรรทัดลงใน HTML:
และ

 . แท็ก 
มีประโยชน์หากคุณต้องการเพิ่มบรรทัดใหม่ในตำแหน่งเฉพาะ
 จะดีกว่าถ้าคุณมีกลุ่มข้อความที่คุณต้องการให้ปรากฏในโปรแกรมแก้ไขข้อความ

คุณต้องการเรียนรู้เพิ่มเติมเกี่ยวกับการเข้ารหัสใน HTML หรือไม่? เรามีคู่มือ HTML How to Learn ที่แสดงรายการหลักสูตรและแหล่งข้อมูลชั้นนำที่คุณสามารถใช้เพื่อพัฒนาความรู้ของคุณ