วิธีรับตัวอักษรแท็บ

124

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

คำถามของฉันคือเหตุใดจึงไม่มีอักขระ Unicode สำหรับแท็บแม้ว่าฉันจะสามารถคัดลอกและวางได้

html

— แอบบี้ Graebner
แหล่งที่มา

8

นี่คืออักขระแท็บสำหรับคุณ: "" เพียงแค่ส่งข้อความหาฉันหากคุณต้องการตัวละครอื่น ๆ ! ฉันมีช่องว่างขีดกลางและตัวอักษรกรีกเช่นกัน!

— madhead

ใน Unix: Ctrl + Shift + U และ 9 สำหรับอักขระเยื้อง

— neverMind9

StackOverflow ทำให้ข้อความแสดงความคิดเห็นรุนแรงกว่าคำถามหรือคำตอบ ``, '' และ "" ถูกวางอักขระ TAB โดยอ้างหลายวิธี

— MarkHu

165

แน่ใจว่ามีเอนทิตีสำหรับแท็บ:

&#9;

(แท็บคืออักขระ ASCII 9 หรือ Unicode U + 0009)

อย่างไรก็ตามเช่นเดียวกับแท็บตามตัวอักษร (แท็บที่คุณพิมพ์ลงในโปรแกรมแก้ไขข้อความของคุณ) อักขระของแท็บทั้งหมดจะถือว่าเป็นช่องว่างโดยตัวแยกวิเคราะห์ HTML และยุบลงในช่องว่างเดียวยกเว้น<pre>แท็บที่อยู่ภายในบล็อกซึ่งแท็บตามตัวอักษรจะแสดงเป็น8 ช่องว่างใน a แบบอักษร monospace

— josh3736
แหล่งที่มา

1

มันน่าสนใจ แต่ถ้าเป็นอักขระ Unicode ดังนั้น html ก็ไม่ควรเปลี่ยน (ยุบมัน) เลยใช่ไหม

— Abbey Graebner

2

Unicode ไม่มีอักขระแท็บของตัวเอง U + 0009 Tabเป็นเช่นเดียวกับตัวละครของแท็บที่คุณได้รับโดยการกด (ฉันคิดว่าคุณอาจสับสนเอนทิตี HTML กับชุดอักขระ Unicode)

— josh3736

9

โดยทั่วไปคุณสามารถใช้ & # 9; ในองค์ประกอบใด ๆ ที่มีพื้นที่สีขาวสไตล์ CSS: pre; เช่นในjsfiddle.net/cancerbero_sgx/sp269/3

— Cancerbero

96

ลอง &emsp;

ตามเอกสาร:

เอนทิตีอักขระ&ensp;และ&emsp;แสดงถึง en space และ em space ตามลำดับโดยที่ en space มีขนาดครึ่งหนึ่งของขนาด point และ em space เท่ากับขนาดจุดของฟอนต์ปัจจุบัน สำหรับฟอนต์ระยะห่างคงที่ตัวแทนผู้ใช้สามารถถือว่า en space เทียบเท่ากับอักขระช่องว่างและ em space เท่ากับอักขระเว้นวรรคสองตัว

ลิงก์เอกสาร: https://www.w3.org/MarkUp/html3/specialchars.html

— Abhishek Goel
แหล่งที่มา

48

วางไว้ระหว่าง<pre></pre>แท็กแล้วใช้อักขระนี้	

มันจะไม่ทำงานหากไม่มี<pre></pre>แท็ก

— Raymund
แหล่งที่มา

4

โอเคนี่เยี่ยมมากฉันพยายามใช้	ด้วยตัวเอง แต่ก็ไม่ได้ผล ขอบคุณที่กล่าวถึง<pre>!

— Abbey Graebner

1

ข้อเสนอแนะที่ยอดเยี่ยม ทำไมมันถึงมีพฤติกรรมเช่นนี้?

— pkanane

1

แท็ก <pre> กำหนดข้อความที่จัดรูปแบบไว้แล้วตำแหน่งข้อความใด ๆ ภายในแท็กจะรักษาช่องว่างการแบ่งบรรทัดแท็บ ฯลฯ โดยปกติจะแสดงเป็นแบบอักษรที่มีความกว้างคงที่เช่น Courier

— Raymund

2

คุณสามารถใช้แท็ก html ร่วมกับwhite-space: pre-wrap;หรือwhite-space: pre;

— Petr Hurtak

16

โพสต์ทางเลือกอื่นเพื่อให้สมบูรณ์ยิ่งขึ้น เมื่อฉันลองใช้คำตอบแบบ "ก่อน" พวกเขาได้เพิ่มตัวแบ่งบรรทัดแนวตั้งเพิ่มเติมด้วย

แต่ละแท็บสามารถแปลงเป็นช่องว่างที่ไม่ทำลายลำดับซึ่งไม่จำเป็นต้องมีการห่อ

"&nbsp;&nbsp;&nbsp;&nbsp;"

ไม่แนะนำให้ใช้ซ้ำ / กว้างขวางภายในเพจ วิธีการระยะขอบ / ช่องว่างของ div จะดูสะอาดกว่ามาก

— crokusek
แหล่งที่มา

5

หากมีการใช้แท็บเป็นเครื่องมือในการจัดแนวข้อความทางด้านขวาของแท็บ (โดยที่ข้อความแบบอักษรที่มีความกว้างไม่คงที่ทางด้านซ้ายไม่เท่ากัน) การแปลงเป็นตัวอักษร nbsp จะไม่ช่วยแก้ปัญหา

— Steve Midgley

4

ฉันใช้<span style="display: inline-block; width: 2ch;">	</span>สำหรับแท็บกว้างสองอักขระ

— GrayFace
แหล่งที่มา

สิ่งนี้ไม่เหมือนกับแท็บเป็นเพียงการเพิ่มพื้นที่สีขาวดังนั้นจึงไม่มีคอลัมน์ในสิ่งนี้

— Salami

1

แท็บคือ [HT] หรืออักขระหมายเลข 9 ในไลบรารี Unicode

— DanRedux
แหล่งที่มา

1

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

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

 <div style="padding-left:4.00em;">Indenented text </div>

หรือเป็นคลาสปกติในสไตล์ชีต

.tabbed {padding-left:4.00em;}

จากนั้น HTML อาจมีลักษณะดังนี้

<p>regular paragraph regular paragraph regular paragraph</p>
<p class="tabbed">Indented text Indented text Indented text</p>
<p>regular paragraph regular paragraph regular paragraph</p>

— Duane Lortie
แหล่งที่มา

1

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

— BrainSlugs83