html做的word申请表（样式）

最新推荐文章于 2024-04-19 11:36:49 发布

liusaint1992

最新推荐文章于 2024-04-19 11:36:49 发布

阅读量1.1w

点赞数 3

分类专栏： CSS+DIV 文章标签： web前端 html word申请表

本文链接：https://blog.csdn.net/liusaint1992/article/details/46553327

版权

CSS+DIV 专栏收录该内容

2 篇文章 1 订阅

订阅专栏

公司项目需求中要做用html做一个word申请表的样式出来。有点意思，贴上来大家看看。

先上效果：

源代码：

<!DOCTYPE html>
<html>

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>XXXXXXX服务申请表</title>
</head>
<style type="text/css">
	h2{
		margin:0 auto;
		text-align: center;
	}
	table{
		border-collapse:collapse;
		text-align: center;
		margin: 0 auto;
	}
	table span{
		display: inline-block;
		width: 100px;
		text-align: right;
	}
	#time span{
		width: 30px;
	}
</style>
<body>
	<h2>XXXXX服务申请表</h1>
	<table border="1">
		<tr>
			<td width="140" height="70;" align="center">项目名称</td>
			<td width="470" colspan="6"> </td>
		</tr>
		<tr>
			<td height="60">项目实施地点</td>
			<td  colspan="6" style="text-align:left;">
				<span>市</span>
				<span>县</span>
				<span style="width:130px;">区（乡）</span>
				<span>村</span>
			</td>
		</tr>
		<tr>
			<td height="65" >申请单位名称</td>
			<td  colspan="6"> </td>
		</tr>
		<tr>
			<td height="70">资质<br>证书编号</td>
			<td colspan="2"  width="180"> </td>
			<td colspan="2" width="125">单位联系电话</td>
			<td colspan="2" width="175"> </td>
		</tr>
		<tr>
			<td height="60">经办人姓名</td>
			<td colspan="2" > </td>
			<td colspan="2" >经办人<br>联系电话</td>
			<td colspan="2" > </td>
		</tr>
		<tr><td height="70">经办人<br>身份证号</td>
			<td  colspan="6"> </td>
		</tr>
		<tr  id="time">
			<td height="45">起止时间</td>
			<td colspan="3" width="240"><span>年</span><span>月</span><span>日</span></td>
			<td colspan="3" width="220"><span>年</span><span>月</span><span>日</span></td>
		</tr>
		<tr>
			<td height="45">数量</td>
			<td colspan="3" style="padding:0;" >
				<table  border="0" style="border:none;">
					<tr>
						<td width="85" height="47" style="border-right:1px solid rgb(128,128,128);"></td>
						<td width="160">品牌型号</td>
					</tr>
				</table>
			</td>
			<td colspan="3" ></td>
		</tr>
		<tr>
			<td height="50">需求</td>
			<td  colspan="6"> </td>
		</tr>
		<tr>
			<td height="60">需求1</td>
			<td colspan="2" > </td>
			<td colspan="2" >需求1</td>
			<td colspan="2"> </td>
		</tr>
		<tr>
			<td height="120">备注</td>
			<td  colspan="6"> </td>
		</tr>
	</table>
	<div style="width:610px;margin:0 auto;">
		<p>注：1、以上内容要求申请人填写完整</p>
		<p style="text-indent:2em;">2、本表解释权归XXXXXXXX。咨询电话：XXXXXXXX</p>
	</div>
</body>
</html>

演示地址：

http://runningls.com/demos/css/word/word.html

请转载注明出处：http://blog.csdn.net/liusaint1992/article/details/46553327