เกี่วกับ table กับ div มันยังไงยังไงนะ

[dexjanghan]

บางเว็บ ส่วนมากผมเห็นเขากำหนดบล็อกด้วย table แต่ไม่แน่น่อนและรดกุมเหมือนใช้ div
ผมสงสัยคุณสมบัติมันนี่ล่ะครับ สองตัวนี้ มันต่างกันยังไงคับ

ขอบคุณคับ

[touleg]

tag div คุณสมบัติมันเป็นบล็อกๆครับ
ส่วน table ก็แน่นอนมันเป็นตาราง

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

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

ในการทำเว็บบางครั้ง อย่างตามบริษัทรับทำเว็บ บางทีก็แยกกันทำระหว่าง web design กับ programmer ซึ่งบางครั้ง web design ก็ทำกับ photoshop แล้ว import ออกมาเป็นโค้ด ซึ่ง photoshop มันจะทำ layout ของเว็บเป็นแบบ table แล้วก็ไม่ได้แก้ให้เป็น div ใช้ไปแบบนั้นเลย ซึ่ง programmer ส่วนมากพอรับมาแล้วก็ขี้เกียจแก้เหมือนกันก็เลยปล่อยเลยตามเลย ก็เลยเห็นว่าจะมีบางเว็บเป็น table บางเว็บก็เป็น div

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

ก็ประมาณนี้ใครมีอะไรเพิ่มเติมก็มาโพสได้ครับ ทั้งนี้ก็ขึ้นอยู่กับผู้ที่นำไปใช้

[dexjanghan]

\ขอบคุณมากครับ กระจ่างแล้วครับ

[notty32]

ใส่ table เยอะๆ เวลาดูหน้าโค้ดจะโหลดช้าด้วยอะ ไม่รู้คนอื่นเป็นหรือเปล่า

[dreamcolo]

ซู้ดยอก เข้าใจแจ่มแจ้ง ขอบคุณมากคับผม

[lungkao]

Code: Select all

<table><tr>
  <td>เนื้อหา  แรก</td>
  <td>เนื้อหา Div  2</td>
  <td>เนื้อหา Div  3</td>
  <td>เนื้อหา Div  4</td>
  <td>เนื้อหา Div  5</td>
</tr></table>

เป็น

Code: Select all

<div class="table"><div class="tr">
  <div class="td_1">เนื้อหา Div แรก</div>
  <div class="td_1">เนื้อหา Div  2</div>
  <div class="td_1">เนื้อหา Div  3</div>
  <div class="td_1">เนื้อหา Div  4</div>
  <div class="td_1">fเนื้อหา Div  5</div>
</div></div>

แล้วอิสระก็จะเกิดขึ้น

[mebby]

พอจะเข้าใจแล้วค่ะ ขอบคุณนะคะสำหรับการแบ่งปันความรู้ดีๆ

[HurricaneCyber]

เทียบกับ word แล้ว Table = ตาราง DIV= กล่องข้อความ ประมาณนี้มั้ง