表单

<form action="http://wickedlysmart.com/hfhtmlcss/contest.php"
method="POST"> <p>Just type in your name (and click Submit) to enter the contest:<br>
Frist name:<input type="text" name="firstname" value=""> <br>
Last name:<input type="text" name="lastname" value=""> <br>
<input type="submit">
</p>
</form>
  • action 响应的脚本
  • method 传递方式

表单元素

  • <input type="text"> 提供文本输出

    <input type="text" name="fullname">
  • <input type="submit"> 提供控件提交

    <input type="submit">
  • <input type="radio"> 单选钮输入

    <input type="radio" name="hotornot" value="hot">
    <input type="radio" name="hotornot" value="not">
  • <input type="checkbox">多选项输入

    <input type="checkbox" name="spice" value="Salt">
    <input type="checkbox" name="spice" value="Pepper">
    <input type="checkbox" name="spice" value="Garlic">
  • <textarea> 文本输入框

    <textarea name="comments" rows="10" cols="48”>//初始文本</textarea>
  • <select> 菜单控件

    <select name="characters">
    <option value="Buckaroo">Buckaroo Banzai</option>
    <option value="Tommy"> Prefect Tommy</option>
    <option value="Penny">Penny Priddy</option>
    </select>
  • number<input> 数字输入

    <input type="number' min="0" max="20">
  • range<input> 范围输入

    <input type="range" min="0" max="20" step="5">
  • color<input> 颜色输入

    <input type="color">
  • date<input> 日期输入

    <input type="date">
  • email<input> emal 输入

  • tel<input> 电话输入

  • url<input> url输入

    • <lable> 标签
  • fieldsetlegend

  • passwords

  • file

  • select multiple

  • input Placeholder 输入提示

  • input Required 必须输入提示

发送数据

  • POST

    发到服务器

  • GET

    追加到URL后面

用CSS建立表单样式

[HeadFirst-HTMLCSS学习笔记][第十四章交互活动]的更多相关文章

  1. 《机器学习实战》学习笔记第十四章 —— 利用SVD简化数据

    相关博客: 吴恩达机器学习笔记(八) —— 降维与主成分分析法(PCA) <机器学习实战>学习笔记第十三章 —— 利用PCA来简化数据 奇异值分解(SVD)原理与在降维中的应用 机器学习( ...

  2. 学习笔记 第十四章 使用CSS3动画

    第14章   使用CSS3动画 [学习重点] 设计2D动画 设计3D动画 设计过渡动画 设计帧动画 能够使用CSS3动画功能设计页面特效样式 14.1  设计2D动画 CSS2D Transform表 ...

  3. JavaScript高级程序设计学习笔记第十四章--表单

    1.在 HTML 中,表单是由<form>元素来表示的,而在 JavaScript 中,表单对应的则是 HTMLFormElement 类型. HTMLFormElement 继承了 HT ...

  4. VSTO学习笔记(十四)Excel数据透视表与PowerPivot

    原文:VSTO学习笔记(十四)Excel数据透视表与PowerPivot 近期公司内部在做一种通用查询报表,方便人力资源分析.统计数据.由于之前公司系统中有一个类似的查询使用Excel数据透视表完成的 ...

  5. Python学习笔记(十四)

    Python学习笔记(十四): Json and Pickle模块 shelve模块 1. Json and Pickle模块 之前我们学习过用eval内置方法可以将一个字符串转成python对象,不 ...

  6. python3.4学习笔记(二十四) Python pycharm window安装redis MySQL-python相关方法

    python3.4学习笔记(二十四) Python pycharm window安装redis MySQL-python相关方法window安装redis,下载Redis的压缩包https://git ...

  7. Introduction to 3D Game Programming with DirectX 12 学习笔记之 --- 第四章:Direct 3D初始化

    原文:Introduction to 3D Game Programming with DirectX 12 学习笔记之 --- 第四章:Direct 3D初始化 学习目标 对Direct 3D编程在 ...

  8. C++ Primer Plus学习:第十四章

    第十四章 C++中的代码重用 包含对象成员的类 将类的对象作为新类的成员.称为has-a关系.使用公有继承的时候,类可以继承接口,可能还有实现(纯虚函数不提供实现,只提供接口).使用包含时,可以获得实 ...

  9. 如鹏网学习笔记(十四)ASP.NET

    Asp.net笔记 一.Socket类 进行网络编程的类,可以在两台计算机之间进行网络通讯 过程: 向服务器发送指令: GET /index.html HTTP/1.1 Host:127.0.0.1: ...

随机推荐

  1. windows下netstat -aon命令

    windows平台下netstat常用命令 C:\Users\Administrator>netstat --help 显示协议统计和当前 TCP/IP 网络连接. NETSTAT [-a] [ ...

  2. [.NET | 發佈] 如何指定固定的目錄給程式調用的外部DLL?

    1.OverView 一般程式只會查找與主程式同目錄的DLL檔案 解決方案主要可以參考這篇:http://support.microsoft.com/kb/837908 2.實作app.config方 ...

  3. ORACLE触发器概述之【行触发器】【weber出品】

    1. 行触发器的定义 行触发器是指执行DML操作时,每作用一行就触发一次的触发器.审计数据变化时,可以使用行触发器 2. 建立行触发器的语法如下: create or replace trigger ...

  4. 选中CheckBoxList的值放到TextBox中,再次选中从textBox中删除

    当选中checkboxlist中的值,直接放到文本框中,在checkboxlist的SelectedIndexChanged事件下执行方法, //将选中的值放到文本框中                ...

  5. RegExp子模式- "()"

    读书笔记 把JavaScript权威指南拿出来瞅瞅,正巧看到了第十章 正则表达式的模式匹配 最初接触js的时候,基本上都是在做验证.什么数字验证.命名验证.身份证格式验证.电话号码验证.都是用正则表达 ...

  6. 为什么要用Math.sqrt(i)方法

    java 练习题 判断 101-200 之间有多少个素数,并输出所有素数 public class Prime { public static int count = 0; public static ...

  7. C语言中的结构体和C++中的结构体以及C++中类的区别

    c++中结构体可以定义一个函数 C中的结构体和C++中结构体的不同之处:在C中的结构体只能自定义数据类型,结构体中不允许有函数,而C++中的结构体可以加入成员函数. C++中的结构体和类的异同: 一. ...

  8. 使用canvas来实时播放RTSP视频

    HTML5的标签可以用使用下来面的方式来播放静态视频 <video width="320" height="240" controls="con ...

  9. artDialog的几种基本使用

    1.confirm形式 var dialog=art.dialog({ lock:true, content: '请确认,您是否要删除选中的用吗?', icon: 'question', ok: fu ...

  10. Hdu1094

    #include <stdio.h> int main() { ; while(scanf("%d",&n)!=EOF){ ;i<n;i++){ scan ...