<!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>
