Skip to main content

วิธีกำหนดตารางโดยใช้ CSS

Anonim

Cascading Style Sheets (CSS) เป็นภาษาสไตล์ชีทที่ใช้บ่อยที่สุดในการกำหนดรูปแบบภาพของหน้าเว็บที่เขียนด้วย HTML และ XHTML คุณอาจยังใหม่กับการออกแบบเว็บหรือ CSS และมีคำถามเกี่ยวกับวิธีจัดตารางบนหน้าเว็บ นอกจากนี้คุณยังอาจเป็นนักออกแบบที่มีประสบการณ์ซึ่งกำลังสับสนเกี่ยวกับวิธีใช้เทคนิคนี้ในขณะนี้เนื่องจากแท็ก CENTER และแอตทริบิวต์ "center" ถูกเลิกใช้ในแท็ก TABLE ด้วย CSS การวางตารางกลางไว้บนหน้าเว็บไม่ยากเลย

ใช้ CSS เพื่อจัดตำแหน่งตาราง

คุณสามารถเพิ่มบรรทัดเดียวในสไตล์ชีต CSS ของคุณเพื่อจัดวางตารางทั้งหมดในแนวนอน:

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

เมื่อคุณวางตารางในหน้าเว็บคุณจะวางไว้ภายในองค์ประกอบระดับบล็อกเช่น BODY, P, BLOCKQUOTE หรือ DIV คุณสามารถจัดตารางด้านในองค์ประกอบนั้นโดยใช้ margin: auto; สไตล์ ซึ่งจะบอกให้เบราว์เซอร์ทำขอบกระดาษทุกด้านของตารางให้เท่ากันวางตำแหน่งตรงกลางของหน้าเว็บ

เว็บเบราเซอร์เก่าบางรุ่นไม่สนับสนุนวิธีนี้

หากเว็บไซต์ของคุณต้องสนับสนุนเว็บเบราเซอร์รุ่นเก่าเช่น Internet Explorer 6 คุณจำเป็นต้องใช้งานต่อไปalign = "center" หรือแท็ก CENTER ไปตรงกลางตารางของคุณ นั่นเป็นเรื่องของภาวะแทรกซ้อนที่คุณจะได้รับเมื่อตั้งศูนย์กลางตารางไว้ในหน้าเว็บ การใช้เทคนิคนี้ทำได้ง่ายและสามารถใช้งานได้ภายในไม่กี่นาที