如何让input从右边对齐

这里是最原始的，我想让他向右对齐//这里是我的代码，下面加粗的部分是我从网上找到的一些代码，但，没用<body> <div class="container"> <h2 class="reg-top"></h2> <div class="reg-box"> <div class="main"> <h3>注册账号</h3> <form action="" method="post" class="reg-form"> <div class="reg-inpiut"> <label vertical-align:middle;display:inline-block;><i>*</i>  昵称：</label> <input type="text" id="uname" placeholder="英文，数字长度为6-10个字符" style="width: 200px;"/> </div> <div class="reg-inpiut"> <label vertical-align:middle;display:inline-block;><i>*</i>  密码：</label> <input type="password" id="upass" placeholder="长度为6-16个字符" style="width: 200px;" vertical-align:middle;/> </div> <div class="reg-inpiut"> <label vertical-align:middle;display:inline-block;>手机号码：</label> <input type="text" style="width: 200px;" vertical-align:middle;/> <span id="tel-tip">忘记密码时找回密码使用</span> </div> <div class="reg-inpiut"> <label vertical-align:middle;display:inline-block;><i>*</i>  邮箱：</label> <input type="email" style="width: 200px;"/> </div> <div class="reg-inpiut"> <label vertical-align:middle;display:inline-block;>年龄：</label> <input type="number" min="12"/> </div> <div class="submit-box"> <input type="submit" id="submit" value="立即注册"/> </div> </form> </div> </div> </div> </body>

查看完整描述

2 回答

已采纳

么我的北海

TA贡献2条经验获得超3个赞

 <div class="container">
    <h2 class="reg-top"></h2>
    <div class="reg-box">
    <div class="main">
    <h3 style="width:400px;text-align:center">注册账号</h3>
    <form action="" method="post" class="reg-form">
    <div class="reg-inpiut">
    <label class="input-label"><i>*</i>昵称：</label> 
    <input type="text" id="uname" placeholder="英文，数字长度为6-10个字符" style="width: 200px;"/>
    </div>
    <div class="reg-inpiut">
    <label class="input-label"><i>*</i>密码：</label>
    <input type="password" id="upass" placeholder="长度为6-16个字符" style="width: 200px;" vertical-align:middle;/>
    </div>
    <div class="reg-inpiut">
    <label class="input-label">手机号码：</label>
    <input type="text" style="width: 200px;" vertical-align:middle;/>
    <span id="tel-tip">忘记密码时找回密码使用</span>
    </div>
    <div class="reg-inpiut">
    <label class="input-label"><i>*</i>邮箱：</label>
    <input type="email" style="width: 200px;"/>
    </div>
    <div class="reg-inpiut">
    <label class="input-label">年龄：</label>
    <input type="number" min="12"/>
    </div>
    <div class="submit-box reg-inpiut">
    <input type="submit" id="submit" value="立即注册" style="margin-left:105px;"/>
    </div>
    </form>
    </div>
    </div>
</div>

.input-label{
        display: inline-block;
        text-align: right;
        width: 100px;
    }
    .reg-inpiut{
        height: 30px;
        line-height: 30px;
    }
    .reg-inpiut i{
        color: #f00;
        vertical-align: middle;
        padding-right: 5px;
    }
    #tel-tip{
        font-size: 12px;
        color: #f00;
    }

//img1.sycdn.imooc.com//595b08100001b6d404890243.jpg