0x00 如何去除input与button中的空白
在写搜索框时经常会遇到input与button一起用时会出现一个空白的情况
这样影响布局,而删去这个的方法有两种,一种是将两个标签写在同一行;
第二种是在两个标签中写上注释
<div>
<input type="text" value="奥利奥饼干"/><!--
--><button>
<i class="iconfont"></i>
</button>
</div>
0x01 如何使input与button标签对齐
这个算是web里的经典问题了,这两个标签无法对齐的原因是因为这两个标签的基线不一样,所以解决方法就是设置两个的基线一致就行了;
vertical-align: baseline;
vertical-align: sub;
vertical-align: super;
vertical-align: text-top;
vertical-align: text-bottom;
vertical-align: middle;
vertical-align: top;
vertical-align: bottom;