CSS能在页面画一条斜线吗
展开全部
能，一种是使用css样式：先画一条横线或竖线，然后将这条线旋转一定角度得到斜线。代码如下：
<style>
#book{width:300px;height:20px;border-bottom:1px 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>
另外一种需要使用canvas标签，通过js实现：先画一块画板，再通过两点定位直接在画板上画线。代码如下：
<canvas id="myline" style="width:500px;height:500px;">
</canvas>
<script>
var c=document.getElementById("myline");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(0,0);
ctx.lineTo(300,150);
ctx.stroke();
</script>
<style>
#book{width:300px;height:20px;border-bottom:1px 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>
另外一种需要使用canvas标签，通过js实现：先画一块画板，再通过两点定位直接在画板上画线。代码如下：
<canvas id="myline" style="width:500px;height:500px;">
</canvas>
<script>
var c=document.getElementById("myline");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(0,0);
ctx.lineTo(300,150);
ctx.stroke();
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
