ตัวอย่าง
ตาราง HTML ที่มีแถวแนวตั้งชิดที่แตกต่างกัน
<table>
<tr valign="middle">
<th>Month</th>
<th>Savings</th>
</tr>
<tr valign="bottom">
<td>January</td>
<td>$100</td>
</tr>
</table>
ลองตัวเอง» ความหมายและการใช้งาน
valign แอตทริบิวต์ระบุแนวตั้งของเนื้อหาในแถวของตาราง
สนับสนุนเบราว์เซอร์
| คุณลักษณะ | |||||
|---|---|---|---|---|---|
| valign | ใช่ | ใช่ | ใช่ | ใช่ | ใช่ |
หมายเหตุความเข้ากันได้
valign แอตทริบิวต์ของ <tr> ไม่สนับสนุนใน HTML5 ใช้ CSS แทน
ไวยากรณ์ CSS: <tr style="vertical-align:bottom">
CSS ตัวอย่าง: เนื้อหาจัดแนวตั้งภายใน <tr>
ในการกวดวิชา CSS ของเราท่านสามารถดูรายละเอียดเพิ่มเติมเกี่ยวกับ แนวตั้งจัดสถานที่ให้บริการ
วากยสัมพันธ์
<tr valign="top|middle|bottom|baseline">
ค่าแอตทริบิวต์
| ความคุ้มค่า | ลักษณะ |
|---|---|
| top | เนื้อหายอดนิยม-align |
| middle | เนื้อหาของศูนย์-align |
| bottom | เนื้อหาด้านล่าง-align |
| baseline | พื้นฐานคือ "เส้นสมมุติ" ซึ่งตัวอักษรมากที่สุด "นั่ง" บนในบรรทัดของข้อความ มูลค่าพื้นฐานชุดแถวเพื่อให้ข้อมูลทุกตารางแบ่งปันพื้นฐานเดียวกัน นี้มักจะมีผลเช่นเดียวกับค่าด้านล่าง แต่ถ้าแบบอักษรที่มีอยู่ในขนาดที่แตกต่างกันดูดีกว่าพื้นฐาน ดูภาพประกอบด้านล่าง |
ภาพประกอบด้านล่างเทียบกับพื้นฐานถ้าแบบอักษรที่อยู่ในขนาดที่แตกต่างกัน:
valign="bottom"
valign="baseline"