HTML中的表格和表单(含有示例代码)

表格
表格的基本构成标签
table 标签:表格标签
caption标签:表格标题
tr 标签:表格中的行
th 标签 : 表格的表头
td 标签:表格单元格
HTML中的表格和表单(含有示例代码)_第1张图片
表格的基本结构
定义表格
          
    
定义表行
          
   
   
          
  
表格标题
定义表头
定义单元格

           table 表示表格  border="1" width="300" bgcolor="aqua" cellspacing="0"(单元格之间的间距)
            tr   表行 bgcolor="chartreuse" height="50"
            th   表头(单元格) 加粗 居中   width="80"    
            td   单元格  colspan="4" 在同一行跨多列合并  从哪列开始,添加colspan,给定合并的列数rowspan="3" 跨多行合并  从哪个开始添加rowspan  给定合并的数量
 

简历代码示例:



	
		
		
	
	
		

个人简历

姓名 性别 照片
出生日期 籍贯
政治面貌 民族
健康状况 婚姻状况
联系电话 电子邮箱
求职意向
工作经验
教育经历
英语水平
计算机水平
自我评价

执行结果:HTML中的表格和表单(含有示例代码)_第2张图片

 HTML中的表格和表单(含有示例代码)_第3张图片

 表单

form标签:表单

网页表单中有许多可以输入或选择的组件,用户可以在表单中填写信息,最终
提交表单,把客户端数据提交至服务器。
HTML中的表格和表单(含有示例代码)_第4张图片

 表单-文本

HTML中的表格和表单(含有示例代码)_第5张图片

 表单-其它表单

 HTML中的表格和表单(含有示例代码)_第6张图片

 表单-下拉框

HTML中的表格和表单(含有示例代码)_第7张图片

 表单-多行文本域

HTML中的表格和表单(含有示例代码)_第8张图片

 表单-按钮

HTML中的表格和表单(含有示例代码)_第9张图片

 内联框架HTML中的表格和表单(含有示例代码)_第10张图片

 代码示例:



	
		
		
	
	
		
		 
用户名:
密码:
性别:
课程: java c html css
省份
地址:
提交按钮 重置

 注:checked="checked" 给选项中添加该属性代表默认选中

 执行结果:

HTML中的表格和表单(含有示例代码)_第11张图片

 

你可能感兴趣的:(html,前端,vue.js)