HTML+CSS文本两端对齐,文字自动平均分布 

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>文本两端对齐模板-案例</title>
    <style type="text/css">
        /*文本两端对齐*/
        .text-justify{float:left;text-align:justify;text-justify:inter-word;text-justify:inter-ideograph;width:80px;height:20px;}
        .span-justify{display:inline-block;width:100%;}
    </style>
</head>
<body>
    <form>
        <div>
        <div>
        <label class="text-justify">用 户 名：<span class="span-justify"></span></label><input type="text" name="username" placeholder="请输入用户名" />
        </div>
        <div>
        <label class="text-justify">密 码：<span class="span-justify"></span></label><input type="password" name="password" placeholder="请输入用户密码" />
        </div>
    </div>
    </form>
    
</body>
</html>

 

posted @ 2017-09-26 17:06  吾生有涯，而知无涯！  阅读(14813)  评论(0)    收藏  举报