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: ...
随机推荐
- SharedPreferences解析
一.概述 SharedPreferences(简称SP)是Android中很常用的数据存储方式,SP采用key-value(键值对)形式,主要用于轻量级的数据存储,尤其适合保存应用的配置参数,但不建议 ...
- [Postman]历史(8)
邮递员将您发送的所有请求存储在左侧边栏的“历史记录”视图中.您可以使用历史记录快速尝试各种请求,而不必浪费时间从头开始构建请求.您还可以通过单击请求名称来加载先前的请求. 如果您创建了一个帐户并登录P ...
- Oracle和Mysql语法异同整理笔记
目录 (1) 模糊匹配 (2) 删除数据 (3) 时间函数 (4) 关键字问题 (5) 递归查询 (6) 排序问题 (7) 空值返回0 (8) 取最大值 (9) 列转换函数 (10) 类型转行函数 @ ...
- Python find函数用法和概念
概念: Python find() 方法检测字符串中是否包含子字符串 str ,如果指定 beg(开始) 和 end(结束) 范围,则检查是否包含在指定范围内,如果包含子字符串返回开始的索引值,否则返 ...
- js代码跑马灯效果-----轮播图字效果!
文字元素: <p id="yc-msg">你有本事来打我呀!</p> js执行代码: function ycMsg() { // 获取 标签 var pOb ...
- Vue SSR不可不知的问题
Vue SSR不可不知的问题 本文主要介绍Vue SSR(vue服务端渲染)的应用场景,开发中容易遇到的一些问题,提升ssr性能的方法,以及ssr的安全性问题. ssr的应用场景 1.SEO需求 SE ...
- thymeleaf-在font标签中的使用
<font color="red" th:text="开始了">font外</font>页面显示红色字体 开始了 (同时存在,则前者覆盖 ...
- eos开发(二)使用cleos命令行客户端操作EOS(钱包wallet基础操作)
不知道下边这一段英文你们是不是能看懂,如果看不懂那就算了,我就是转过来随便看看的. 总之你记住nodeos.cleos和keosd这三个工程十分重要就行了,回头咱们的研究都从这三个工程杀进去. EOS ...
- js动态创建表单数据
var formData = new FormData(); formData.append("file",fileList[i]); formData.append(" ...
- maven下载其源代码包并关联
有时我们的源码可能会失去关联,然后需要我们在当前项目中(含有pom.xml文件的那个目录)按住shift然后在当前项目文件夹空白处右键,选择在此处打开命令输入一下命令: 1. 下载所有在POM中的的s ...