สวัสดีผู้อ่านเว็บไซต์บล็อกที่รัก! บรรดาผู้ที่อย่างน้อยก็ทำความคุ้นเคยอย่างผิวเผินกับสิ่งนี้อาจได้รับทราบแล้ว แม้ว่าจะในแง่ทั่วไปก็ตาม ซึ่งหมายความว่าพวกเขามีความคิดว่าโดยทั่วไปจะใช้สัญลักษณ์ HTML ใดในโค้ดเอกสาร

ในบทความวันนี้ เราจะพยายามค้นหาว่าช่องว่างใน HTML คืออะไร และในกรณีใดบ้างที่คุณสามารถใช้อักขระช่องว่างเมื่อจัดรูปแบบโค้ดเพื่อให้อ่านง่าย เราจะค้นหาว่าเมื่อใดที่จำเป็นต้องใช้พื้นที่ที่ไม่แตกหักและทำความคุ้นเคยกับอักขระพิเศษอื่น ๆ (หรือที่เรียกกันว่าตัวช่วยจำ)

ที่จริงแล้ว ฉันขอแนะนำให้คุณอย่ามองข้ามหัวข้อการใช้อักขระพิเศษต่างๆ เนื่องจากนี่เป็นองค์ประกอบสำคัญที่ช่วยให้คุณสามารถศึกษาภาษามาร์กอัปไฮเปอร์เท็กซ์ได้ โดยทั่วไปข้อมูลที่ให้ไว้ในเอกสารฉบับนี้จะไม่ฟุ่มเฟือยอย่างแน่นอน ตอนนี้ถึงประเด็นแล้ว

ช่องว่างและอักขระช่องว่างใน HTML

ขั้นแรกมีบันทึกสำคัญที่ต้องทำ มีปุ่มพิเศษบนแป้นพิมพ์คอมพิวเตอร์ที่ให้คุณแยกข้อความได้ (เพิ่มเติมด้านล่างนี้) อย่างไรก็ตาม มีเพียงสเปซบาร์แบบกว้างเท่านั้นที่ให้การแยกระหว่างคำต่างๆ ไม่เพียงแต่ในตัวแก้ไขเท่านั้น แต่ยังรวมถึงในหน้าต่างเบราว์เซอร์ด้วย มีความแตกต่างเมื่อแบ่งเส้นและการเยื้องจากขอบ

ดังที่คุณทราบ การแสดงองค์ประกอบบางอย่างในเว็บเบราว์เซอร์นั้นถูกกำหนดโดยแท็ก ในการจัดรูปแบบข้อความ จะใช้ที่รู้จักกันดี ซึ่งเป็นแบบบล็อก นั่นคือเนื้อหาจะอยู่ในความกว้างที่มีอยู่ทั้งหมด

ถึง ตัดบรรทัดภายในย่อหน้า Pคุณต้องใช้แท็ก BR เดียว ซึ่งคุณสามารถทำได้ สมมติว่าเราจำเป็นต้องแทรกบางบรรทัดจากบทกวีที่เราเขียนในโปรแกรมแก้ไขข้อความ:

แม้ว่าบรรทัดของกลอนจะอยู่อย่างถูกต้องและมีเครื่องหมายยัติภังค์อยู่ในตำแหน่งที่ถูกต้อง แต่ทุกอย่างจะดูแตกต่างออกไปในเบราว์เซอร์:

เพื่อให้แสดงผลแบบเดียวกันในหน้าต่างเว็บเบราว์เซอร์ คุณต้องเขียน BR ในแต่ละบรรทัด:

ตอนนี้เราทำภารกิจสำเร็จแล้วและบรรทัดบทกวีจะแสดงอย่างถูกต้องสมบูรณ์ในเบราว์เซอร์:

ดังนั้นการขึ้นบรรทัดใหม่ที่จำเป็นจึงเสร็จสมบูรณ์ คุณสมบัติอื่นที่ต้องสังเกตที่นี่คือเว็บเบราว์เซอร์จะแสดงช่องว่างหลายช่องต่อกันเป็นหนึ่งเดียว คุณสามารถตรวจสอบสิ่งนี้ได้หากในโปรแกรมแก้ไขเดียวกันคุณพยายามไม่ใส่คำใดคำหนึ่ง แต่เว้นวรรคหลายช่องระหว่างสองคำและโดยการคลิกที่ปุ่ม "บันทึก" ให้ดูผลลัพธ์ในเบราว์เซอร์

ช่องว่าง แท็บ และตัวแบ่งบรรทัด

โดยพื้นฐานแล้วด้วยสิ่งเหล่านี้ อักขระช่องว่างเรารู้จักกันทันทีที่เราเริ่มทำงานกับข้อความในตัวแก้ไขและจัดรูปแบบตามแบบฟอร์มที่ต้องการ ในการดำเนินงานดังกล่าวจะมีปุ่มพิเศษซึ่งแต่ละปุ่มจะสอดคล้องกับอักขระช่องว่างของตัวเอง:

• Spacebar เป็นคีย์ที่กว้างที่สุดบนแป้นพิมพ์คอมพิวเตอร์ (ไม่มีป้ายกำกับ)
• Tab - ปุ่มทางด้านซ้ายพร้อมคำว่า "Tab" และลูกศรสองลูกชี้ไปในทิศทางที่ต่างกัน
• ตัวแบ่งบรรทัด - ปุ่ม "Enter"

