元素垂直对齐(比如图片)

定义和用法
verticalAlign 属性设置内容在元素框中的垂直对齐方式。
如下图:

验证码输入框与验证码图片并没有垂直对齐.
使用verticalAlign可以实现元素垂直对齐,代码如下:

 <style>
        /*验证码 输入框和验证码 对齐，input 和 img 实现对齐。*/
        #validNum, #img {
		    vertical-align: middle;
	    }
    </style>

 <span>
        <input id="validNum" type="text" name="valid_num" required="required" placeholder="验证码,区分大小写">
    </span>

    <span>
        <a id="validCode" href="javascript:">
            <img id="img" src="{% url 'get_valid_img' %}" alt="暂无图片">
        </a>
     </span>

效果如下: