老师,输入框文字左右对齐都可以,但是两边对齐实现不了,是为什么呢
<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<title></title>
<head>
<style>
*{
padding:0px;
margin:0px;
}
/*nav样式*/
nav{
background-color:#efefef;
height:80px;
width:100%;
overflow: hidden;
position: relative;
z-index: 10;
}
li:nth-child(5){
position:relative;
}
.nul>li{
float:left;
list-style: none;
line-height: 80px;
font-size:14px;
}
.nimg1{
height:70px;
padding-top: 5px;
margin-left: 200px;
}
.nimg2{
height:22px;
padding-top:28px;
}
.nspan1{
font-size: 18px;
font-weight: bold;
}
.nspan2{
font-size: 12px;
color: grey;
}
.nspan3,.nspan4{
color:rgb(251,116,3);
}
.nul>li:nth-child(3){
margin-left: 40px;
}
.nul>li:nth-child(4),li:nth-child(5){
margin-left: 10px;
}
.nul>li:nth-child(6){
margin-left: 30px;
}
.nul2{
display: none;
list-style: none;
line-height: 20px;
margin-top:-20px;
border: 1px rgb(251,116,3) solid;
background-color: white;
position: absolute;
}
.nul2>li:nth-child(2){
border-bottom: 1px black dotted;
}
.nul>li:nth-child(5):hover{
cursor:pointer;
}
.nul>li:nth-child(5):hover .nul2{
display:block;
}
.line-top{
height:2px;
width: 100%;
background-color:rgb(36,135,201);
}
/*main部分*/
.mfont{
font-size:16px;
margin-left: 240px;
font-weight: bold;
}
.mfont span{
font-size: 14px;
color:grey;
font-weight: normal;
}
.mform{
height:400px;
width:800px;
margin:0px auto;
border:1px rgb(251,116,3) solid;
border-radius: 5px;
overflow: hidden;
}
.mformtop{
height: 25px;
width: 100%;
background-color: rgb(251,116,3);
color:white;
line-height: 25px;
padding-left: 5px;
}
.mformcontent{
width:300px;
margin:0px auto;
margin-top:20px;
}
.mformcontent p{
line-height: 25px;
}
.mformcontent span{
display: inline-block;
width:75px;
text-align: justify;
}
</style>
</head>
<body>
<nav>
<ul class="nul">
<li><img class="nimg1" src="素材/logo.png"></li>
<li><span class="nspan1">慕课高铁客户服务中心 | </span><span class="nspan2">客户服务</span></li>
<li>意见反馈<span class="nspan3">imooc@.com</span></li>
<li>您好,请<span class="nspan4">登录</span>|注册</li>
<li>
<span>我的IMOOC▼</span>
<ul class="nul2">
<li>未完成的订单</li>
<li>已完成的订单</li>
<li>我的保险</li>
</ul>
</li>
<li><img class="nimg2" src="素材/手机.png"></li>
<li>手机版</li>
</ul>
</nav>
<main>
<div class="line-top"></div>
<div class="mfont">您现在的位置:<span class="mspan1">客运首页>注册</span></div>
<div class="mform">
<div class="mformtop">账户信息</div>
<div class="mformcontent">
<p><span class="mformspan1">用户名:</span><input type="text"></p>
<p><span class="mformspan2">登录密码:</span><input type="password"></p>
<p><span class="mformspan3">确认密码:</span><input type="password"></p>
<p><span class="mformspan4">姓名:</span><input type="text"></p>
<p><span class="mformspan5">证件类型:</span><input type="text"></p>
<p><span class="mformspan6">证件号码:</span><input type="text"></p>
<p><span class="mformspan7">邮箱:</span><input type="text"></p>
<p><span class="mformspan8">手机号码:</span><input type="text"></p>
<p><span class="mformspan9">旅客类型:</span><input type="text"></p>
</div>
</div>
</main>
<footer></footer>
</body>
</html>
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星