表单

表单的作用是收集信息。

表单的组成

◆提示信息

表单控件

1.表单域

属性:action:处理信息

method=”get | post”

get通过地址栏提供(传输)信息,安全性差。

post 通过1.php来处理信息,安全性高。

2.文本输入框

maxlength="6"    限制输入字符长度

readonly=”readonly”  将输入框设置为只读状态(不能编辑)

disabled="disabled"  输入框未激活状态

name="username"   输入框的名称

value="大前端"     将输入框的内容传给处理文件

3.密码输入框

★注意:文本输入框的所有属性对密码输入框都有效。

4.单选框

★只有将name的值设置相同的时候,才能实现单选效果。

★checked=”checked” 设置默认选择项。

5.下拉列表

<select>
<option>下拉列表选项</option>
<option>下拉列表选项</option>
</select>

属性:

multiple=”multiple”  将下拉列表设置为多选项

selected=”selected”  设置默认选中项目

<optgroup></optgroup>   对下拉列表进行分组。

Label=””  分组名称。

6.多选框

checked=”checked” 设置默认选中项

7.多行文本框

cols  控制输入字符的长度。

rows  控制输入的行数

8.文件上传控件

9.文件提交按钮

★:可以实现信息提交功能

10.普通按钮

★不能提交信息,配合JS使用。

11.图片按钮

★图片按钮可实现信息提交功能

◆重置按钮

★将信息重置到默认状态

◆表单信息分组

<fieldset></fieldset>    对表单信息分组

<legend></legend>      表单信息分组名称
html5补充表单控件

标签语义化

好的语义化的网站标准就是去掉样式表文件之后,结构依然很清晰。

标签语义化概念:根据内容的结构化(内容语义化),选择合适的标签(代码语义化)

-标签语义化意义:

1:网页结构合理

2:有利于seo:和搜索引擎建立良好沟通,有了良好的结构和语                         义你的网页内容自然容易被搜索引擎抓取;

3:方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备)

4:便于团队开发和维护

1:尽可能少的使用无语义的标签div和span;

2:在语义不明显时,既可以使用div或者p时,尽量用p, 因为p在默认情况下有上下间距,对兼容特殊终端有利;

3:不要使用纯样式标签,如:b、font、u等,改用css设置。

4:需要强调的文本,可以包含在strong或者em标签中strong默认样式是加粗(不要用b),em是斜体(不用i);

3.表单form的更多相关文章

  1. HTML ------ 关于表单 Form

    Form(表单)主要用于采集和提交用户输入的信息,是页面与WEB服务器交互过程中 最重要的信息来源. 掌握表单(Form)有以下几个要点: 重要form属性 form常用控件 form提交方式 § 重 ...

  2. Bootstrap~表单Form

    回到目录 在进行自己的后台改版时,大体布局都使用了bootstrap,剩下的表单部分没理由不去使用它,对于表单的美化和布局,bootstrap做的也是很不错的,有大气的边框,多功能的按钮及宏观的表单布 ...

  3. 表单 - Form - EasyUI提供的表单异步提交

    方案一 被提交的表单 <form id="loginForm" method="post"> <table align="cente ...

  4. 跟服务器交互的Web表单(form)

    使用HTML来构建可以跟服务器交互的Web表单(form),通过给你的form元素添加一个action属性来达到此目的. action属性的值指定了表单提交到服务器的地址. 例如: <form ...

  5. 3、网页制作Dreamweaver(表单form)

    表单form (虚线不显示) 1.写法: <form id="form1" name="form1" method="post" ac ...

  6. DHTMLX 前端框架 建立你的一个应用程序 教程(九)--绑定表单Form到表格Grrid中

    绑定表单Form到表格Grrid中 现在我们需要选中一行表格数据的时候 数据能在表单中显示出来 我们可以使用DHTMLX 丰富的组件功能实现它. 绑定表单到表格 1.调用bind方法将表单绑定到网格, ...

  7. DHTMLX 前端框架 建立你的一个应用程序 教程(八)-- 添加表单Form

    添加表单Form 我们下一步是在页面中添加一个表单,表格中的选中字段将会显示在表单中.提供一个提交按钮 可以对显示的数据进行修改提交. 添加表单到布局单元格中 1.在右侧布局中使用attachForm ...

  8. 微信小程序基础之表单Form的使用

    表单Form的应用很广泛,我们可以利用form设计登录注册,也可以设计一种答题问卷的形式,今天主要讲一下form的使用 form表单,将组件内输入的"switch","i ...

  9. HTML(七)HTML 表单(form元素介绍,input元素的常用type类型,input元素的常用属性)

    前言 表单是网页与用户的交互工具,由一个<form>元素作为容器构成,封装其他任何数量的表单控件,还有其他任何<body>元素里可用的标签 表单能够包含<input> ...

  10. 表单<form></form>提交方式的区别

    <form action="" method="get/post"> 表单<form></form>的提交方式有两种:pos ...

随机推荐

  1. CODE[VS]4228 小猫爬山 小猫爬山

    原题链接 第一眼还以为是贪心,然后随便找了几组例子瞬间推翻贪心的想法.发现\(n\leqslant18\),显然是用爆搜+剪枝. 爆搜主体我是对小猫进行枚举,判断增添缆车,其实这是一个比较慢的搜法,而 ...

  2. Spring 注解(二)注解工具类 AnnotationUtils 和 AnnotatedElementUtils

    Spring 注解(二)注解工具类 AnnotationUtils 和 AnnotatedElementUtils Spring 系列目录(https://www.cnblogs.com/binary ...

  3. go语言字符串练习

    package main import "fmt" import s"strings" var p = fmt.Println func main() { p( ...

  4. ueditor 功能定制

    方法一:用js传参 var editor = new UE.ui.Editor({initialFrameHeight:200,initialFrameWidth:640,toolbars:[[&qu ...

  5. centos上安装jdk

    今天在centos上安装jdk,总结步骤如下:1.先到oracle下载rpm包:jdk-7u80-linux-x64.rpm (下载地址在百度找找)2.把jdk-7u80-linux-x64.rpm上 ...

  6. Keras的泰坦尼克号的生存率的数据分析

      # coding: utf-8 # In[1]: import urllib.request import os # In[2]: url="http://biostat.mc.vand ...

  7. 关于对话框不能响应OnKeyDown和OnChar函数的一些说明

    (1)现象  在MFC的对话框中,映射了WM_CHAR和WM_KEYDOWN消息响应函数后,还是不能响应OnKeyDown和OnChar. (2)原因  因为MFC在进行设计的时候,这两个消息被对话框 ...

  8. MFC单文档带窗体创建

    我用的vs05.先随便起个名字qwerty. 确定以后在左边最下面有一个生成的类,点击生成的类,把基类改成CFormView 最后点击完成就创建好了. 单文档的窗口不是后来创建后插入的,是在创建后就自 ...

  9. c# 产生随机数 程序所在路径

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  10. 详细解读 :java.sql.SQLException: Connection is read-only. Queries leading to data modification are not allowed,Java报错之Connection is read-only.

    问题分析: 实际开发项目中,进行insert的时候,产生这个问题是Spring框架的一个安全权限保护方法,对于方法调用的事物保护,一般配置如下: <!-- 事务管理 属性 --> < ...