css form 表单组对齐


2014年7月1日 15:31:17

第一次写css,见谅

css: 

1 .form-box .form-group .form-label {text-align: right; width: 200px; height: 34px; line-height: 34px; font:14px; margin-right: 10px;}
2 .form-box .form-group .form-input {text-align: left; width: 200px; height: 34px; line-height: 34px; vertical-align: middle; border:1px solid #ccc; font-size: 14px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset; border-radius: 4px; display: inline;}
3 .form-box .form-group .form-input-select {text-align: left; width: 200px; height: 34px; line-height: 34px; vertical-align: middle; border:1px solid #ccc; font-size: 14px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset; padding: 7px 12px; border-radius: 4px; display: inline;}
4 .form-box .form-group .form-tip {margin: 5px;padding: 0px;width: 200px;text-align: center; display: inline;}
5 .form-box .form-submit {margin-left: 200px}

 

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         <select class="form-input-select">
10         <span class="form-tip"></span>
11     </div>
12     <input type="submit" class="form-submit" value="go!" >
13 </form>

 -----------------

1 select onchange: onchange='selectAccount(this.options[this.selectedIndex].value)
2 
3 var selectGame = document.getElementById('gamename');
4 var selectedIndex = selectGame.selectedIndex;
5 var gameid = selectGame.options[selectedIndex].value;

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM