About DwThai.Com 00

DwThai.Com Logo

DwThai.Com

Tip and Trick Dreamweaver

ก่อตั้งเมื่อปีพุทธศักราช ๒๕๔๖





ค้นหาข้อมูลใน DwThai.Com

กฏการใช้งานตาราง (Rule used for Table) [Article ID : 153]


เรื่อง :: กฏการใช้ตารางในการออกแบบ Webpage


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

กฏของตาราง


ตาราง
Table
Table
ตาราง
ตาราง
Table

1. ตารางจะมีขนาดเล็กกว่าปริมาณข้อมูลซึ่งอยู่ภายในตารางนั้นไม่ได้ เช่น ข้อมูลคุณมีขนาดเป็น 200 pixels แต่คุณจะกำหนดให้ตารางมีขนาดเป็น 180 pixels ไม่ได้ ถึงเราจะสามารถกรอกตัวเลขลงไปในค่าของ width หรือ height ก็ตาม ขนาดที่กรอกลงไปนั้น ไม่ได้หมายความว่า ตารางนั้นจะมีขนาดดังที่คุณกำหนดนั้นไว้ไม่ เพราะตารางจะทำการขยายออกตามปริมาณข้อมูลซึ่งอยู่ภายในตารางนั้น

2. ถ้าความกว้างของตาราง และความกว้างของเซลมีความไม่สัมพันธ์กันเกิดขึ้น เช่น ตารางกำหนดขนาดเป็น 500 pixel แต่เซลต่าง ๆ เรากำหนดเป็น 2 คอลัมน์คอลัมน์ละ 100 pixel 2 คอลัมน์รวมกันก็จะเท่ากันกับ 200 pixel เท่านั้น ถ้าเป็นดังนี้ Browser ของเราจะยึดเอาความกว้างของตารางเป็นหลักครับ นั้นคือ 500 pixel นั้นเอง


3. Cell ซึ่งอยู่ในแถวเดียวกันต้องมีความสูงเท่ากันเสมอ เราจะไม่สามารถกำหนดให้ cell ใด cell หนึ่งสูงกว่าเซลในแถวเดียวกันได้ ยกเว้นมีการรวมเซลเกิดขึ้นกับเซลข้าง ๆ และความกว้างของเซลก็ยึดหลักคล้ายคลึงกันนี้

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

6. บางครั้งเราเห็นว่าในตารางไม่มีข้อมูลใดปรากฏอยู่เลยเมื่อสร้างตารางขึ้นมาใหม่ ๆ นั้นเป็นการเข้าใจผิด เพราะถ้าคุณเปิดดูที่ Source Code คุณจะเห็นรหัสการเว้นวรรคของ HTML ปรากฏอยู่ ( ) นั้นอาจจะเป็นสาเหตุหนึ่งที่ว่าทำไมบางครั้งเราไม่สามารถกำหนดขนาดความสูงของตารางเป็น 3-5 pixel ได้

5. การใช้ตารางให้ยึดการแสดงผลจากการชมด้วย Web Browser เป็นหลัก อย่ายึดการแสดงผลกับหน้าจอโปรแกรม Dreamweaver

** ทั้งหมดคือแนวคิดกว้าง ๆ ของการใช้งานตารางอย่างเข้าใจ เป็นข้อคิดเห็นจากประสบการณ์ครับ **
About the Author
Mr.Sittichai Raksasuk

Mr.Sittichai Raksasuk

Sittichai is a Web Developer and Web Technology Instructor for over 10 yrs. He is also a webmaster of dwthai.com and author jQuery with Dreamweaver (2010). DwThai.Com is a website for web developer using Adobe Dreamweaver.

Contact with him : dwthai@gmail.com



บทความอื่นที่คุณอาจสนใจ

เปลี่ยน Cursor หรือตัวชี้เมาท์ง่าย ๆ สไตล์เรา

เรื่อง : เปลี่ยน Cursor หรือตัวชี้ของเมาท์บนหน้าเว็บเพจ มีแฟนเว็บไถ่ถามกันเข้ามาว่า...จะเปลี่ยนรูปร่างของเมาท์ให้เป็นรู...  

ติดตั้ง Search Engine ของ Google ในเว็บไซต์

เรื่อง : ติดตั้ง Search Engine ของ Google ในเว็บไซต์ของเรา มีคนเข้ามาโพสต์ถามกันมากมายที่หน้า Webboard ว่าอยากจะมี ...  

Event Handler ที่นักพัฒนาเว็บไซต์ควรรู้ (JavaScript)

เรื่อง : Event Handler ที่นักพัฒนาเว็บไซต์ควรรู้ Event Handler (อีเวนท์ แฮน’เดลอะ) คือ การจัดการ/ตรวจสอบเห...  

โปรแกรมเว็บบอร์ดเพื่อการศึกษา (Webboard)

เรื่อง : แนะนำโปรแกรมเว็บบอร์ดเพื่อการศึกษา (Webboard) ...  


Copyright ©2003-2019 dwthai.com. All rights reserved.
This website was created by : S.raksasuk.

ติดต่อ DwThai.Com

e-mail : dwthai@gmail.com
mobile: 08-9495-7296

เขียน Guestbook : DwThai.Com

*
*
*