为什么我的有点不一样?(这里我是复制来的 没有写在一起)

来源:2-2 画棋盘

慕慕0445560

2021-04-19 19:05

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>五子棋</title>

    <link type="text/css" rel="stylesheet" href="css/style.css"/>

</head>

<body>

    <canvas id="chess">该浏览器不支持canvas画布</canvas>

    <script type="text/javascript" src="js/script.js"></script>

</body>

</html>

var chess = document.getElementById('chess');

var context = chess.getContext('2d');


context.strokeStyle = '#bfbfbf';

context.moveTo(0, 0);

context.lineTo(450, 450);

context.stroke();

#chess  {

    display: block;

    width: 450px;

    height: 450px;

    margin: 50px auto;

    box-shadow: 5px 5px 5px #b9b9b9, -2px -2px 2px #efefef;

}

下面是我浏览器中显示的 

http://img4.mukewang.com/607d63910001db1612150747.jpg

写回答 关注

1回答

  • 慕慕0445560
    2021-04-19 19:09:46

    刚发完就发现有这样的问题  是width和height样式要和视频里一样写在<canvas>标签里

    <canvas id="chess" width="450px" height="450px">


JS实现人机大战之五子棋(UI篇)

利用js及canvas绘图知识,实现程序界面编写和交互逻辑处理

35650 学习 · 136 问题

查看课程

相似问题