แท็ก

แท็ก ระบุอักขระแท็บในข้อความ คล้ายกับการใช้ลำดับการหลีกเลี่ยง /t

1 2 3\t\t\t4
แสดง:
1 2 3 4

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

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

แท็ก...

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

ขอบซ้าย. ขนาดระยะขอบซ้ายเป็นจุด อะนาล็อกเป็นคุณสมบัติ leftmargin ของคลาส TextFormat

ระยะขอบขวา ค่าของระยะขอบด้านขวาเป็นพอยต์ อะนาล็อกคือคุณสมบัติ rightmargin ของคลาส TextFormat

เยื้อง เยื้องบรรทัดแรกของย่อหน้าเป็นจุด ในคุณสมบัติของคลาส TextFormat จะคล้ายกับคุณสมบัติการเยื้อง

ปิดกั้น

การเยื้องย่อหน้าข้อความทางด้านซ้ายเป็นจุด อะนาล็อก - คุณสมบัติ blockIndent
รูปแบบข้อความของคลาส

เป็นผู้นำ ระยะห่างระหว่างเส้นเป็นจุด คุณสมบัติที่คล้ายกันของคลาส TextFormat เป็นผู้นำ

แท็บสต็อป แอ็ตทริบิวต์ระบุว่าค่าออฟเซ็ตบรรทัดใดในจุดที่แต่ละอักขระแท็บในลำดับจะเกิดขึ้น ค่าของมันคือรายการตัวเลขที่ระบุระยะทางที่บรรทัดจะเลื่อนไปที่หน้าต่างหากพิมพ์อักขระแท็บ 1, 2, 3, ... n ในแถว แอนะล็อกของแอตทริบิวต์ TABSTOPS คือคุณสมบัติ tabStops ของคลาส TextFormat

เสา.html=pole.border=pole.multiline=true;
เสา.htmlText="

0din tabR> สอง tabR>
สามทาบาร์>

";

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

แท็ก...

แท็ก ออกแบบมาเพื่อการใช้งานในชั้นเรียน สไตล์ CSSเกี่ยวข้องกับส่วนของข้อความที่กำหนดเอง

ชื่อคลาสระบุไว้ในแอตทริบิวต์ CLASS

This.createTextField("เสา", 0, 150, 150, 200, 90);
เสา.autoSize = เสา.border=pole.multiline=true;
// สร้างสไตล์คลาสสามสไตล์โดยกำหนดข้อความสีแดง เขียว และน้ำเงิน
สไตล์ var:TextField.Stylesheet = TextField.Stylesheet ใหม่ ();
var green_text:String = ".GREEN (สี:#00FF00)";
var red_text:String = ".RED (สี:#FF0000)";
var blue_text:String = ".BLUE (สี:#0000FF)";
style.parseCSS(green_text+red_text+blue_text);
เสา.styleSheet=สไตล์;
// แสดงข้อความด้วยสไตล์ที่สร้างขึ้น
เสา.text = " 3ข้อความสีเขียว

ข้อความสีแดง
ข้อความสีน้ำเงิน ";

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

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

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

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

จริงอยู่ สำหรับการจัดรูปแบบภาพประเภทนี้ (ซึ่งจะไม่ปรากฏบนหน้าเว็บ) ส่วนใหญ่มักจะไม่ใช่ช่องว่างที่ใช้ แต่เป็นอักขระแท็บและตัวแบ่งบรรทัด มีกฎดังกล่าว - เมื่อคุณเริ่มเขียนแบบซ้อน แท็ก HTML, ที่ เยื้องโดยใช้แท็บ(แป้น Tab บนแป้นพิมพ์) และเมื่อคุณปิดแท็กนี้ ให้ลบการเยื้องออก (คีย์ผสม Shift+Tab บนแป้นพิมพ์)

จะต้องดำเนินการนี้เพื่อให้แท็กเปิดและปิดอยู่ในระดับแนวตั้งเดียวกัน (ที่จำนวนแท็บจากขอบด้านขวาของหน้าเท่ากันในโปรแกรมแก้ไข Html ของคุณ เช่น Notepad++ ที่ฉันเขียน) นอกจากนี้ ฉันแนะนำให้คุณทันทีหลังจากเขียนองค์ประกอบเปิด ให้ขึ้นบรรทัดใหม่หลายบรรทัดและเขียนบรรทัดปิดที่ระดับเดียวกันทันที (จำนวนแท็บ) เพื่อที่คุณจะได้ไม่ลืมทำในภายหลัง

