龙盟编程博客 | 无障碍搜索 | 云盘搜索神器
快速搜索
主页 > web编程 > div+css/html >

经典 用CSS实现form表单布局

时间:2012-12-29 08:41来源:未知 作者:admin 点击:
分享到:
style type="text/css" label{ float: left; width: 80px; } form{margin:0px} input{ width: 180px; border:1px solid #808080 } textarea{ width: 250px; height: 150px; } #sbutton{ margin-left: 80px; margin-top: 5px; width:80px; } br{ clear: left; }
<style type="text/css">
label{
float: left;
width: 80px;
}
form{margin:0px}
input{
width: 180px;
border:1px solid #808080
}
textarea{
width: 250px;
height: 150px;
}
#sbutton{
margin-left: 80px;
margin-top: 5px;
width:80px;
}
br{
clear: left;
}
</style>
<form action="" method="post">
<label for="user">姓名:</label>
<input type="text" id=user name="user" value="" /><br />
<label for="email">邮件:</label>
<input type="text" id=email name="email" value="" /><br />
<label for="comment">备注:</label>
<textarea id=comment name="comment">
</textarea>
<br />
<input type="submit" id="sbutton" value="确定" /><br />
</form>
    [Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]

精彩图集

赞助商链接