<html>
<head>
<style>
</head>
<body>
<label>name:</label><input><br/>
<label>age:</label><input><br/>
<label>phone:</label><input><br/>
<label>address:</label><input><br/>
</body>
<head>
<style>
label { float: left; width: 10em; margin-right: 1em; text-align: right; }
/*以下方式也可以*/
/* label {display:inline-block; width: 10em; margin-right: 1em; text-align: right; }*/
</style></head>
<body>
<label>name:</label><input><br/>
<label>age:</label><input><br/>
<label>phone:</label><input><br/>
<label>address:</label><input><br/>
</body>
</html>
将label设置左浮动，label就会跑到左边，同时label会变成内联块(相当于display:inline-block)元素，就可以给label设置width属性。然后将label的文本内容设置为右对齐，这样就可以实现上图的效果。
1658
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