เหล่านั้น. องค์ประกอบการเปิดและปิดควรอยู่ในระดับเดียวกันในแนวตั้ง และแท็กภายในควรเลื่อนไปหนึ่งอักขระแท็บ และองค์ประกอบปิดและเปิดควรวางอีกครั้งในระดับเดียวกัน

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

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

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

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

มีการเข้ารหัสจำนวนมาก แต่สำหรับภาษา Html การเข้ารหัสเวอร์ชันขยายจะถูกนำมาใช้เป็นค่าเริ่มต้น

ในการเข้ารหัสข้อความนี้ สามารถเขียนได้เพียง 256 ตัวอักษร - 128 ตัวอักษรจาก ASCII และอีก 128 ตัวอักษรสำหรับตัวอักษรรัสเซีย เป็นผลให้เกิดปัญหากับการใช้งานบนเว็บไซต์ของอักขระที่ไม่รวมอยู่ใน ASCII และไม่ใช่ตัวอักษรรัสเซียรวมอยู่ใน การเข้ารหัสของ Windows 1251 (CP1251) คุณตัดสินใจที่จะใช้เครื่องหมายตัวหนอนหรือเครื่องหมายอะพอสทรอฟี่ แต่ความเป็นไปได้ดังกล่าวเริ่มแรกในการใช้งานแล้ว ภาษา HTMLไม่รวมการเข้ารหัส

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

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

สามารถเขียนอักขระได้มากกว่า 60,000 ตัวใน Unicode - สิ่งสำคัญคือสัญลักษณ์ช่วยจำที่คุณต้องการได้รับการสนับสนุนโดยแบบอักษรที่ใช้ในไซต์ของคุณ มีแบบอักษรที่รองรับอักขระ Unicode เกือบทั้งหมด และมีตัวเลือกเฉพาะกับชุดอักขระบางชุดเท่านั้น

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

เครื่องหมาย	รหัส HTML	ทศนิยม รหัส	คำอธิบาย
			พื้นที่ไม่ทำลาย
			พื้นที่แคบ (en-width เป็นตัวอักษร n)
			พื้นที่กว้าง (ความกว้าง em เป็นตัวอักษร m)
