#book{
width:300pxheight:20pxborder-bottom:2px solid #000000
-webkit-transform: rotate(45deg)/*Safari 4+,Google Chrome 1+ */
-moz-transform: rotate(45deg)/*Firefox 3.5+*/
filter: progid:DXImageTransform.Microsoft.BasicImage(Rotation=0.45)
}
</style>
<div id="book">
</div>
当然方法还有很多种,比如用满边框,再在上面叠加一个小一点的满边框就出来斜线了。
1、打开WORD软件,新建一份文档。2、在文档中插入或绘制所需要的表格。
3、在所要做出如上图的表格单击一下,随便那一格都可以,然后单击命令栏上的表格,单击绘制斜线表头,在表头样式里选样式2,字体根据需要选,在行标题,数据标题,列标题分别输入要制表所要项。最后单击确定。
4、调整美化。
以上我是用word 2003所说,其他版本,你注意查找。因为版本不一样,工具,格式有细微区分。同时还可以操作其他样式表头制作。
<!doctype html><html>
<head>
<title>斜线表头</title>
<meta charset="utf-8">
</head>
<script Language="javascript">
function a(x, y, color) {
document.write("<img border='0' style='position: absolute left: " + (x) + " top: " + (y) + "background-color: " + color + "' src='px.gif' width=1 height=1>")
}
</script>
<body leftmargin=0 topmargin=0>
<br>
<TABLE border=0 bgcolor="000000" cellspacing="1" width=400>
<TR bgcolor="FFFFFF">
<TD width="111" height="52">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="td1">
</td>
<td>
成绩
</td>
</tr>
<tr>
<td>
姓名
</td>
<td id="td2">
</td>
</tr>
</table>
</TD>
<TD width="81">
数学
</TD>
<TD width="96">
英语
</TD>
<TD width="99">
C语言
</TD>
</TR>
<TR bgcolor="FFFFFF">
<TD>
张三
</TD>
<TD>
55
</TD>
<TD>
66
</TD>
<TD>
77
</TD>
</TR>
<TR bgcolor="FFFFFF">
<TD>
李四
</TD>
<TD>
99
</TD>
<TD>
68
</TD>
<TD>
71
</TD>
</TR>
<TR bgcolor="FFFFFF">
<TD>
王五
</TD>
<TD>
33
</TD>
<TD>
44
</TD>
<TD>
55
</TD>
</TR>
</TABLE>
<script>
function getTop(tdobj) {
vParent = tdobj.offsetParent
t = tdobj.offsetTop
while (vParent.tagName.toUpperCase() != "BODY") {
t += vParent.offsetTop
vParent = vParent.offsetParent
}
return t
}
function getLeft(tdobj) {
vParent = tdobj.offsetParent
t = tdobj.offsetLeft
while (vParent.tagName.toUpperCase() != "BODY") {
t += vParent.offsetLeft
vParent = vParent.offsetParent
}
return t
}
function line(x1, y1, x2, y2, color) {
var tmp
if (x1 >= x2) {
tmp = x1
x1 = x2
x2 = tmp
tmp = y1
y1 = y2
y2 = tmp
}
for (var i = x1 i <= x2 i++) {
x = i
y = (y2 - y1) / (x2 - x1) * (x - x1) + y1
a(x, y, color)
}
}
//line(1,1,100,100,"000000")
line(getLeft(td1), getTop(td1), getLeft(td1) + td1.offsetWidth, getTop(td1) + td1.offsetHeight, '#000000')
line(getLeft(td2), getTop(td2), getLeft(td2) + td2.offsetWidth, getTop(td2) + td2.offsetHeight, '#000000')
</script>
</BODY>
</HTML>
table本身没有这个样式 1,作图,2css,js