อย่างไรก็ตาม ตามที่ฉันได้กล่าวไว้ข้างต้น เราได้รับผลลัพธ์ที่ต้องการขั้นสุดท้ายไม่เพียงแต่ในโปรแกรมแก้ไขข้อความเท่านั้น แต่ยังรวมถึงในเบราว์เซอร์ด้วย เมื่อเราใช้คีย์แรกเท่านั้น คีย์ทั้งสามคีย์ (รวมถึงแท็บและตัวแบ่งบรรทัดมีประโยชน์เมื่อจัดรูปแบบโค้ด HTML สมมติว่านี่คือลักษณะของส่วนของโค้ดใน NotePad++ (มีข้อมูลมากมายเกี่ยวกับตัวแก้ไขนี้) เมื่อแสดงอักขระช่องว่างทั้งหมด:

เราได้รับโค้ดที่อ่านและเข้าใจง่ายด้วยการเว้นวรรค ลูกศรสีส้มบ่งบอกถึงการเยื้องที่สร้างขึ้นโดยใช้ปุ่ม Tab และสัญลักษณ์ CR และ LF บ่งชี้ถึงการแบ่งบรรทัดที่สร้างขึ้นโดยใช้ปุ่ม Enter

คอนเทนเนอร์ที่ซ้อนกันจะถูกดู และแท็กเปิดและปิดจะมองเห็นได้ชัดเจน ในแบบฟอร์มนี้ คุณสามารถแก้ไขโค้ดนี้ได้อย่างง่ายดาย ตอนนี้เปรียบเทียบกับโค้ดเดียวกันซึ่งไม่มีการแบ่งข้อความ:

ในทำนองเดียวกัน เมื่อใช้อักขระช่องว่าง คุณสามารถเขียนกฎ CSS ที่จะดูชัดเจนและเข้าใจง่าย:

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

อักขระพิเศษ (หรือตัวช่วยจำ) ในโค้ด HTML

ตอนนี้เรามาดูกรณีที่จำเป็นต้องใช้อักขระพิเศษที่ฉันกล่าวถึงในตอนต้นของบทความ อักขระพิเศษ HTML บางครั้งเรียกว่าตัวช่วยจำถูกนำมาใช้เพื่อแก้ไขปัญหาที่มีมายาวนานเกี่ยวกับการเข้ารหัสที่เกิดขึ้นในภาษามาร์กอัปไฮเปอร์เท็กซ์

เมื่อคุณพิมพ์ข้อความบนแป้นพิมพ์ อักขระของภาษาที่คุณใช้จะถูกเข้ารหัส ในเว็บเบราว์เซอร์ ข้อความที่พิมพ์จะแสดงโดยใช้แบบอักษรที่คุณเลือกอันเป็นผลมาจากการดำเนินการถอดรหัสแบบย้อนกลับ

ความจริงก็คือมีการเข้ารหัสมากมาย ขณะนี้เราไม่มีเป้าหมายในการวิเคราะห์อย่างละเอียด เพียงแต่ว่าแต่ละรายการอาจขาดสัญลักษณ์บางอย่างซึ่งจำเป็นต้องแสดง สมมติว่าคุณรู้สึกอยากเขียนเครื่องหมายคำพูดเดี่ยวหรือเครื่องหมายเน้นเสียง แต่ไอคอนเหล่านี้ไม่ได้รวมอยู่ในชุด

เพื่อขจัดปัญหานี้จึงมีการนำระบบสัญลักษณ์พิเศษมาใช้ซึ่งรวมถึงตัวช่วยจำที่แตกต่างกันจำนวนมาก พวกเขาทั้งหมดเริ่มต้นด้วยเครื่องหมาย & "&" และมักจะลงท้ายด้วยเครื่องหมายอัฒภาค ";" ในตอนแรก ตัวละครพิเศษแต่ละตัวจะมีรหัสดิจิทัลของตัวเอง ตัวอย่างเช่น สำหรับช่องว่างที่ไม่แยก ซึ่งเราจะพิจารณาโดยละเอียดด้านล่าง รายการต่อไปนี้จะถูกต้อง:

แต่หลังจากนั้นไม่นาน สัญลักษณ์ที่พบบ่อยที่สุดก็ถูกกำหนดให้เป็นตัวอักษรแบบอะนาล็อก (ช่วยในการจำ) เพื่อให้จดจำได้ง่ายขึ้น สมมติว่าสำหรับพื้นที่ไม่แยกเดียวกันจะมีลักษณะดังนี้:

เป็นผลให้เบราว์เซอร์แสดงสัญลักษณ์ที่เกี่ยวข้อง รายการช่วยจำมีมากมายมหาศาล อักขระพิเศษที่ใช้บ่อยที่สุดใน HTMLคุณสามารถค้นพบได้จากตารางด้านล่าง:

กรณีการใช้อักขระพิเศษบางตัว รวมถึงการเว้นวรรคแบบไม่แยกและเครื่องหมายยัติภังค์แบบอ่อน

หากคุณได้ศึกษาตารางมาบ้างแล้ว คุณได้รับการยืนยันสิ่งที่ฉันกล่าวไว้ข้างต้นว่าเพื่อแสดงอักขระพิเศษทั้งหมด รหัสดิจิทัล () หรือตัวอักษรอะนาล็อก (ตัวช่วยจำเชิงสัญลักษณ์) ถูกนำมาใช้ โดยที่แทนที่จะใช้ชุดแฮช เครื่องหมายและตัวเลขตัวอักษร () ถูกเขียน

ตอนนี้เรามาดูกันว่าเมื่อใดควรใช้รหัสเหล่านี้ สมมติว่าในบทความคุณต้องระบุแท็ก HTML เพื่อจุดประสงค์ในการให้ข้อมูล เช่น