–	-	–	en dash (en-dash)
-	—	—	เอ็มแดช (เอ็มแดช)
­	-	­	โอนอ่อน
ก		́	ความเครียดจะอยู่หลังตัวอักษร "ความเครียด"
©		©	ลิขสิทธิ์
®	®	®	เครื่องหมายการค้าจดทะเบียน
™	™	™	เครื่องหมายการค้า
º	º	º	หอกของดาวอังคาร
ª	ª	ª	กระจกเงาของวีนัส
‰	‰	‰	ppm
π	π	π	pi (ใช้ไทม์นิวโรมัน)
¦	¦	¦	เส้นประแนวตั้ง
§	§	§	ย่อหน้า
°	°	°	ระดับ
µ	µ	µ	เครื่องหมายไมโคร
¶	¶	¶	เครื่องหมายย่อหน้า
…	…	…	จุดไข่ปลา
‾	‾	‾	ซ้อนทับ
´	´	´	เครื่องหมายเน้นเสียง
№		№	เครื่องหมายหมายเลข
🔍		🔍	แว่นขยาย (เอียงไปทางซ้าย)
🔎		🔎	แว่นขยาย (เอียงไปทางขวา)
สัญญาณของการคำนวณทางคณิตศาสตร์และการดำเนินการทางคณิตศาสตร์
×	×	×	คูณ
÷	÷	÷	แบ่ง
<	<		น้อย
>	>	>	มากกว่า
±	±	±	บวก/ลบ
¹	¹	¹	ระดับ 1
²	²	²	ระดับ 2
³	³	³	ระดับ 3
¬	¬	¬	การปฏิเสธ
¼	¼	¼	หนึ่งในสี่
½	½	½	ครึ่งหนึ่ง
¾	¾	¾	สามส่วน
⁄	⁄	⁄	จุดทศนิยม
−	−	−	ลบ
≤	≤	≤	น้อยกว่าหรือเท่ากัน
≥	≥	≥	มากกว่าหรือเท่ากัน
≈	≈	≈	ประมาณ (เกือบ) เท่ากัน
≠	≠	≠	ไม่เท่ากับ
≡	≡	≡	เหมือนกัน
√	√	√	รากที่สอง (ราก)
∞	∞	∞	อนันต์
∑	∑	∑	เครื่องหมายผลรวม
∏	∏	∏	เครื่องหมายการทำงาน
∂	∂	∂	ส่วนต่างบางส่วน
∫	∫	∫	บูรณาการ
∀	∀	∀	สำหรับทุกคน (มองเห็นได้เฉพาะในกรณีที่เป็นตัวหนา)
∃	∃	∃	มีอยู่จริง
∅	∅	∅	ชุดเปล่า
Ø	Ø	Ø	เส้นผ่านศูนย์กลาง
∈	∈	∈	เป็นของ
∉	∉	∉	ไม่ได้อยู่ใน
∋	∋	∗	ประกอบด้วย
⊂	⊂	⊂	เป็นเซตย่อย
⊃	⊃	⊃	เป็นซุปเปอร์เซ็ต
⊄	⊄	⊄	ไม่ใช่เซตย่อย
⊆	⊆	⊆	เป็นสับเซตหรือเท่ากับ
⊇	⊇	⊇	เป็นซุปเปอร์เซตหรือเท่ากับ
⊕	⊕	⊕	บวกเป็นวงกลม
⊗	⊗	⊗	เครื่องหมายคูณในวงกลม
⊥	⊥	⊥	ตั้งฉาก
∠	∠	∠	มุม
∧	∧	∧	ตรรกะและ
∨	∨	∨	ตรรกะหรือ
∩	∩	∩	จุดตัด
∪	∪	∪	ยูเนี่ยน
สัญญาณสกุลเงิน
₽		₽	รูเบิล ต้องใช้เครื่องหมายรูเบิลร่วมกับตัวเลข มาตรฐานยูนิโค้ด 7.0 หากคุณไม่เห็นรูปภาพ ให้อัปเดตแบบอักษร Unicode ของคุณ
€	€	€	ยูโร
¢	¢	¢	เซ็นต์
£	£	£	ปอนด์
¤	¤	¤	สัญลักษณ์สกุลเงิน
¥	¥	¥	สัญลักษณ์เยนและหยวน
ƒ	ƒ	ƒ	สัญญาณฟลอริน
เครื่องหมาย
	.		เครื่องหมายง่ายๆ
○		○	วงกลม
·	·	·	จุดกึ่งกลาง
†		†	ข้าม
‡		‡	ข้ามสองครั้ง
♠	♠	♠	ยอดเขา
♣	♣	♣	สโมสร
			หัวใจ
♦	♦	♦	เพชร
◊	◊	◊	รูปสี่เหลี่ยมขนมเปียกปูน
✏		✏	ดินสอ
✎		✎	ดินสอ
✐		✐	ดินสอ
✍		✍	มือ
คำพูด
"	"	"	เครื่องหมายคำพูดคู่
&	&	&	เครื่องหมายแอมเพอร์แซนด์
«	«	«	เครื่องหมายคำพูดพิมพ์ด้านซ้าย (เครื่องหมายคำพูดรูปแฉกแนวตั้ง)
»	»	»	เครื่องหมายคำพูดพิมพ์ขวา (เครื่องหมายคำพูดก้างปลา)
‹		‹	การเปิดใบเสนอราคามุมเดียว
›		›	การปิดใบเสนอราคามุมเดียว
′	′	′	นายกรัฐมนตรี (นาที ฟุต)
″	″	″	นายกคู่ (วินาที นิ้ว)
‘	‘	‘	เครื่องหมายคำพูดเดี่ยวบนซ้าย
’	’	’	เครื่องหมายคำพูดเดี่ยวด้านบนขวา
‚	‚	‚	เครื่องหมายคำพูดเดี่ยวด้านขวาล่าง
“	“	“	ตีนซ้าย
”	”	”	อ้างเท้าขวาบน
„	„	„	อ้างอิงเท้าล่างขวา
❛		❛	เครื่องหมายคำพูดเปิดภาษาอังกฤษเดี่ยว
❜		❜	เครื่องหมายคำพูดปิดภาษาอังกฤษเดี่ยว
❝		❝	เปิดเครื่องหมายคำพูดคู่
❞		❞	ปิดเครื่องหมายคำพูดคู่
ลูกศร
←	←	←	ลูกศรซ้าย
			ลูกศรขึ้น
