网上利用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,一条线画好了。。