ถ้าต้องการเขียนคำสั่งจัดให้ข้อความอยู่กึ่งกลาง ในภาษา html ต้องใช้คำสั่งใด

อัพเดทวันที่: 05 ธ.ค. 2556

สารบัญ Show

วีดีโอน่ารู้ : โปรเจคร้านอาหารแจกฟรี Project C#
เกี่ยวกับวิกิฮาวนี้
บทความนี้เป็นประโยชน์กับคุณไหม

วีดีโอน่ารู้ : โปรเจคร้านอาหารแจกฟรี Project C#

1.คำสั่งที่ใช้ในการจัดย่อหน้า
คำสั่ง P นี้จะเพิ่มบรรทัดว่างก่อนและหลังตัวอักษรที่เราพิมพ์ไปโดยอัตโนมัติ ตามที่แสดงในตัวอย่าง
รูปแบบ p tag

2.คำสั่งที่ใช้ในการขึ้นบรรทัดใหม่
การตัดบรรทัดใหม่นั้นปรกติ web browser จะทำการตัดให้อยู่แล้ว แต่การตัดคำของ web browser จะตัดเมื่อแสดงผลไม่ได้ แต่ถ้าเราใส่คำสั้ง <br> เข้าไป web browser จะตัดให้ทันที ซึ่งคุณอาจจำเป็นที่จะต้องตัดคำเป็นบรรทัดสั้นๆเช่น การเขียนกลอนดังตัวอย่าง
รูปแบบ br tag

บรรทัดที่ 1 <br>
บรรทัดที่ 2 <br>
บรรทัดที่ 3 <br>

3.คำสั่งที่ใช้กับข้อความที่เป็นหัวเรื่อง
คำสั่ง h จะมีทั้งหมด 6 ลำดับด้วยกัน ไล่ตั้งแต่ h2,h2,h3,h4,h5,h6 ซึ่งขนาดของ h2 จะใหญ่ที่สุดดังตัวอย่างที่แสดง โดยเราจะใช้กับตัวอักษรที่ต้องการให้เป็นหัวเรื่องเพื่อให้อักษรนั้นโดดเด่น ขึ้นมา จะสังเกตุได้ว่าเมื่อใช้ h tag จะตัดตัวอักษรที่ต่อจาก h tag เป็นบรรทัดใหม่อัตโนมัติ
รูปแบบ h tag

4. คำสั่งที่ใช้ในการขีดเส้นคั่น
รูปแบบ hr

<p>เนื้อหาบทที่ 1</p>
<hr>
<p>เนื้อหาบทที่ 2</p>
<hr>

5.คำสั่งที่ใช้ในการจัดตัวอักษรชิดซ้าย ชิดขวา หรือกึ่งกลาง
การจัดให้ตัวอักษรให้ชิดซ้าย ขวา หรือกึ่งกลาง เราจะใช้ Attributes ให้รายละเอียดของ tag โดยเราจะใช้ aling เพื่อบอกว่าให้ชิดซ้าย (align = 'left') ชิดขวา (align = 'right') และ จัดกึ่งกลาง (align = 'center')
รูปแบบ align

<h3 align = 'left'>ชิดซ้าย</h3>
<h3 align = 'right'>ชิดขวา</h3>
<h3 align = 'center'>จัดเข้ากลาง</h3>

6. คำสั่งที่ใช้ในการเปลี่ยนสีพื้นหลัง
bgcolor เป็น Attributes อย่างหนึงเหมือนกันที่ใช้กำหนดสี คุณอาจเปลี่ยนจาก สีเขียว(green) เป็น เหลือง(yellow) หรือสีอื่นๆก็ได้
รูปแบบ bgcolor

<body bgcolor ='green'>
<h2> ดูสีพื้นหลัง </h2> </body>

7. การเขียนคำบรรยาย soure code
ในส่วนของคำบรรยาย soure code นั้นจะไม่แสดงที่ web browser เราเขียนเพื่อบรรยายว่า sorce code ส่วนนี้ใช้ทำอะไร เพื่อความสะดวกเมื่อกลับมาแก้ไข sorce code ในภายหลังเพราะเราอาจจำไม่ได้ว่าเราเขียนส่วนนี้ไว้เพื่ออะไร เพราะว่าจริงๆแล้ว soure code ที่เราใช้งานจริงนั้นจะมีมากมายหลายร้อยบรรทัด ถ้าเราไม่เขียนบรรยายไว้ก็ทำให้เสียเวลาในการหาส่วนที่เราต้องการจะแก้ไข
รูปแบบการเขียนคำบรรยาย source code

<!-- คำบรรยาย source code --!>

ขอขอบคุณ : www.hellomyweb.com ที่เอื้อเฟื่อข้อมูล

Tag : คำสั่งที่ใช้ในการจัดย่อหน้า คำสั่งที่ใช้ในการขึ้นบรรทัดใหม คำสั่งที่ใช้กับข้อความที่เป็นห คำสั่งที่ใช้ในการขีดเส้นคั่น .คำสั่งที่ใช้ในการจัดตัวอักษร คำสั่งที่ใช้ในการเปลี่ยนสีพื้น

