您的位置:首页 > 其它

input、select等表单元素的对齐问题

2016-04-21 15:46 423 查看
今天在写页面时,发现了一个问题,当INPUT、SELECT及用图片做的button放在一起(并排放一起)时,没法子对齐,自己以不愿再加其他代码。也不愿使用JS来实现图片button的效果,试好半天,发现原来一个vertical-align:middle就可搞定。

归纳如下:

1、.INPUT和图片按钮对齐:

<form method="post" action="ccc.asp">
<input type="text" name="title" onfocus="this.value=''" value="请输入单词">
<input type=image src="/img/dict.gif" align="absmiddle">
</form>

也可以在按钮的样式里面加入:vertical-align:middle;

2.INPUT和文字对齐
定义INPUT的样式,input {vertical-align:middle;},这样文字就会和INPUT框对齐。

3.以此类推,SELETE框等都如此
可以在全局CSS中定义:input,select{vertical-align:middle;} 省的后面麻烦。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: