HTML中制作表头

<!doctype html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>webrx-title-QQ:7031633</title>
	<meta name="description" content="简介">
	<meta name="keywords" content="关键字">
	<link rel="stylesheet" type="text/css" href="index.css">
	<script src=""></script>
	</head>


	<body>
	<canvas id="myCanvas" width="300" height="300"></canvas>
	<script>
	var canvas = document.getElementById('myCanvas');
	var ctx = canvas.getContext('2d');
	ctx.fillStyle='#ff0000';
	ctx.fillRect(0,0,300,300);

	ctx.beginPath();
	ctx.moveTo(0,80);
	ctx.lineTo(300,300);
	ctx.strokeStyle="white";
	ctx.stroke();

	ctx.moveTo(100,0);
	ctx.lineTo(300,300);
	ctx.strokeStyle="white";
	ctx.stroke();

	ctx.font="20px 隶书";
	ctx.fillStyle = "green";
	ctx.fillText("星",180,50);
	ctx.fillText("期",230,130);
	</script>
	<hr>
	<table width="483" border="1" cellpadding="0">
	<tr height="100">
	<td width="92">
	<canvas id="m" width="94" height="98"></canvas>
	<script>
	var canvas = document.getElementById('m');
	var ctx = canvas.getContext('2d');
	ctx.fillStyle='#ffffff';
	ctx.fillRect(0,0,94,98);

	ctx.beginPath();
	ctx.moveTo(0,30);
	ctx.lineTo(94,98);
	ctx.strokeStyle="black";
	ctx.stroke();

	ctx.moveTo(35,0);
	ctx.lineTo(94,98);
	ctx.strokeStyle="black";
	ctx.stroke();

	ctx.font="20px 隶书";
	ctx.fillStyle = "green";
	ctx.fillText("星",60,30);
	ctx.fillText("期",230,130);
	</script>
	</td>
	<td width="92"> </td>
	<td width="277"> </td>
	</tr>
	<tr>
	<td> </td>
	<td> </td>
	<td> </td>
	</tr>
	<tr>
	<td> </td>
	<td> </td>
	<td> </td>
	</tr>
	</table>
	</body>
	</html>

posted @ 2014-10-30 14:23 Sunny森阅读(903) 评论(0) 收藏举报

我叫小森