HTML表格制作_html怎么建立表格-程序员宅基地

HTML中制作表格有两种方法：

（1）先把最原始的表格画出来，每一个都是单个单元格，然后再根据要求进行行合并或列合并，有的表格需要行列都合并，则也是把它分为两步做，先合并行再合并列（或者先合并列再合并行），若进行了colspan和rowspan的合并，则将之后同一行或同一列的单元格删除，但这种方法较麻烦，容易搞混。

（2）直接根据最终要生成的表格来操作，将每个合并的单元格看做一个小的单元格，不再将它拆分，然后一行一行的写表格，遇到合并的单元格直接写出colspan或rowspan，下面若遇到已经用过的合并的单元格，则不再将其算到内，只看还剩多少单元格。这种方法一行一行的写，不用再去删单元格，比较清晰。

以下为制作的一个简单表格及其代码：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>表格</title>
</head>
<h3 align="center">项目增补单</h3>
<table border="1" height="500" width="1000" cellspacing="0" align="center">
	<tr align="center">
    	<td>序号</td>
        <td>维修项目及更换配件</td>
        <td>单价</td>
        <td>数量</td>
        <td>小计</td>
        <td>工时费</td>
        <td>合计</td>
        <td>故障原因</td>
    </tr>
    <tr align="center">
    	<td>1</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr align="center">
    	<td>2</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr align="center">
    	<td>3</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr align="center">
    	<td>4</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr align="center">
    	<td>5</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr align="center">
    	<td>6</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr align="center">
    	<td rowspan="4">7</td>
        <td></td>
        <td colspan="2" rowspan="4"></td>
        <td rowspan="4"></td>
        <td rowspan="4"></td>
        <td rowspan="4"></td>
        <td rowspan="4"></td>
    </tr>
    <tr align="center">
    	<td></td>
    </tr>
    <tr align="center">
    	<td></td>
    </tr>
    <tr align="center">
    	<td></td>
    </tr>
    <tr >
    	<td colspan="2">备件费用小计：</td>
        <td colspan="5">工时费用小计：</td>
        <td>合计：</td>
    </tr>
    
</table>
<table height="50" width="900" align="center">
	<tr>
		<td>班组长：</td>
        <td>技术部：</td>
        <td>服务顾问：</td>
        <td>客户确认:</td>
	</tr>
</table>
<body>
</body>
</html>

本文链接：https://blog.csdn.net/wulianwangxuchenqi/article/details/91465602

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

docker删除重装，以及极其重要的/etc/docker/key.json文件-程序员宅基地

文章浏览阅读8.9k次，点赞2次，收藏2次。先说以下我为何要删除docker的原因吧：因为我感觉Docker Hub有点慢，就配置了阿里云的镜像加速器，可是按阿里云的官方配置完后我怎么感觉它更慢了，对比昨天配置阿里的maven镜像仓库后快到起飞的速度，我认为是此次配置没有生效。多次确认新加入的/etc/docker/demon.json文件无误后又多次systemctl了未果，随即我怀疑阿里给出的以下方案中的“修改”的/etc/dock...

空间物理——概述_空间物理概论-程序员宅基地

文章浏览阅读1.9k次，点赞3次，收藏4次。文章目录空间物理的研究对象太阳风能量向地球传输的三种方式和所需要的时间太阳内部结构、太阳活动太阳内部结构太阳活动太阳风速度从太阳表面到地球轨道附近变化参考空间物理的研究对象大气层：10KM以上，分成平流层、中层、低热层、热层、逃逸层电离层：60-90KM以上，一直到1000KM左右，部分电离气体，中性成风碰撞的影响不可忽略地球磁层：完全电离的气体，1000KM以上，可忽略碰撞，有太阳风和..._空间物理概论

BQ4050学习笔记（二）-程序员宅基地

