html学习笔记四

表单标签<form> :必须记住

表单在html中很常用,因为它可以和计算机交互

input部分

 <font-color = "red" font-size = 10>注册表单</font><hr/>
        <!--表单中的内容要想提交到服务端,因为服务端无法解析,so就必须加标识 name value-->
       <form>   <!--用type来定义输入的属性-->
           输入帐号:<input type="text" name = "user" value=""/> <br/>
           输入密码:<input type="password" name="psw" /> <br/><!--passward是非明文信息-->
           选择性别:<input type="radio" name="sex" value="nan"/>男
           <input type="radio" name="sex" value="nv"/>女<br/>
           <!--radio是单选框,若name的值不同,是两组,相同是一组,只能选一个-->

           选择性别:<input type="radio" name="sex"/>男
           <input type="radio" name="sex" checked="chexked"/>女<br/><!--checked默认被选中-->

            复选框:<input type="checkbox" name="tech" value="Java" checked="checked" />Java
                  <input type="checkbox" value="C++"/>C++
                  <input type="checkbox" value="C"/>C
                  <input type="checkbox" value="Python"/>Python
                  <input type="checkbox" value="Ruby"/>Ruby<br/>
           选择文件:<input type="file" name="file" value=""><br/>
           图片提交:<input type="image" src="2.jpg"> <br/><!--用图片图标来提交数据-->
           <!--隐藏组件开发常用,数据不需要客户端知道。但是服务器需要记录-->
           隐藏组件:<input type="hidden" name="Myname" value="Myvalue" /><br/>
           我的按钮:<input type="button" value="按钮" onclick="alert('你好,世界')"/> <br/>
           提交结果:<!--<input type="reset"/><input type="submit"/><br/>-->
                  <input type="reset" value=" 重新填写 " /><!--其实就是表单数据的状态还原-->
                  <input type="submit" value="提交结果" />
       </form>


<!--向服务端提交数据,表单中的内容必须有name和value属性

用于给服务端获取数据-->

input  上述方法,都必须记住

select和textarea部分

<!--选择部分-->
           <select name="country"><!---->
               <option>--选中城市--</option>
               <option value="TieLing">铁岭</option>
               <option value="WeiHai"> 威海</option>
               <option value="ZiBo" selected="selected">淄博</option>
               <!--selected 默认淄博-->
           </select><br/><br/><br/>

            <!--个人简介-->
           <textarea name="text">

           </textarea><br/>



表单格式化

<form>
           <table border="2" bordercolor="#00fff" cellpadding="10" cellspacing="0" width="600tx">
               <tr>
                   <th colspan="2">注册表单:</th>
               </tr>
               <tr>
                   <td>用户名称:</td>
                   <td><input type="text" name="user" /></td>
               </tr>
               <tr>
                   <td>输入密码:</td>
                   <td><input type="password" name="pwd" /></td>
               </tr>
               <tr>
                   <td>选择性别:</td>
                   <td>
                       <input type="radio" name="sex" value="nan">男
                       <input type="radio" name="sex" value="nv">女
                   </td>

               </tr>
               <tr>
                   <td>选择技术</td>
                   <td>
                       <input type="checkbox" name="tech" value="Java">Java
                       <input type="checkbox" name="tech" value="C++">JC++
                       <input type="checkbox" name="tech" value="C">C
                       <input type="checkbox" name="tech" value="Python">Python
                       <input type="checkbox" name="tech" value="Ruby">Ruby
                   </td>
               </tr>
               <tr>
                   <td>选择籍贯</td>
                   <td>
                       <select name="country" >
                           <option value="none">--选择城市--</option>
                           <option value="TieLing">铁岭</option>
                           <option value="WeiHai">威海</option>
                           <option value="ZiBo" selected="selected" >淄博</option>
                       </select>
                   </td>
               </tr>
               <tr>
                   <th colspan="2">
                       <input type="reset" value="清楚数据">
                       <input type="submit" value="数据提交">
                   </th>
               </tr>
           </table>
       </form>





郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。