javascript - 创建 Fabric.js Canvas 时 Canvas 失去样式

Question

我有一个 Canvas 对象，它具有通过 JavaScript 函数定义的 top 和 left 属性，但是当我创建一个 fabric Canvas 对象时

var fabricCanvas= new fabric.Canvas('mycanvas');

我的 Canvas 没有出现，因为我应该尝试这样做

阅读堆栈溢出说 margin : 0 auto 解决了问题，但它没有

.canvas-container {
     margin:0 auto ;
    position:absolute; 
           top: 110;
           left: 310;        

                  }

http://postimg.org/image/htvvfr5ct/

它只是停留在底部，没有到达中间位置

Answer 1

默认情况下，相对定位样式会应用到类 canvas-container 尝试添加 important，请参见下面的 CSS 代码:

.canvas-container {
    position:absolute !important; 
           top: 110;
           left: 310;
           }

我删除了 margin:0 auto 因为元素是绝对定位的。如果您想使用定位使元素居中，请使用以下 css:

.canvas-container {
width:800px; /*assuming a width of 800px*/
height:600px; /* assuming a height of 600px */
position:absolute !important; 
top: 50%;
left:50%;
margin-left:-400px; /* width/2 */
margin-top:-300px; /* height/2 */
           }

这将使元素按照主体居中，否则您可以添加一个 position:relative 到元素的父元素。