html中input文本框比在css中设置的宽高要宽一些高一些
我在设置input的同时设置了select框，通过测量我知道了select的宽高是我设置的宽高，input的宽高比我设置的宽高都要多处4px；我尝试把input改为块状元...
我在设置input的同时设置了select框，通过测量我知道了select的宽高是我设置的宽高，input的宽高比我设置的宽高都要多处4px；
我尝试把input改为块状元素后消除margin和padding，但是也不行
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单测试</title>
</head>
<style>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单测试</title>
</head>
<style>
*{
margin:0;padding:0;
}
body{
background-color: #faffd5;
}
div{width:1200px;margin:auto;}
.form-in{height:40px;width:570px;}
input{display:block;margin:0;padding:0;}
</style>
<body>
<div>
<input type="text" class="form-in"><br>
<select name="" id="" class="form-in">
<option value="man">男</option>
<option value="woman">女</option>
</select>
</div>
</body>
</html> 展开
我尝试把input改为块状元素后消除margin和padding，但是也不行
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单测试</title>
</head>
<style>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单测试</title>
</head>
<style>
*{
margin:0;padding:0;
}
body{
background-color: #faffd5;
}
div{width:1200px;margin:auto;}
.form-in{height:40px;width:570px;}
input{display:block;margin:0;padding:0;}
</style>
<body>
<div>
<input type="text" class="form-in"><br>
<select name="" id="" class="form-in">
<option value="man">男</option>
<option value="woman">女</option>
</select>
</div>
</body>
</html> 展开
3个回答
展开全部
input有边框，要把边框去掉，按F12看就能看到了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单测试</title>
<style>
*{
margin:0;padding:0;
}
body{
background-color: #faffd5;
}
div{width:1200px;margin:auto;}
.form-in{height:40px;width:570px;box-sizing: border-box;}
input{display:block;margin:0;padding:0;}
</style>
</head>
<body>
<div>
<input type="text" class="form-in"><br>
<select name="" id="" class="form-in">
<option value="man">男</option>
<option value="woman">女</option>
</select>
</div>
</body>
</html>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
给input设置box-sizing:border-box 就OK了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
