HTML两端对齐我做的是⽤户名和密码的两端对齐
直接上代码，
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>login</title>
<style>
body{
font-family: "微软雅⿊";
font-size: 15px;;
}
#sectionOne{
width: 300px;
height: 150px;
margin:0 auto;
background-color: aliceblue;
border: solid 1px cadetblue;
padding: 20px;
}
.loginMain{
width: 70px;
height: 20px;
display: inline-block;
text-align: justify;
text-justify:inter-ideograph;
float: left;
}
div.loginMain > span{
html span 居中padding-left: 100%;
display: inline-block ;
}
</style>
</head>
<body>
<section id="sectionOne">
<div class="loginMain">⽤户名：<span></span></div>
<input type="text" id="userName" placeholder="请输⼊⽤户名"/>
<br/>
<br/>
<div class="loginMain">密码：<span></span></div>
<input type="text" id="passWord" placeholder="请输⼊密码" />
</section>
</body>
</html>
运⾏结果
关于style中的 text-justify: 详见

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。