html-表单

表单

表单是用来收集用户数据,发送数据。
表单和超链接有共同的特征,就是都可以向服务器发送请求,只不过超链接是用户直接点击发送请求,不能填写数据。
而用户点击表单提交的时候,不但可以发送请求,而且请求中还可以携带输入的数据。
表单最主要的作用是收集用户的信息

基本格式

<!-- form标签下的action属性跟超链接中的href相同,后面要写上url-->
<!-- form标签下的method属性规定如何发送表单数据
     method有两个选项:Post和get
     Post是向服务器发送数据
     get是从服务器获取数据        
-->
<form>
 <!--input标签用来收集用户信息,根据不同的type属性值,输入字段有很多种形式-->
 <!--input标签下的value属性可以用来指定input中显示的文字-->
 <!--input标签下的type属性可以指定输入的形式-->
 <!--所有能够提交的按钮,type必须是submit,不能随便写-->
 <input>
 <!--input必须放在form的里面-->
 </input>
</form>

提交数据的格式

<!--
协议:http协议
访问的服务器IP地址:192.168.145.2
访问这个服务器的哪个软件:8080端口对应的一个服务
/crm/login:是这个服务器上的某个资源名!(可能是一段处理登录的Java程序!!)
-->
<form action="http://192.168.145.2:8080/crm/login">
 <!--
 input是输入域,type不同,展示样式不同
 例:text是文本框
     password是密码框
 提交表单的按钮:type="submit"
 -->
 <!--
 *********************************************************
 表单最终提交的时候,表单项的name属性非常重要。
 有name才会提交,没有name不会提交
 并且浏览器向服务器提交数据的格式是:
  url?name=value&name=value&name=value&name=value&name=value
  name和value的键值对
 以上的提交数据的格式,是w3c指定的格式。所有浏览器都一样。
 -->
 <input type="" name="" />
</form>

用户注册表单

实例:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>用户注册的表单</title>
  </head>
  <body>
    <form action="http:localhost:80/crm/register">
        用户名:<input type="text" name="username"/>
        <br>
        密码:<input type="password" name="userpwd"/>
        <br>
        性别:
        <input type="radio" name="sex" value="1" checked/><input type="radio" name="sex" value="0"/><!--
        checked表示默认选中此项
        最终提交给的服务器的数据是:sex=1 或者sex=0
        同一组的单选按钮,name是需要一致的!
         -->
         <br>
         <!--
         checkbox是复选框
         同一组的复选框的name也是相同的
         -->
         兴趣:
         <input type="checkbox" name="" id="" value=""/>
         <input type="checkbox" name="" id="" value=""/>
         <input type="checkbox" name="" id="" value=""/>
         <br>
         学历:
         <!--下拉列表-->
         <select name="">
           <option value="">高中</option>
           <option value="">专科</option>
           <!--selected属性是表示默认选中-->
           <option value="" selected>本科</option>
           <option value="">硕士</option>
         </select>
         <br>
         简介:
         <textarea rows="" cols="" name="" />
         <br>
         <!--提交表单,不用写name-->
         <input type="submit" value="" />
         <br>
         <!--
         type类型是reset表示该按钮是重置按钮
         -->
         <input type="reset" value="重置"/>
       </form>
   </body>
</html>  
         
         
         
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好看的手机html-form表单应该是具有良好的美学设计,符合人类视觉习惯和用户体验设计原则的表单。其中,要素包括以下几个方面。 首先是整体布局和排版,尽量采用简洁明了的排版设计,避免过多繁琐细节和复杂的布局。市面上的好看的手机html-form表单都具有较宽的间距、明确的分组和分块设计,遵循内容呈现的递进式原则,为用户提供观感清晰和易读易懂的页面。 其次是色彩搭配和配色方案。好看的手机html-form表单应该尽可能减少花哨的色彩和图案,避免过多的干扰和视觉误导。同时,要选取符合用户群体和品牌特征的色域,例如蓝色和绿色多被用于提供信任和安全感,如银行、金融等领域经常采用这类色环,而橙色和红色则赋予表单鲜明、突出的属性。 再者,是字体和文字排版。好看的手机html-form表单应该选用用户易读的字体,例如Arial、微软雅黑等多被用于手机网页、内嵌框架和APP应用。同时要注意文字大小和行间距的搭配,避免文字过多或过小而显得拥挤和不专业。 最后,是交互设计和较好的响应式布局。好看的手机html-form表单应该兼顾不同分辨率的设备,尽量在PC、平板和移动端多角度测试,保证更好的用户体验和较短的响应时间。同时要适度增加视觉焦点和交互式效果,例如hover、点击、折叠等方式,在交互过程中引导用户填写,同时保证表单提交的流畅,提高数据管理、信息统计的效率。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值