`

html之表格

阅读更多

以下html代码纯属娱乐,非喜勿喷~

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<html>
  <head>
    <title>MyHtml.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
	<style>
	td {
		text-align:center;
	}
	</style>
  </head>
  
  <body>
    <table style="border:1px solid red;width:500px;" border="1" align="center">
		<tr>
			<td>1-1</td>
			<td>1-2</td>
			<td>1-3</td>
			<td>1-4</td>
		</tr>
		<tr>
			<td>2-1</td>
			<td colspan="2" rowspan="3">
				<div>
					 <table style="border:1px solid blue;width:100%;" border="1">
						<tr>
							<td>1-1</td>
							<td>1-2</td>
							<td>1-3</td>
							<td>1-4</td>
						</tr>
						<tr>
							<td>2-1</td>
							<td colspan="2" rowspan="3" >
								<div>
									<table style="border:1px solid green;width:100%;" border="1">
										<tr>
											<td>1-1</td>
											<td>1-2</td>
											<td>1-3</td>
											<td>1-4</td>
										</tr>
										<tr>
											<td>2-1</td>
											<td colspan="2" rowspan="3">
												<table style="border:1px solid green;width:100%;" border="1">
													<tr>
														<td>1-1</td>
														<td>1-2</td>
														<td>1-3</td>
														<td>1-4</td>
													</tr>
													<tr>
														<td>2-1</td>
														<td colspan="2" rowspan="3">
															<table style="border:1px solid green;width:100%;" border="1">
																<tr>
																	<td>1-1</td>
																	<td>1-2</td>
																	<td>1-3</td>
																	<td>1-4</td>
																</tr>
																<tr>
																	<td>2-1</td>
																	<td colspan="2" rowspan="3">
																		<table style="border:1px solid green;width:100%;" border="1">
																			<tr>
																				<td>1-1</td>
																				<td>1-2</td>
																				<td>1-3</td>
																				<td>1-4</td>
																			</tr>
																			<tr>
																				<td>2-1</td>
																				<td colspan="2" rowspan="3">
																					
																				</td>
																				<td>2-4</td>
																			</tr>
																			<tr>
																				<td>3-1</td>
																				<td>3-4</td>
																			</tr>
																			<tr>
																				<td>4-1</td>
																				<td>4-4</td>
																			</tr>
																			<tr>
																				<td>5-1</td>
																				<td>5-2</td>
																				<td>5-3</td>
																				<td>5-4</td>
																			</tr>
																		</table>

																	</td>
																	<td>2-4</td>
																</tr>
																<tr>
																	<td>3-1</td>
																	<td>3-4</td>
																</tr>
																<tr>
																	<td>4-1</td>
																	<td>4-4</td>
																</tr>
																<tr>
																	<td>5-1</td>
																	<td>5-2</td>
																	<td>5-3</td>
																	<td>5-4</td>
																</tr>
															</table>
														</td>
														<td>2-4</td>
													</tr>
													<tr>
														<td>3-1</td>
														<td>3-4</td>
													</tr>
													<tr>
														<td>4-1</td>
														<td>4-4</td>
													</tr>
													<tr>
														<td>5-1</td>
														<td>5-2</td>
														<td>5-3</td>
														<td>5-4</td>
													</tr>
												</table>
											</td>
											<td>2-4</td>
										</tr>
										<tr>
											<td>3-1</td>
											<td>3-4</td>
										</tr>
										<tr>
											<td>4-1</td>
											<td>4-4</td>
										</tr>
										<tr>
											<td>5-1</td>
											<td>5-2</td>
											<td>5-3</td>
											<td>5-4</td>
										</tr>
									</table>
								</div>
							</td>
							<td>2-4</td>
						</tr>
						<tr>
							<td>3-1</td>
							<td>3-4</td>
						</tr>
						<tr>
							<td>4-1</td>
							<td>4-4</td>
						</tr>
						<tr>
							<td>5-1</td>
							<td>5-2</td>
							<td>5-3</td>
							<td>5-4</td>
						</tr>
					</table>
				</div>
			</td>
			<td>2-4</td>
		</tr>
		<tr>
			<td>3-1</td>
			<td>3-4</td>
		</tr>
		<tr>
			<td>4-1</td>
			<td>4-4</td>
		</tr>
		<tr>
			<td>5-1</td>
			<td>5-2</td>
			<td>5-3</td>
			<td>5-4</td>
		</tr>
	</table>
  </body>
</html>

 

  • 大小: 49.7 KB
分享到:
评论

相关推荐

    html之表格应用

    html之表格应用教案,适合中职学校老师使用,大学html课程老师也可以使用

    表格 html 表格 html 表格 html

    尽管随着Web技术的发展,`div`+`css`的布局方式逐渐成为主流,但在处理复杂的数据展示时,HTML表格仍然具有不可替代的作用。掌握了表格的基本语法以及各种高级特性,可以更好地利用表格来优化网站的设计和用户体验。

    漂亮的表格 HTML表格

    在网页设计中,HTML表格是一种常见的数据展示方式。它们用于组织和排列结构化的信息,如数据报告、统计分析等。本教程将深入探讨如何创建“漂亮的表格”并利用HTML、CSS和JavaScript增强用户体验。 首先,HTML是...

    HTML框架,表格

    HTML表格用于在网页上组织数据,使用`&lt;table&gt;`、`&lt;tr&gt;`(行)、`&lt;td&gt;`(数据单元格)和`&lt;th&gt;`(表头单元格)等标签进行创建。以下是一个简单的表格实例: ```html 员工信息 姓名 职位 薪水 张三 经理 ...

    html好看的表格

    HTML表格是一种常用的数据展示工具,尤其在网页设计中不可或缺。"好看的html表格"是指通过HTML语言,结合CSS样式,创建出既美观又功能强大的表格。本文将深入探讨如何利用HTML和CSS来创建一个吸引人的表格。 首先,...

    漂亮的表格css+html

    首先,HTML表格的基本结构包括`&lt;table&gt;`标签,它定义了一个表格。表格由`&lt;tr&gt;`(行)标签组成,每一行中又包含`&lt;th&gt;`(表头)和`&lt;td&gt;`(数据单元格)标签。例如: ```html 表头1 表头2 数据1 数据2 `...

    html5折叠表格

    html5折叠表格

    HTML table表格编辑器

    HTML表格是网页设计中不可或缺的一部分,用于展示结构化数据,如数据列表或比较。"HTML Table表格编辑器"是一款工具,旨在提供一种便捷的方式,帮助用户在网页上创建、编辑和管理HTML表格。这款编辑器提供了诸如上下...

    表格自己展开HTML效果

    1. **HTML基础结构**:首先,创建一个基本的HTML表格。每一行应包含一个父级元素(用于鼠标悬停事件)和一个子级元素(用于隐藏的子表内容)。例如: ```html 父级数据1 展开/收起 子级数据1 &lt;!-- 更多...

    一个对html表格分页的类

    HTML表格在展示大量数据时,如果不分页,用户可能需要滚动很长距离才能查看所有内容,这无疑降低了用户体验。为了改善这种情况,"一个对html表格分页的类" 提供了解决方案。这个类允许我们将已有的HTML表格转换为...

    HTML5立体表格特效.rar

    在本案例中,“HTML5立体表格特效.rar”提供了一个利用这两项技术实现的立体效果表格,具体表现为圆角边框和阴影效果。下面将详细阐述相关知识点。 1. **HTML5表格**:HTML5中的`&lt;table&gt;`元素用于创建表格,它包含`...

    html中table的表格样式

    首先,一个基本的表格...在实践中,可以利用`TAB.HTML`和`table.html`这两个文件进行实例研究,观察和修改不同的样式属性,以更好地理解和掌握HTML表格的样式设计。记住,不断实践和探索是提升HTML和CSS技能的关键。

    html个人简历表格制作

    html个人简历表格制作

    Python实现简单HTML表格解析的方法

    ### Python 实现简单HTML表格解析的方法 在处理网页数据时,经常会遇到需要从HTML表格中提取数据的情况。本文将详细介绍如何使用Python中的`libxml2dom`模块来解析简单的HTML表格,并提供具体的代码示例。 #### 一...

    tablesorter实现HTML表格点击表头排序

    在Web开发中,数据展示通常会使用到HTML表格。为了提升用户体验和数据管理效率,我们经常需要实现表格的排序功能,让用户可以按照表格列的值进行升序或降序排列。`tablesorter`是一个非常实用的JavaScript库,它为...

    HTML对于表格的编写

    HTML表格是网页设计中不可或缺的一部分,它用于组织和展示数据,让信息更加清晰易读。在HTML中,我们使用`&lt;table&gt;`元素来创建表格,它由一系列相关的行`&lt;tr&gt;`、列`&lt;td&gt;`(或`&lt;th&gt;`表头单元格)组成。以下是对HTML...

    HTML表格的美化修饰

    在网页设计中,HTML表格是展示数据和组织信息的重要元素。然而,仅使用基本的HTML表格标记可能无法满足我们对视觉吸引力和用户体验的需求。为了创建一个布局协调、色调统一、美观且大方的表格,我们需要掌握一些HTML...

Global site tag (gtag.js) - Google Analytics