table标签

需求：

制作一个带表头的三行山列的表格，并显示边框；修改表格的宽度、高度、表格的对齐方式、单元格间距。

<!DOCTYPE html>
<html lang="zh_CN">
<head><meta charset="UTF-8"><title>表格标签</title>
</head>
<body>
<!--table标签是表格标签border设置表格标签width设置表格宽度height设置表格高度align：设置表格相对于页面的对齐方式cellspacing：设置单元格间距tr：行标签th：表头标签td：单元格标签b ：加粗标签align：设置单元格文本对齐方式
--><table align="center" border="1" width="200" height="300" cellspacing="2"><tr><td align="center"><b>1</b></td><td align="center"><b>2</b></td><td align="center"><b>3</b></td></tr><tr><th>4</th><th>5</th><th>6</th></tr><tr><td>7</td><td>8</td><td>9</td></tr></table></body>
</html>

表格的跨行跨列

需求：

新建一个五行五列的表格，第一行第一列的单元格要跨两列，第二行第一列的单元格跨两行，第三行第四列的单元格跨两行两列

新建五行五列的表格：

将其按照需求进行修改：

<!DOCTYPE html>
<html lang="zh_CN">
<head><meta charset="UTF-8"><title>表格的跨行跨列</title>
</head>
<body>
<!--colspan属性：设置跨列rowspan属性：设置跨行
--><table width="300" height="300" cellspacing="1" border="1"><tr><td colspan="2">1.1</td><td>1.3</td><td>1.4</td><td>1.5</td></tr><tr><td rowspan="2">2.1</td><td>2.2</td><td>2.3</td><td>2.4</td><td>2.5</td></tr><tr><td>3.2</td><td>3.3</td><td>3.4</td><td>3.5</td></tr><tr><td rowspan="2" colspan="2">4.1</td><td>4.2</td><td>4.3</td><td>4.4</td></tr><tr><td>5.1</td><td>5.2</td><td>5.3</td></tr>
</table></body>
</html>

ifarme标签

基本介绍：

ifarme标签它可以在一个html页面上，打开一个小窗口去加载一个单独的页面

<!DOCTYPE html>
<html lang="zh_CN">
<head><meta charset="UTF-8"><title>ifarme标签</title>
</head>
<body>
<!--ifarme标签可以在页面上开辟新的显示独立的页面-->
<!--ifarme标签和a标签组合使用的步骤：1.ifarme标签中使用name属性定义一个名称2.在a标签的target属性上设置ifarme的name的属性值
-->第一个页面:<!-- <a href="../IMG/feiji.png">标签语法.html</a>>--><iframe src="../IMG/feiji.png" width="200" height="300" name="lable"></iframe><br><ul><li> <a href="列表.html" target="lable">列表标签</a> </li><li> <a href="fontLable.html" target="lable">font标签</a> </li><li> <a href="imgLable.html" target="lable">img标签</a> </li></ul>
</body>
</html>

点击列表标签：

点击font标签：

点击img标签：

table标签、表格的跨行跨列、ifarme标签相关推荐

【尚硅谷 Java Web 笔记】表格的跨行跨列
colspan 属性设置跨列 rowspan 属性设置跨行 <!DOCTYPE html><html lang="en"><head><m ...
【HTML】表格的跨行跨列
表格的跨行跨列第一行第一列的单元格要跨两列,利用colspan属性来实现跨列 <table align="center" border="1" widt ...
HTML练习表格的跨行跨列操作
HTML练习表格的跨行跨列操作 colspan跨列 rowspan跨行一列跨两行(左列) 代码展示一列跨两行(右列) 代码展示一行跨两列(上行) 代码展示一行跨两列(下行) 代码展示 ...
latex表格分行跨行跨列
某个表格的单元格中文字太长需要分行显示的方法如分成3行显示添加命令 -------- \newcommand{\tabincell}[2]{\begin{tabular}{@{}#1@{}} ...
javascript 将table导出 Excel ,可跨行跨列
原文地址:https://www.cnblogs.com/hailexuexi/p/10795887.html <script language="JavaScript" t ...
itextpdf 表格生成与跨行跨列
itextpdf 表格跨行跨列操作由于前段时间需要做需求接触pdf表格,表格需要跨行跨列操作,写了个工具类,代码如下: static class PdfUtil {/*** 生成一个表格* @aut ...
HTML-表格跨行跨列
HTML-表格跨行跨列 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http:/ ...
Table表格字段居中,跨行跨列
1.整个表格字段居中 <table id="contentTable" style="text-align: center;"> </tab ...
itextpdf 表格跨行跨列与可视化图表
文章目录 itextpdf 表格跨行跨列与可视化图表效果图普通表格一(表头背景色) 普通表格二 (隔列变色) 表格跨行跨列可视化图表使用示例普通表格一(表头背景色) 普通表格二 (隔列变色) ...

table标签、表格的跨行跨列、ifarme标签

table标签

需求：

表格的跨行跨列

需求：

ifarme标签

table标签、表格的跨行跨列、ifarme标签相关推荐

最新文章

热门文章