→	→	→	ลูกศรขวา
↓	↓	↓	ลูกศรลง
↔	↔	↔	ลูกศรซ้ายและขวา
↕		↕	ลูกศรขึ้นและลง
↵	↵	↵	การคืนรถ
⇐	⇐	⇐	ลูกศรซ้ายคู่
⇑	⇑	⇑	ลูกศรขึ้นสองเท่า
⇒	⇒	⇒	ลูกศรขวาคู่
⇓	⇓	⇓	ลูกศรลงสองครั้ง
⇔	⇔	⇔	ลูกศรคู่ซ้ายและขวา
⇕		⇕	ลูกศรขึ้นและลงสองเท่า
▲		▲	ลูกศรขึ้นสามเหลี่ยม
▼		▼	ลูกศรลงรูปสามเหลี่ยม
			ลูกศรขวารูปสามเหลี่ยม
◄		◄	ลูกศรซ้ายรูปสามเหลี่ยม
ดวงดาว เกล็ดหิมะ
☃		☃	สโนว์แมน
❄		❄	เกล็ดหิมะ
❅		❅	เกล็ดหิมะที่ประกบด้วยแชมร็อก
❆		❆	เกล็ดหิมะที่มีมุมแหลมคม
★		★	ดาวสีเทา
☆		☆	ดาวว่าง
✪		✪	ดาวที่ยังไม่เต็มในวงกลมที่เต็มไป
✫		✫	เต็มไปด้วยดาวที่มีวงกลมเปิดอยู่ข้างใน
✯		✯	ดาวหมุน
⚝		⚝	วาดดาวสีขาว
⚪		⚪	วงกลมเปิดตรงกลาง
⚫		⚫	วงกลมที่เต็มไปด้วยตรงกลาง
⚹		⚹	Sextile (แบบเกล็ดหิมะ)
✵		✵	ดาวหมุนแปดแฉก
❉		❉	ดาวที่มีปลายเป็นทรงกลม
❋		❋	ใบพัดรูปดาวทรงหยดแปดแฉกอันหนา
✺		✺	เครื่องหมายดอกจันสิบหกแฉก
✹		✹	ดาวสิบสองแฉก
✸		✸	ดาวเต็มแปดแฉกตัวหนา
✶		✶	ดาวเต็มหกแฉก
✷		✷	ดาวเต็มแปดแฉก
✴		✴	ดาวแปดแฉก
✳		✳	ดาวแปดแฉก
✲		✲	ดาวที่มีจุดศูนย์กลางว่างเปล่า
✱		✱	ดาวอ้วน
✧		✧	ดาวเปิดสี่แฉกชี้
✦		✦	ดาวเต็มสี่แฉก
⍟		⍟	ติดดาวเป็นวงกลม
⊛		⊛	เกล็ดหิมะเป็นวงกลม
นาฬิกาเวลา
⏰		⏰	ดู
⌚		⌚	ดู
⌛		⌛	นาฬิกาทราย
⏳		⏳	นาฬิกาทราย

มีความน่าสนใจค่อนข้างมาก วิธีการได้รับ รหัส HTMLช่วยในการจำสำหรับสัญญาณที่คุณต้องการ ในการดำเนินการนี้ เพียงแค่เปิดตัวแก้ไข ไมโครซอฟต์ เวิร์ดให้สร้างเอกสารใหม่และเลือกจาก เมนูด้านบน“แทรก” - “สัญลักษณ์” (ฉันใช้เวอร์ชัน 2003 ดังนั้นฉันจึงไม่ทราบวิธีดำเนินการที่คล้ายกันในเวอร์ชันที่ใหม่กว่า)

