表单布局

2016-08-30  本文已影响0人  前端大魔王

原文地址
表格布局的几种方式

1.表格

<table> 
<tr> 
<td><label></label></td> 
<td><input /></td>
 </tr>
 <tr> 
<td><label></label></td> 
<td><input /></td> 
</tr>
 <tr> 
<td><label></label></td>
 <td><textarea></textarea></td>
 </tr>
</table>

2.floated Label

label { 
clear: left; 
float: left; 
width: 7em; /* or whatever length suits */
}
<form action="whatever.php"> 
<div><label></label><input /></div> 
<div><label></label><input /></div> 
<div><label></label><textarea></textarea></div>
</form>

3.Relative form fields

label { 
display: block; 
margin-bottom: -1em;
}
input { 
display: block;
 position: relative;
 left: 7em;
 top: -0.5em;
}
上一篇 下一篇

猜你喜欢

热点阅读