HTML 表單中的圖片和 checkbox 多選核取方塊的垂直居中（CSS）

不使用 <table>，亦無須將表單套入 <div> 中，僅用 <form> 即可。

<form>
 <img src="pixnet-logo.png" />
 <input>
 <input type="submit" value="搜尋">
</form>

表單中插有的圖片，同旁邊的文字輸入框和送出紐的對齊方式預設為底線對齊。相對於旁邊的文字輸入框和送出紐，圖片的垂直位置偏上。

若要圖片相對於旁邊的文字輸入框和送出紐的垂直位置居中，需給圖片的 <img> 指定 CSS：vertical-align:middle，其餘原始碼不變。

<form>
 <img src="pixnet-logo.png" style="vertical-align:middle" />
 <input>
 <input type="submit" value="搜尋">
</form>

圖片相對於旁邊的文字輸入框和送出紐的垂直位置居中

checkbox 多選核取方塊的原始碼範例

<input type="checkbox" style="vertical-align:middle">