ในหน้าต่างที่เปิดขึ้น คุณจะต้องเลือกแบบอักษร เช่น Times New Roman (หรือแบบอักษรอื่นใดที่จะปรากฏบนคอมพิวเตอร์ส่วนใหญ่ของผู้เยี่ยมชมเว็บไซต์ของคุณอย่างชัดเจน เช่น Courier หรือ Arial เป็นต้น)

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

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

การเว้นวรรคแบบไม่แยกและเครื่องหมายยัติภังค์แบบอ่อนในตัวอย่าง

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

เมื่อเขียนบทความ หากคุณต้องการแทรกเครื่องหมายและ (&) หรือวงเล็บมุมเปิด (<), то для этого обязательно нужно использовать спецсимволы. Дело в том, что эти знаки в Html означают начало тега и браузер будет рассматривать их именно с этой точки зрения и отображать в тексте не будет.

นั่นคือหากคุณกำลังเขียนบทความซึ่งคุณจะต้องแทรก เช่น แท็กที่แสดงลงในข้อความ< body>หรือคุณเพียงแค่ต้องใส่เครื่องหมายน้อยกว่า (<), то сделав это без использования подстановок на веб странице вы ничего не увидите, т.к. браузер, обнаружив «<» , поймет, что это Html тег, а не текст статьи.

ดังนั้น คุณจะต้องแทรกโครงสร้างต่อไปนี้เพื่อแก้ไขปัญหาที่คล้ายกัน:

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

จะต้องดำเนินการนี้จึงจะเข้าสู่หน้าได้<, а не отображение левой угловой скобки (<), в которую преобразует браузер мнемонику <, обнаружив при разборе знак амперсанда. Хитро, но вы все поймете попробовав это на практике.

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

1400GB.

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

คำยาวยาว;

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

ขอให้โชคดี! พบกันเร็ว ๆ นี้ในหน้าของเว็บไซต์บล็อก

คุณอาจจะสนใจ

MailTo - คืออะไรและจะสร้างลิงค์ใน Html เพื่อส่งอีเมลได้อย่างไร
แท็กและคุณลักษณะของส่วนหัว H1-H6, เส้นแนวนอน Hr, ตัวแบ่งบรรทัด Br และย่อหน้า P ตามมาตรฐาน Html 4.01
วิธีแทรกลิงค์และรูปภาพ (ภาพถ่าย) ลงในแท็ก HTML - IMG และ A
Html ภาษามาร์กอัปไฮเปอร์เท็กซ์คืออะไรและวิธีดูรายการแท็กทั้งหมดในเครื่องมือตรวจสอบ W3C
แบบอักษร (ใบหน้า ขนาด และสี) Blockquote และแท็ก Pre - การจัดรูปแบบข้อความแบบเดิมใน HTML ล้วนๆ (ไม่ใช้ CSS)
วิธีการตั้งค่าสีในโค้ด Html และ CSS, การเลือกเฉดสี RGB ในตาราง, เอาต์พุต Yandex และโปรแกรมอื่น ๆ
คำสั่งความคิดเห็นและ Doctype ในโค้ด Html รวมถึงแนวคิดขององค์ประกอบบล็อกและอินไลน์ (แท็ก)
รายการในโค้ด Html - แท็ก UL, OL, LI และ DL

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

เครื่องหมาย	รหัส	ช่วยในการจำ	คำอธิบาย
			พื้นที่ไม่ทำลาย
			พื้นที่แคบ (en-width เป็นตัวอักษร n)
			พื้นที่กว้าง (ความกว้าง em เป็นตัวอักษร m)
