表格(table):是用来处理表格式数据的,不是用来布局的。

table > tr(行标签)>  td(单元格标签)

1、表格注意事项:

tr只能放置td标签,td里面可以放置任意元素。

2、表格的属性:

3、表头标签(th,文字会默认加粗)

tr>th

4、表格结构

table>thead+tbody

5、表格标题

table>caption

6、合并单元格  (删掉被合并的元素)

跨行合并:rowspan     eg:<td  rowspan="2" >跨行合并</td>   (2:删除了2个单元格)

跨列合并:colspan  eg:<td  colspan="2" >跨列合并</td>         (2:删除了2个单元格)

表单(目的:收集用户的信息,一个完整的表单通常由表单控件、提示信息、表单域组成)

a、表单控件

1、input(单标签)

input可以看做变色龙  通过type属性变换形状。

a、type属性值(常用):

text(文本框)、password(密码框)、radio(单选框)、checkbox(复选框)。。。

<input type=“password” />

<input type=“radio” name="sex"  />男

<input type=“radio” name="sex"  />女

单选框如果是一组,我们通过相同的name值来实现单选框效果。

复选框(可以选中多个)如果是一组也是给相同的name属性值。

b、单选框复选框中设置默认选中

checked="checked"

c、图像按钮

<input type="image" src=" "  />

d、文件域   上传图像

<input type="file"  />

2、label标签(一般和input搭配使用,用户感较好)

for   id   值为一样   点到for lebel时,光标定位到id下的输入框

3、textarea控件(文本域:用来留言)

是双标签

<textarea cols=" "   rows=" " ></textarea>

4、下拉菜单

b、表单域(form  收集表单控件信息并且提交)

<form  action="demo.php" method="get" name="表单名称login">

<input  type="text" name="username" />

...

<input  type="submit" />

</form>

html学习_表格、表单的更多相关文章

  1. [19/06/08-星期六] CSS基础_表格&表单

    一.表格 如生活中的Excel表格,用途就是同来表示一些格式化的数据,如课程表.工资条.成绩单. 在网页中也可以创建出不同的表格,在HTML中使用table标签来创建一个表格.table是个块元素. ...

  2. HTML表格表单综合——用户注册表

    今天学习了表格和表单知识,我综合了他们添加了一些拓展知识做了一个用户注册表,以下面代码来整理表格和表单知识: <!DOCTYPE html PUBLIC "-//W3C//DTD XH ...

  3. css表格表单和统筹

    css:表格表单和统筹 学习目标 1.表单标签及属性高级 2.表格标签及属性高级 3.CSS统筹 4.BFC概念和应用场景 一.表单标签及属性高级 回顾: 表单的作用:用来收集用户的信息的; 表单的组 ...

  4. Bootstrap框架(基础篇)之列表,表格,表单

    继续上篇的基础部分延伸,主要说一下列表,表格,表单相关Bootstrap框架变化以及基础知识. 1.列表篇 除了HTML提供的三种基本列表样式: 无序列表 <ul> <li>… ...

  5. Bootstrap学习笔记(二) 表单

    在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...

  6. SpringMVC学习系列 之 表单标签

    http://www.cnblogs.com/liukemng/p/3754211.html 本篇我们来学习Spring MVC表单标签的使用,借助于Spring MVC提供的表单标签可以让我们在视图 ...

  7. HTML--绝对路径, 表格,表单, 框架

    URL, URI, URN URL: 统一资源定位符: Uniform Resource Locator URN: 持久可用的资源标准名称 Uniform Resource Name , 比如邮箱 U ...

  8. Bootstrap学习笔记(3)--表格\表单\图片

    Bootstrap表格   表格类:    .table只会在表行之间增加横线;    .table-striped会在表格行之间增减斑马线;    .table-hover会给表设置鼠标悬停状态; ...

  9. 【html学习整理】meta,img,表格,表单

    meta标签: 作用: 给搜索引擎用 . 告诉浏览器是什么编码 <meta charset="UTF-8"> <meta name="keywords& ...

随机推荐

  1. 使用ThreadLocal来实现一个本地缓存

    大家应该知道,用户从发起请求,到服务器响应的这个过程中,在服务器中是在一个线程中的.如果我们吧查询出来的对象放到这个线程自己的缓存中,到用户请求结束时,把这些东西清理掉,应该是一个不错的cache方案 ...

  2. 天猫魔盒1代TMB100E刷机, 以及右声道无声的问题

    这个是在小米盒子1代之后买的, 当时速度比小米盒子快, 除了遥控器比较软, 电池盖不太对得齐以外, 用起来还不错. 但是时间长了之后总是不停自己升级, 自己安装一些应用, 还删不了, 要知道这个盒子的 ...

  3. 阿里云日志服务采集自建Kubernetes日志(标准输出日志)

    日志服务支持通过Logtail采集Kubernetes集群日志,并支持CRD(CustomResourceDefinition)进行采集配置管理.本文主要介绍如何安装并使用Logtail采集Kuber ...

  4. IASetIndexBuffer Offset

    这个Offset官方解释是:Offset (in bytes) from the start of the index buffer to the first index to use. 翻译成中文就 ...

  5. awk学习[参考转载]

    一.基本示例 1.last -n 5 | awk '{print $1}'   $0代表全部 2.last -n 5 | awk -F:  '{print $1}'    -F代表设置分割符, :代表 ...

  6. STL--迭代器(iterator)使用详解

    迭代器的分类 在STL中,原生指针也是一种迭代器,除了原生指针以外,迭代器被分为五类: Input Iterator 此迭代器不允许修改所指的对象,即是只读的.支持==.!=.++.*.->等操 ...

  7. google全球地址

    IP Addresses of Google Global Cache www.kookle.co.nr Bulgaria 93.123.23.1 93.123.23.2 93.123.23.3 93 ...

  8. WPF显示图片

    1.WPF显示图片内部一部分 <Rectangle Height="> <Rectangle.Fill > <ImageBrush ImageSource=&q ...

  9. 在 Redis 上实现的分布式锁

    由于近排很忙,忙各种事情,还有工作上的项目,已经超过一个月没写博客了,确实有点惭愧啊,没能每天或者至少每周坚持写一篇博客.这一个月里面接触到很多新知识,同时也遇到很多技术上的难点,在这我将对每一个有用 ...

  10. hdoj:2034

    #include <iostream> #include <vector> #include<algorithm> //包含sort函数 using namespa ...