文章浏览阅读2.9k次，点赞5次，收藏25次。BQ4050学习笔记（二）永久失效：如果发⽣严重故障，该设备可以永久禁⽤电池组。永久故障检查（IFC 和 DFW 除外）可以通过设置Settings:Enabled PFA、 Settings:Enabled PF B、 Settings:Enabled PF C 和Settings:Enabled PF D 中的相应位单独启⽤或禁⽤。所有永久在设置ManufacturingStatus()[PF]之前，故障检查（IFC 和 DFW 除外）被禁⽤。当任何PFStatus()位置位时，器件进⼊ PER_bq4050

SpringCloudAlibaba-Nacos注册中心的使用_spring-cloud-alibaba 使用nacos 2.1版本-程序员宅基地

文章浏览阅读152次。第二步：填写配置文件参数，这里定义了一个名字为application-user-dev.yaml的配置，使用的是YAML格式。DataID : 非常重要，可以看做是配置的文件的名字，在程序中拉取配置文件的时候需要指定Data ID。如果不使用默认的public命名空间，那么需要指定namespace配置为要使用的命名空间的Id值。第一步：打开Nacos监控面板，进入配置列表，新增一个user服务的配置文件。进入配置列表，切换到新建立的命名空间，创建配置文件。修改Nacos，添加命名空间。_spring-cloud-alibaba 使用nacos 2.1版本

CVE-2023-21716 Microsoft Word远程代码执行漏洞Poc_cve-2023-21716复现-程序员宅基地

文章浏览阅读293次。受害者打开python代码生成的RTF文件，RTF解析器解析恶意代码，触发堆溢出，Microsoft Word会闪退，用户其它Word中未保存的内容会丢失。_cve-2023-21716复现

c语言程序设计让a变成A,c语言程序设计a期末模拟试题.docx-程序员宅基地

文章浏览阅读451次。文件排版存档编号：[UYTR-OUPT28-KBNTL98-UYNN208]文件排版存档编号：[UYTR-OUPT28-KBNTL98-UYNN208]C语言程序设计A期末模拟试题C语言程序设计A期末模拟试题一一、单项选择题(每小题2分，共20分)由C++目标文件连接而成的可执行文件的缺省扩展名为( )。A. cpp B. exe C. obj D. li..._c语言如何将a转换成a

随便推点

利用beef和msf实现session远程命令_msf如何切换一个session-程序员宅基地

文章浏览阅读534次。笔记beef启动 beef 的方法msfbeef工具目录 /usr/share/beef-xss配置文件 config.yaml启动 beef 的方法1.beef-xss2./usr/share/beef-xss/beef(使用前需要修改默认的用户名称和密码)Web 管理界面 http://127.0.0.1:3000/ui/panelShellcode http://127.0.0.1:3000/hook.js测试页面 http://127.0.0.1:3000/demos/butch_msf如何切换一个session

python判断丑数_丑数问题及变种小结-程序员宅基地

文章浏览阅读503次。丑数问题及变种小结声明1 判断丑数因子只包含2,3,5的数称为丑数(Ugly Number)，习惯上把1当作第一个丑数面试lintcode 517 ugly numbersegmentfault剑指offer 面试题34 丑数数组解法：参考剑指offer，将待判断目标依次连续整除2，3，5，若是最后获得1，证实该数为丑数；优化/*** 依次整除2，3，5判断(2，3，5顺序判断时间最优)* htt..._编写python来证明一个数是丑数

python自动化测试实战 —— WebDriver API的使用_python webdriver api-程序员宅基地

文章浏览阅读1.9k次，点赞30次，收藏11次。Selenium 简介： WebDriver是Selenium Tool套件中最重要的组件。Selenium 2.0之后已经将Selenium和WebDriver进行合并，作为一个更简单、简洁、有利于维护的API提供给测试人员使用。它提供了一套标准的接口，可以用多种编程语言调用，并且和浏览器进行交互。 WebDriver可以对浏览器进行控制，包括输入URL，点击按钮，填写表单，滚动页面，甚至是执行JavaScript代码。同时，它也能够获取网页中的信息，如文本，标签，属_python webdriver api