–	-	–	en dash (en-dash)
-	—	—	เอ็มแดช (เอ็มแดช)
­	-	­	โอนอ่อน
ก		́	ความเครียดจะอยู่หลังตัวอักษร "ความเครียด"
©		©	ลิขสิทธิ์
®	®	®	เครื่องหมายการค้าจดทะเบียน
™	™	™	เครื่องหมายการค้า
º	º	º	หอกของดาวอังคาร
ª	ª	ª	กระจกเงาของวีนัส
‰	‰	‰	ppm
π	π	π	pi (ใช้ไทม์นิวโรมัน)
¦	¦	¦	เส้นประแนวตั้ง
§	§	§	ย่อหน้า
°	°	°	ระดับ
µ	µ	µ	เครื่องหมายไมโคร
¶	¶	¶	เครื่องหมายย่อหน้า
…	…	…	จุดไข่ปลา
‾	‾	‾	ซ้อนทับ
´	´	´	เครื่องหมายเน้นเสียง
№		№	เครื่องหมายหมายเลข
🔍		🔍	แว่นขยาย (เอียงไปทางซ้าย)
🔎		🔎	แว่นขยาย (เอียงไปทางขวา)
สัญญาณของการคำนวณทางคณิตศาสตร์และการดำเนินการทางคณิตศาสตร์
×	×	×	คูณ
÷	÷	÷	แบ่ง
<	<		น้อย
>	>	>	มากกว่า
±	±	±	บวก/ลบ
¹	¹	¹	ระดับ 1
²	²	²	ระดับ 2
³	³	³	ระดับ 3
¬	¬	¬	การปฏิเสธ
¼	¼	¼	หนึ่งในสี่
½	½	½	ครึ่งหนึ่ง
¾	¾	¾	สามส่วน
⁄	⁄	⁄	จุดทศนิยม
−	−	−	ลบ
≤	≤	≤	น้อยกว่าหรือเท่ากัน
≥	≥	≥	มากกว่าหรือเท่ากัน
≈	≈	≈	ประมาณ (เกือบ) เท่ากัน
≠	≠	≠	ไม่เท่ากับ
≡	≡	≡	เหมือนกัน
√	√	√	รากที่สอง (ราก)
∞	∞	∞	อนันต์
∑	∑	∑	เครื่องหมายผลรวม
∏	∏	∏	เครื่องหมายการทำงาน
∂	∂	∂	ส่วนต่างบางส่วน
∫	∫	∫	บูรณาการ
∀	∀	∀	สำหรับทุกคน (มองเห็นได้เฉพาะในกรณีที่เป็นตัวหนา)
∃	∃	∃	มีอยู่จริง
∅	∅	∅	ชุดเปล่า
Ø	Ø	Ø	เส้นผ่านศูนย์กลาง
∈	∈	∈	เป็นของ
∉	∉	∉	ไม่ได้อยู่ใน
∋	∋	∗	ประกอบด้วย
⊂	⊂	⊂	เป็นเซตย่อย
⊃	⊃	⊃	เป็นซุปเปอร์เซ็ต
⊄	⊄	⊄	ไม่ใช่เซตย่อย
⊆	⊆	⊆	เป็นสับเซตหรือเท่ากับ
⊇	⊇	⊇	เป็นซุปเปอร์เซตหรือเท่ากับ
⊕	⊕	⊕	บวกเป็นวงกลม
⊗	⊗	⊗	เครื่องหมายคูณในวงกลม
⊥	⊥	⊥	ตั้งฉาก
∠	∠	∠	มุม
∧	∧	∧	ตรรกะและ
∨	∨	∨	ตรรกะหรือ
∩	∩	∩	จุดตัด
∪	∪	∪	ยูเนี่ยน
สัญญาณสกุลเงิน
€	€	€	ยูโร
¢	¢	¢	เซ็นต์
£	£	£	ปอนด์
¤	¤t;	¤	สัญลักษณ์สกุลเงิน
¥	¥	¥	สัญลักษณ์เยนและหยวน
ƒ	ƒ	ƒ	สัญญาณฟลอริน
เครื่องหมาย
	.		เครื่องหมายง่ายๆ
○		○	วงกลม
·	·	·	จุดกึ่งกลาง
†		†	ข้าม
‡		‡	ข้ามสองครั้ง
♠	♠	♠	ยอดเขา
♣	♣	♣	สโมสร
			หัวใจ
