<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="author" content="tofishes@163.com" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<style type="text/css">
body { font-size:14px; }
ul { list-style:none; }
fieldset .text, fieldset .radio, fieldset .checkbox, fieldset label, fieldset dfn, fieldset img, fieldset .submit, fieldset a, fieldset textarea, fieldset select { padding:0 2px; vertical-align: middle; }
fieldset .text { width: 13em; height: 18px; line-height: 18px; font-size: 14px; }
fieldset .title { width: 40em; }
fieldset .short { margin-right: 5px; width: 40px; }
fieldset .medium {width: 80px; }
fieldset label { display: inline-block; margin:0 10px 0 0;width: 80px; font-weight: 700; color: #666; text-align: right;}
fieldset p, fieldset .action { margin: 0 0 15px; }
fieldset.long label { width: 100px; }
fieldset .desc { padding-left: 20px; color: #666; line-height: 150%; }
fieldset p.desc, fieldset .action { padding:0 0 0 100px; }
fieldset.long .action, fieldset.long p.desc { padding: 0 0 0 120px; }
fieldset p.desc {margin-top: -10px;}
fieldset dfn { margin:0 0 0 10px; font-style: normal; color: red; }
fieldset .radio, fieldset .checkbox { margin: -2px 5px 0 0; }
fieldset .submit { border: none; }
fieldset select{ margin:0 10px 0 0; padding:0; font-size: 14px; color: #666;}
fieldset a, fieldset a:visited, #result a, #result a:visited { color: #39c; }
fieldset a:hover { color: #f60; }
fieldset textarea { padding:2px; width: 400px; height: 120px; vertical-align: top; font-size: 14px; }
fieldset .file { height: 22px; line-height: 22px; vertical-align: middle; }
fieldset .preview { padding:2px; border: 1px solid #aaa; }
fieldset .category, fieldset .select { margin:0 0 15px; zoom:1;overflow:hidden; }/* select用于右侧还有多个输入框选择,比如多个联系方式 */
/* 特殊行使用div布局,label左浮动,右边可以是个div wrapper,保证整个框架不乱,然后这个div wrapper里面想怎样布局都行了 */
fieldset .category label { float: left; }
fieldset .category ul { float:left; display: inline; margin:0 5px; width: 190px; height: 180px; border: 1px solid #ccc; verticla-align:top; overflow: auto; }
fieldset .select ul li { margin: 5px 0; }
fieldset .category ul li { margin:1px; padding:0 5px; cursor: default;}
fieldset .category ul li.title { background: #fcc; width: auto; }
fieldset .category ul li:hover, fieldset .category ul li.curr { background: #dcf url(img/icon.png) no-repeat right -294px; }
fieldset iframe.editor { vertical-align: top; width: 560px; height: 230px; border: 1px solid #ccc; }/*如果有iframe的可视化编辑器*/
</style>
</head>
<body>
<form enctype="multipart/form-data" method="post" action="" >
<fieldset>
<p><label>标题:</label>
<input type="text" class="text title" name="title" /><dfn>*</dfn>
</p><p class="desc">简洁形象的标题,方便用户搜索及浏览</p>
<p><label>TAG标签:</label>
<input type="text" class="text title" name="" />
</p><p class="desc">多写几个与内容有关的标签,会让更多的人找到你的资源哦!(用逗号分开)</p>
<p><label>作者:</label>
<input type="text" class="text" name="" /><dfn>*可以作为错误警示信息的地方</dfn>
</p>
<p><label>分类:</label>
<select name="">
<option value="">请选择分类...</option>
</select><dfn>*</dfn>
</p>
<p><label>是否原创:</label>
<input type="radio" class="radio" name="" />原创(<a href="">请阅读原创声明</a>)
<input checked="checked" type="radio" class="radio" name="" />转载(<a href="">请阅读转载声明</a>)
</p>
<p><label>下载所需:</label>
<input type="text" class="text short" name="" value="0" />
<select name="">
<option value="">积分</option>
</select>
</p>
<p><label>图片预览:</label><!-- 如果不需要就去掉这一段 -->
<img id="preview" class="preview" src="http://pic.digu.com/file/11/50/24/12/default/SIGN11502412_128x128.jpg?t=1270015986409" />
</p>
<p><label>缩略图:</label>
<input type="file" class="file" name="" size="35" /><dfn>*</dfn>
</p><p class="desc">允许上传格式:jpg|gif|png|bmp|jpeg</p>
<p><label>上传文件:</label>
<input type="file" class="file" name="" size="35" /><dfn>*</dfn>
</p><p class="desc">允许上传格式:jar|sis</p>
<div class="category"><label>系统平台:</label>
<ul><!-- 最多放3个ul,应该够用了-->
<li class="title">请选择品牌</li>
<li>Nokia</li>
<li>Mootaool</li>
<li>Nokia</li>
<li>Mootaool</li>
<li>Nokia</li>
<li>Mootaool</li>
<li>Nokia</li>
<li>Mootaool</li>
<li>Nokia</li>
<li>Mootaool</li>
<li>Nokia</li>
<li>Mootaool</li>
<li>Nokia</li>
<li>Mootaool</li>
<li>Nokia</li>
<li>Mootaool</li>
</ul>
<ul>
<li class="title">请选择型号</li>
<li>S40系列</li>
<li>S90系列</li>
</ul>
<ul>
<li class="title">请选择系统</li>
<li>S40系列</li>
<li>S90系列</li>
</ul>
</div>
<p><label>文件简介:</label>
<textarea rows="6" cols="60" name=""></textarea>
</p>
<p class="action"><!-- 所有的隐藏域和隐藏iframe可以写这里 -->
<input type="submit" class="submit btn-red-small" value="确认并提交" />
</p>
</fieldset>
</body>
</html>