html表格的基本用法详解编程语言

cellpadding：单元格与内容之间的距离

width:代表表格在整个浏览器中的宽度显示

bgcolor:表格的背景色

align:表格中内容的对齐方式

  table  border= 1  cellspacing= 0  cellpadding= 5  width= 100%  bgcolor= #ffc0cb

  tr  align= center

  td 第1行第1列 /td

  td 第1行第2列 /td

  td 第1行第3列 /td

  td 第1行第4列 /td

  /tr

  tr align= center

  td 第2行第1列 /td

  td 第2行第2列 /td

  td 第2行第3列 /td

  td 第2行第4列 /td

  /tr

  /table

/body /html

2、 !DOCTYPE html html head lang= en

  meta charset= UTF-8

  title 高级表格的使用 /title /head body

  table width= 80%  cellspacing= 0  cellpadding= 0  border= 1

  ! 标题

  caption 年终数据报表 /caption

  ! 页眉

  thead bgcolor= yellow

  ! 表头

  tr

  th 月份 /th

  th 收入 /th

  /tr

  /thead

  ! 主体

  tbody bgcolor= pink

  tr

  td 1 /td

  td 1000 /td

  /tr

  tr

  td 2 /td

  td 2000 /td

  /tr

  tr

  td 3 /td

  td 3000 /td

  /tr

  tr

  td 4 /td

  td 4000 /td

  /tr

  /tbody

  ! 页脚

  tfoot bgcolor= green

  tr

  td 平均月收入 /td

  td 4000 /td

  /tr

  tr

  td 总计 /td

  td 40000 /td

  /tr

  /tfoot

  /table /body /html

3、跨行和跨列

!DOCTYPE html html head lang= en

  meta charset= UTF-8

  title 表格的跨行跨列 /title /head body ! 跨行和跨列 只能在 列中td使用

  table width= 80%  cellspacing= 0  cellpadding= 0  border= 1

  tr

  ! 学生成绩跨了3列

  td colspan= 3 学生成绩 /td

  /tr

  tr

  ! 张三跨了2行

  td rowspan= 2 张三 /td

  td 语文 /td

  td 85 /td

  /tr

  tr

  td 数学 /td

  td 85 /td

  /tr

  tr

  td rowspan= 2 李四 /td

  td 语文 /td

  td 85 /td

  /tr

  tr

  td 数学 /td

  td 85 /td

  /tr

  /table /body /html

4、iframe内联框架

!DOCTYPE html html head lang= en

  meta charset= UTF-8

  title 内联框架 /title /head body !

src:需要引入的文件路径

frameborder:是否显示边框  0  不显示  1 显示

scrolling：是否显示下拉框 auto  no  yes

align:根据周围的元素 这是位置

srcdoc：在内联框架中显示html内容

seamless:默认不显示边框和下拉框

name:内联框架的名称

iframe src= http://www.baidu.com  srcdoc= h1 哈哈 /h1  align= top

/iframe

iframe src= http://www.baidu.com  seamless= seamless /iframe

/body /html

二、HTML5中的一些基本属性

!DOCTYPE html html head lang= en

  meta charset= UTF-8 /head body form action= #  method= post

 

  input type= number  min= 1  max= 5

  input type= date  min= 1990-01-01

  input type= date  max= 2016-12-09

  input type= time  value= 14:43

  input type= email

  button type= submit 提交 /button /form

/body /html

原创文章，作者：ItWorker，如若转载，请注明出处：https://blog.ytso.com/12183.html

c