CSS是一種用于定義網頁設計樣式的語言,其中包括定位元素的位置和居中,下面介紹如何使用CSS讓畫布居中。
/*html代碼*/ <div class="box"> <canvas id="myCanvas"></canvas> </div> /*CSS代碼*/ .box { position: relative; } #myCanvas { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
首先,在HTML中添加一個div容器和canvas元素,然后在CSS中為這些元素添加樣式。
首先為div容器設置相對定位。然后設置canvas元素的絕對定位,并將其左、上都設置為50%。最后使用transform屬性將canvas元素水平和垂直移動-50% 。這樣就可以將畫布放在div容器中央了。