2014年7月1日 15:31:17
第一次写css,见谅
css:
1 /*form*/ 2 /*default*/ 3 .form-box .form-group .form-label {text-align: right; width: 200px; height: 33px; line-height: 33px;} 4 .form-box .form-group .form-input {text-align: left; width: 200px; height: 33px; display: inline;} 5 .form-box .form-group .form-tip {margin: 5px;padding: 0px;width: 200px;text-align: center; display: inline;} 6 .form-box .form-submit {margin-left: 200px} 7 8 /*small*/ 9 .form-box .form-group .form-label-small {text-align: right; width: 150px; height: 33px; line-height: 33px;} 10 .form-box .form-group .form-input-small {text-align: left; width: 150px; height: 33px;} 11 .form-box .form-group .form-tip-small {margin: 5px;padding: 0px;width: 150px;text-align: center;} 12 .form-box .form-submit-small {margin-left: 150px} 13 14 /*large*/ 15 .form-box .form-group .form-label-large {text-align: right; width: 250px; height: 33px; line-height: 33px;} 16 .form-box .form-group .form-input-large {text-align: left; width: 250px; height: 33px;} 17 .form-box .form-group .form-tip-large {margin: 5px;padding: 0px;width: 250px;text-align: center;} 18 .form-box .form-submit-large {margin-left: 250px}
html:
1 <form class="form-box" > 2 <div class="form-group"> 3 <label class="form-label">表单名: </label> 4 <input type="text" class="form-input"> 5 <span class="form-tip"></span> 6 </div> 7 <div class="form-group"> 8 <label class="form-label">表单名: </label> 9 <input type="text" class="form-input"> 10 <span class="form-tip"></span> 11 </div> 12 <input type="submit" class="form-submit" value="go!" > 13 </form>