如何获取父div的宽度?
我需要画布的最大宽度。但是div应该仍然在我的CSS文件设置的边界内。
换言之:如何在divs边界内获得最大宽度?
因此:
function setup() {
//somehow get the width of the div and set the canvas to that
const myCanvas = createCanvas(400, 400);
myCanvas.parent('canvasDiv');
}
function draw() {
background(0);
}
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Default Page Title</title>
<link rel="stylesheet" href="blogPost.css">
<script type="text/javascript" src="../p5.js"></script>
<script type="text/javascript" src="sketch.js"></script>
</head>
<body>
<div id="containerHeader">
<h1>Default Page header</h1>
</div>
<div id="canvasDiv"></div>
<div id="container">
<p>default description</p>
</div>
</body>
</html>
最后是我的CSS:
#canvasDiv {
margin: 0;
padding: 0;
}
要获得父div的宽度,可以为canvasDiv添加CSS高度和宽度。然后,如果你想让容器从父容器获得高度和宽度,你可以写height: inherit;
和width: inherit;