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