html 表格表头画一条斜线

来源：互联网发布：掌盟互娱zmaee软件下载编辑：程序博客网时间：2024/04/29 01:59

网上利用border宽度来设置斜线的方法有局限线，就是一定要需要有颜色，有时候的并没有划上颜色的需求的。

最简单直接的方法就真正意义上画一条线，在指定要画斜线的隔离增加一个宽高与格子一样大的canvas.

html如下：

 <td id = "shedule_table_header_first" rowspan="2" style="width: 16vw;height:12vw">                <canvas style="width: 16vw;height:12vw" id="myCanvas"></canvas>  </td>

增加一个line()的js脚本：

 function line(){        var myCanvas = document.getElementById("myCanvas");        var width = myCanvas.width;        var height = myCanvas.height;        var ctx = myCanvas.getContext("2d");        ctx.strokeStyle="#DDDDDD";        ctx.moveTo(0,0);        ctx.lineTo(width,height);        ctx.stroke();        ctx.font="35px Georgia";        ctx.fillText("时间",width/3*1.8,height/3);        ctx.fillText("治疗师",width/9,height/5*4);    }

最后需要在body上添加<body onload = "line()">

OK,一条线画好了。。

0 0