为什么我的画板 canvas 不能居中
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>基本图形绘制</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
#myCanvas{
border: 1px solid red;
margin: 50px auto;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="500" height="500"></canvas>
</body>
<script type="text/javascript">
</script>
</html>
刚毅87浏览 2586回答 2
2回答
-
weibo_哆啦A梦有大口袋_0
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>基本图形绘制</title> <style type="text/css"> *{ margin: 0; padding: 0; } #myCanvas{ display: block; border: 1px solid red; margin: 50px auto; } </style> </head> <body> <canvas id="myCanvas" width="500" height="500"></canvas> </body> <script type="text/javascript"> </script> </html>只有块级元素才能使用，margin: 0 auto进行水平居中行内元素的水平居中对它的父级使用text-align:center,解决问题,记得采纳 -
super_mb
经测试，canvas不是块级标签，设置display:block;即可。
随时随地看视频慕课网APP
Html/CSS
Html5
JavaScript