บทความวิกิฮาวนี้จะแนะนำวิธีการ center คือจัดหน้าให้ข้อความอยู่ตรงกลางในเว็บ HTML โดยใช้ Cascading Style Sheets (CSS) ปกติคุณทำให้ข้อความอยู่กลางหน้าใน HTML ได้ด้วยแท็ก <center> แต่ตอนนี้แท็กนี้ obsolete คือตกรุ่นไปแล้วในแทบทุกเบราว์เซอร์[1]

1
เปิดไฟล์ที่มี CSS styles. ถึงแท็ก <center> จะ obsolete ไปแล้ว แต่ก็สร้าง element ใหม่เพื่อเพิ่มในส่วนไหนก็ได้ของหน้า เพื่อทำให้ข้อความอยู่ตรงกลางภายในขอบเขตที่กำหนด ถ้าไม่มีไฟล์ CSS แยก ให้หา styles ด้านบนของไฟล์ HTML ระหว่างแท็ก "<style>" กับ "</style>"[2]
- ถ้ายังไม่มีแท็ก <style> กับ </style> ให้ใส่ไว้ล่าง <body> ทางด้านบนของไฟล์ ดังต่อไปนี้:
2
กำหนด class ที่ใช้จัดข้อความให้อยู่ตรงกลาง. แท็ก <div> จะเป็นตัวกำหนดให้โค้ด HTML อ้างถึงส่วนใดส่วนหนึ่งของข้อความ เพราะงั้นต้องกำหนด class ให้แท็ก โดยพิมพ์โค้ดต่อไปนี้ในช่องว่างระหว่างแท็ก "style" ต้องกด ↵ Enter 2 ครั้งด้วยหลังบรรทัดแรก
3
ใส่คุณสมบัติ text-align. พิมพ์ text-align: center; ในช่องว่างระหว่าง 2 ปีกกาในหัวข้อ div.a ก็จะได้ header ออกมาเป็น
4
ใส่แท็ก div ที่เหมาะสมให้ข้อความที่จะปรับมาตรงกลาง. โดยใส่แท็ก <div class="a"> ด้านบนข้อความที่จะจัดอยู่ตรงกลาง แล้วปิดด้วยแท็ก </div> ล่างข้อความนั้น เช่น ถ้าจะให้ header และข้อความในย่อหน้า ขยับมาอยู่ตรงกลางหน้า ก็ให้พิมพ์โค้ดต่อไปนี้
5
ใช้แท็ก div.a เพื่อจัดส่วนอื่นให้อยู่กลางหน้า. ถ้าจะจัด element อื่นมาอยู่กลางหน้า (เช่น เนื้อหาระหว่างแท็กอย่าง <p></p> กับ <h2></h2>) ให้พิมพ์ <div class="a"> หน้าข้อความ แล้วปิดท้ายด้วย </div> ปกติคำสั่งปรับไอเท็มให้มาอยู่ตรงกลางคือ "div.a" ใช้คำสั่งนี้แล้วก็จะจัดหน้าให้ข้อความมาอยู่ตรงกลางเช่นกัน

ตรวจทานโค้ด. ถึงจะเนื้อหาต่างกัน แต่โค้ดที่ได้จะออกมาประมาณนี้[3]

<!DOCTYPE html>
<html>
<body>
<style>
div.a {
	text-align: center;
}
</style>

<div class="a">
<h2>ยินดีต้อนรับสู่เว็บของฉัน</h2>
<p>เว็บนี้จัดทำเพื่อการศึกษาเท่านั้น</p>
</div>

<div class="a">
<h2>ยินดีรับการสนับสนุน</h2>
<p>ขอขอบคุณ</p>
</div>

</body>
</html>

โฆษณา

1
เปิดโค้ด HTML. เป็นวิธีการใช้แท็ก HTML <center> ที่ตอนนี้ obsolete หรือเลิกใช้ไปแล้ว ตั้งแต่ธันวาคม 2561 เป็นต้นมา บางเบราว์เซอร์อาจยังพอรองรับบ้าง แต่ไม่แนะนำให้ใช้แท็กนี้ในระยะยาว
2

หาข้อความที่จะจัดให้อยู่ตรงกลาง. เลื่อนลงไปจนเจอ header เนื้อหา หรือข้อความส่วนอื่นๆ ที่อยากจัดให้อยู่กลางหน้า
3
ใส่แท็ก "center" หัว-ท้ายข้อความ. แท็ก center จะอยู่ในฟอร์แมต <center>text</center> โดยเปลี่ยน "text" เป็นข้อความ ถ้าข้อความคุณมี tag อยู่แล้ว (เช่น "<p></p>" ของย่อหน้าข้อความ) แท็ก "center" จะอยู่นอกแท็กเดิมที่มีได้

ตรวจทานโค้ด HTML. โค้ดที่ได้จะออกมาหน้าตาประมาณนี้[4]

<!DOCTYPE html>
<html>
<body>

<h2><center>ยินดีต้อนรับสู่เว็บของฉัน</center></h2>
<center>อ่านให้สนุกจ้า!</center>
<p1>เว็บนี้จัดทำเพื่อการศึกษาเท่านั้น</p1>

</body>
</html>