♦	♦	♦	เพชร
◊	◊	◊	รูปสี่เหลี่ยมขนมเปียกปูน
✏		✏	ดินสอ
✎		✎	ดินสอ
✐		✐	ดินสอ
✍		✍	มือ
คำพูด
"	"	"	เครื่องหมายคำพูดคู่
&	&	&	เครื่องหมายแอมเพอร์แซนด์
«	«	«	เครื่องหมายคำพูดพิมพ์ด้านซ้าย (เครื่องหมายคำพูดรูปแฉกแนวตั้ง)
»	»	»	เครื่องหมายคำพูดพิมพ์ขวา (เครื่องหมายคำพูดก้างปลา)
‹		‹	การเปิดใบเสนอราคามุมเดียว
›		›	การปิดใบเสนอราคามุมเดียว
′	′	′	นายกรัฐมนตรี (นาที ฟุต)
″	″	″	นายกคู่ (วินาที นิ้ว)
‘	‘	‘	เครื่องหมายคำพูดเดี่ยวบนซ้าย
’	’	’	เครื่องหมายคำพูดเดี่ยวด้านบนขวา
‚	‚	‚	เครื่องหมายคำพูดเดี่ยวด้านขวาล่าง
“	“	“	ตีนซ้าย
”	”	”	อ้างเท้าขวาบน
„	„	„	อ้างอิงเท้าล่างขวา
❛		❛	เครื่องหมายคำพูดเปิดภาษาอังกฤษเดี่ยว
❜		❜	เครื่องหมายคำพูดปิดภาษาอังกฤษเดี่ยว
❝		❝	เปิดเครื่องหมายคำพูดคู่
❞		❞	ปิดเครื่องหมายคำพูดคู่
ลูกศร
←	←	←	ลูกศรซ้าย
			ลูกศรขึ้น
→	→	→	ลูกศรขวา
↓	↓	↓	ลูกศรลง
↔	↔	↔	ลูกศรซ้ายและขวา
↕		↕	ลูกศรขึ้นและลง
↵	↵	↵	การคืนรถ
⇐	⇐	⇐	ลูกศรซ้ายคู่
⇑	⇑	⇑	ลูกศรขึ้นสองเท่า
⇒	⇒	⇒	ลูกศรขวาคู่
⇓	⇓	⇓	ลูกศรลงสองครั้ง
⇔	⇔	⇔	ลูกศรคู่ซ้ายและขวา
⇕		⇕	ลูกศรขึ้นและลงสองเท่า
▲		▲	ลูกศรขึ้นสามเหลี่ยม
▼		▼	ลูกศรลงรูปสามเหลี่ยม
			ลูกศรขวารูปสามเหลี่ยม
◄		◄	ลูกศรซ้ายรูปสามเหลี่ยม
ดวงดาว เกล็ดหิมะ
☃		☃	สโนว์แมน
❄		❄	เกล็ดหิมะ
❅		❅	เกล็ดหิมะที่ประกบด้วยแชมร็อก
❆		❆	เกล็ดหิมะที่มีมุมแหลมคม
★		★	ดาวสีเทา
☆		☆	ดาวว่าง
✪		✪	ดาวที่ยังไม่เต็มในวงกลมที่เต็มไป
✫		✫	เต็มไปด้วยดาวที่มีวงกลมเปิดอยู่ข้างใน
✯		✯	ดาวหมุน
⚝		⚝	วาดดาวสีขาว
⚪		⚪	วงกลมเปิดตรงกลาง
⚫		⚫	วงกลมที่เต็มไปด้วยตรงกลาง
⚹		⚹	Sextile (แบบเกล็ดหิมะ)
✵		✵	ดาวหมุนแปดแฉก
❉		❉	ดาวที่มีปลายเป็นทรงกลม
❋		❋	ใบพัดรูปดาวทรงหยดแปดแฉกอันหนา
✺		✺	เครื่องหมายดอกจันสิบหกแฉก
✹		✹	ดาวสิบสองแฉก
✸		✸	ดาวเต็มแปดแฉกตัวหนา
✶		✶	ดาวเต็มหกแฉก
✷		✷	ดาวเต็มแปดแฉก
✴		✴	ดาวแปดแฉก
✳		✳	ดาวแปดแฉก
✲		✲	ดาวที่มีจุดศูนย์กลางว่างเปล่า
✱		✱	ดาวอ้วน
✧		✧	ดาวเปิดสี่แฉกชี้
✦		✦	ดาวเต็มสี่แฉก
⍟		⍟	ติดดาวเป็นวงกลม
⊛		⊛	เกล็ดหิมะเป็นวงกลม
นาฬิกาเวลา
⏰		⏰	ดู
⌚		⌚	ดู
⌛		⌛	นาฬิกาทราย
⏳		⏳	นาฬิกาทราย

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

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

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