html关于input平行/垂直居中显示
来源:华佗健康网
类似某些网页搜索框平行且垂直居中显示的方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
*{
padding: 0;
margin: 0;
}
div{
width: 100%;
border: 1px solid red;
height: 100px;
line-height:100px;
text-align: center;
}
input{
border: 1px solid #999;
height: 40px;
background: #FFFFFF;
line-height: 40px;
}
</style>
</head>
<body>
<div><input /></div>
</body>
</html>
在input外面嵌套div,在div中垂直用height和line-height高相同,平行用text-align:center。
效果图如下:
因篇幅问题不能全部显示,请点此查看更多更全内容