Home » , , , , , , , , » การจัดตำแหน่งข้อความ

การจัดตำแหน่งข้อความ

:: การจัดตำแหน่งข้อความ
ลองเขียนโค้ดมาก็หลายโค้ดแล้วนะค่ะ แต่โค้ดที่ผ่านมาแบบไหน ๆ ก็แสดงข้อความที่ตำแหน่งชิดซ้ายของหน้าจอเสมอ อยากเปลี่ยนตำแหน่งการวางข้อความบ้าง ต้องเขียนโค้ดอย่งไร ในบทความนี้ Webmaster มีคำตอบ (แท็ก) มาฝากค่ะ
ในการกำหนดตำแหน่งในภาษา HTML สามารถกำหนดได้หลายรูปแบบค่ะ ทั้งแบบกำหนดเป็นแท็ก และการกำหนดเป็น Attribute ของแท็กค่ะ โดยมีรูปแบบดังนี้ค่ะ
           1. การกำหนดให้อยู่ตำแหน่งกึ่งกลางด้วยแท็ก Center  <center> ...ข้อความ...</center>
           2. การกำหนดตำแหน่งโดยใช้ Attribute ของแท็ก <p> โดยใช้ Attribute align รูปแบบดังนี้ 
                       <p align = "ตำแหน่ง"> ...ข้อความ...</p>
               ตำแหน่งที่สามารถระบุได้ คือ left center หรือ right
 รูปแบบการจัดตำแหน่งข้อความ

  <html>
  <head><title> ....การจัดตำแหน่งข้อความ....</title></head>
       <body>
               <center><font size = "2"> ข้อความนี้อยู่กึ่งกลาง</font></center><br>
               <p align = "left"><font size = "2"> ข้อความชิดซ้าย </font></p><br>
               <p align = "center"><font size = "2"> ข้อความนี้อยู่กึ่งกลาง </font></p><br>
               <p align = "right"><font size = "2"> ข้อความนี้ชิดขวา </font></p><br>
        </body>
  </html>
นอกจาก คำสั่ง align ทั้งสามแบบแล้ว ยังมีการจัดตำแหน่งอีกแบบหนึ่งค่ะ นั้นก็คือ <p align="justify">....</p>นิยมใช้จัดข้อความที่เป็นเนื้อหาเยอะ ๆ เพื่อให้มีการจัดข้อความอัตโนมัติ โดยข้อความที่จัดด้วยรูปแบบนี้ ข้อความทั้งซ้ายและขวา จะชิดขอบทั้งสองด้าน ทำให้ดูเป็นระเบียบค่ะ ตัวอย่างที่จัดด้วยรูปแบบนี้ ดูได้จาก การจัดตำแหน่ง ณ ข้อความที่ึุคุณกำลังอ่านอยู่ค่ะ (เนื้อหาที่เป็นข้อความเยอะ ๆ ในเว็บ thainextstep.com จัดด้วยรูปแบบนี้ทั้งหมดค่ะ)

0 ความคิดเห็น:

แสดงความคิดเห็น

Popular Posts

  • รวมโค้ดสี
  • การสร้างตาราง
    ::  การสร้างตาราง ในบทที่แล้วเราก็ได้สร้างตารางไปแล้วนะค่ะ แต่สำหรับการสร้างตารางนั้นเรายังมีลูกเล่นอีกมากมาย ที่จะสามารถปรับแต่งให้ตาราง...
  • การสร้าง Site
    การสร้าง Site เพื่อจัดเก็บไฟล์และโฟลเดอร์   ในการสร้างเว็บไซต์นั้น จะประกอบไปด้วยไฟล์ต่าง ๆ มากมาย ไม่ว่าจะเป็นไฟล์ HTML รูปภาพ และ...
  • การใส่สี Background
    การใส่สี Background ให้กับเว็บเพจ บทความนี้เป็นบทความ Basic ของการใช้โปรแกรม Dreamweaver เกี่ยวกับการใส่สีสันให้กับหน้าเว็บเพจ โดยการกำหนดสี...
 
Copyright © 2015 สอนทำเว็บไซต์ ง่ายนิดเดี่ยว