在学习HTML和CSS的时候，好多初学者对input标签进行设置的时候总是有个小细节处理不好。
我大概总结了一下，大家普遍的问题是无法对其，总是差一点点，好多同学呢是直接忽略，感觉差一点点也无伤大雅，
但在我看来呢，这对于一个IT行业的人来说是致命的，因为这种“无伤大雅”的思想是不严谨的，为我IT公民之大忌！
图1为大部分同学都遇到过的情况，图2为大部分想要的效果
图1：
图2：
原因在于input默认边框为2px,同时两个按钮的border算在框内，input默认padding为1px。
实例代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
html,body,input{margin: 0;padding: 0;}
.box{height: 200px;width: 500px;border: 1px solid red;margin: 100px auto;}
input{height: 50px;width: 100px;vertical-align: top;float: left;}
.txt{height: 46px;}
</style>
</head>
<body>
<div class="box">
<input type="text" name="" class="txt" />
<input type="submit" name="" class="sub" />
<input type="button" name="" class="btn" value="结果"/>
</div>
</body>
</html>
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
