为什么我的画板 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
浏览 2464回答 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,查看更多内容
随时随地看视频慕课网APP