06-HTML-表格标签
<html>
<head>
<title>表格标签学习</title>
<meta charset="utf-8"/>
<!--
表格标签学习:
table:声明一个表格
tr:声明一行,设置行高及行所有单元格的高度。
th:声明一个单元格,表头格,默认加粗居中显示
td:声明一个单元格,默认居左显示原始数据
注意:
行高即该行所有单元格的高度
单元格的宽度即列宽
属性:
border:给表格添加边框
width:设置表格的宽度
height:设置表格的高度
cellpadding:设置内容居边框的距离
cellspacing:设置边框大小
特点 :
默认根据数据的多少进行表格的大小显示
单元格的合并:
第一步:
首先确保表格是一个规整的表格
第二步:
根据要合并的单元格,找到其所在的源码位置
第三步:
行合并:在要合并的单元格中第一个单元格上使用属性rowspan="要合并的单元格的个数",并删除其他要合并的单元格完成合并
列合并:在要合并的单元格中的任意一个上使用属性colspan="要合并的单元格的个数",并删除其他要合并的单元格
-->
</head>
<body>
<h3>表格标签学习</h3>
<hr />
<h3>表格标签的常用属性及设置学习</h3>
<table border="1px" cellpadding="10px" cellspacing="10px">
<tr height="100px">
<th width="100px">科目</th>
<th width="100px">分数</th>
<th width="100px">级别</th>
<th width="150px">说明</th>
</tr>
<tr height="100px">
<td>java</td>
<td>100</td>
<td>8</td>
<td>面向对象的语言</td>
</tr>
<tr height="100px">
<td>C语言</td>
<td>100</td>
<td>8</td>
<td>面向过程的语言</td>
</tr>
</table>
<hr />
<h4>单元格的合并学习:</h4>
<table border="1px" cellspacing="0px">
<tr height="35px">
<td width="100px"></td>
<td width="100px"></td>
<td width="100px"></td>
<td width="100px"></td>
<td width="100px"></td>
</tr>
<tr height="35px">
<td colspan="2"></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr height="35px">
<td></td>
<td></td>
<td></td>
<td rowspan="2"></td>
<td></td>
</tr>
<tr height="35px">
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>
06-HTML-表格标签的更多相关文章
- [19/05/16-星期四] HTML_body标签(表格标签)
一.概念 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <titl ...
- H5 表格标签的其它标签
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- H5 表格标签基本使用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- HTML常用标签与表格标签
超链接标签: <a href="超链接地址" target="_blank">超链接的文字</a> _blank或new是在新网页中打开 ...
- 9月6日表格标签(table、行、列、表头)(补)
一.<table> <table>代表表格标签. <table></table> 1.width 表示表格宽度,宽度表达方式有像素和百分比两种.网 ...
- PHP入门 - - 06-->HTML的表格标签
表格标签<table> <table>的属性: Align: left, center, right (表格的)位置 Border: ...
- 透明、圆角、阴影效果、背景色渐变、<a></a>去外层虚线、!!!表格标签<table>
表格标签 <table> 代表表格 width:指表格的宽度 一种是像素 (浏览器缩小的时候出现滚动条) 一种是百分比(跟着浏览器的大小而大小) b ...
- HTML的表格标签
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- HTML表格标签
table标签的用途: 在表格中放图片,或用于布局(已经淘汰掉了),存放数据 table制作过程: 1.先分析表格有多少行 2.分析有多少列 3.做好表格的基本之后再添加表格需要的一些属性 table ...
- html系列教程--span style 及表格标签 title video
<span> 标签:非块状元素,用于文本描述 <style> 标签:内联样式表标签定义样式信息,必须写明type类型为text/css,建议写在head中,不是必须 demo: ...
随机推荐
- Javascript高级编程学习笔记(44)—— 动态样式
动态样式 动态样式和昨天的动态脚本一样,都是一种动态引入外部样式(脚本的方式) 由于样式是由 link 元素引入的,所以动态样式自然也就是动态生成link元素插入文档的方式 不过和动态脚本不同的是,动 ...
- 每天学点SpringCloud(十四):Zipkin使用SpringCloud Stream以及Elasticsearch
在前面的文章中,我们已经成功的使用Zipkin收集了项目的调用链日志.但是呢,由于我们收集链路信息时采用的是http请求方式收集的,而且链路信息没有进行保存,ZipkinServer一旦重启后就会所有 ...
- Cocos2d-x环境配置步骤
Cocos2d-x环境配置: (1)安装Visual Studio 2013 软件安装包为:VS2013_RTM_ULT_CHS.iso文件,将其解压后可以直接安装,也可以使用虚拟光驱等软件进行安装. ...
- json模块及其API
模块:json 所包含API列表: json.dumps : 将python对象转换成json格式 json.loads : 将json格式字符串转换为python对象 ——————————————— ...
- Axure安装、破解、汉化全套
最近公司准备使用敏捷开发流程,然后刚好需要Axure这个软件,就去找了些资源分享给大家,希望对大家有所帮助: 全套安装,破解,汉化下载地址: 链接: https://pan.baidu.com/s/1 ...
- JAVA面试题-数组字符串基础
1.大写的Integer和String是可变类还是不可变类?怎么定义不可变类?不可变.用final关键字,如public final class Integer extends Number 2.比较 ...
- C# 请求接口返回中文乱码→???
在工作过程中,调用第三方接口出现当返回的数据是中文的时候,中文数据便会变成 这样??? 迷~ ,一开始我以为是发送成功后接收字符编码是不是不对,在换过UTF-8,Unicode,...都是不行. 最后 ...
- 关于 Spring Security OAuth2 中 CORS 跨域问题
CORS 是一个 W3C 标准,全称是”跨域资源共享”(Cross-origin resource sharing).它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从而克服了 AJA ...
- 全网最全的Windows下Anaconda2 / Anaconda3里正确下载安装OpenCV(离线方式和在线方式)(图文详解)
不多说,直接上干货! 说明: Anaconda2-5.0.0-Windows-x86_64.exe安装下来,默认的Python2.7 Anaconda3-4.2.0-Windows-x86_64.ex ...
- vue-08-axios-get-post-跨域
1, 安装 cnpm install axios --save 2, 在main.js中引入 import Axios from 'axios' // 挂在在Vue上Vue.prototype.$ax ...