Question

如何在画布内放置边框，使其不会被边框扩展：

var myObj = {
   array: [
    {
        name: 'test-1'
    },
    {
        name: 'test-2'
    }
   ],
   simpleParam: 1,
   complexParam: {
    attribute: 2
   }
};

console.log(decodeURI($.param(myObj)));
// array[0][name]=test-1&array[1][name]=test-2&simpleParam=1&complexParam[attribute]=2

<canvas width="50" height="50" style="border: 10px solid black"></canvas> is much bigger than <canvas width="50" height="50" style="border: 1px solid black"></canvas>在这种情况下无济于事

请不要让我使用的画布是矩形的，并且形状不能通过JavaScript控制。

Answer 1

如果要通过属性设置box-shadow和width，请在这种情况下使用height。

#canvas1 {
  -webkit-box-shadow:inset 0px 0px 0px 10px #000;
   -moz-box-shadow:inset 0px 0px 0px 10px #000;
   box-shadow:inset 0px 0px 0px 10px #000;
}

#canvas2 {
  -webkit-box-shadow:inset 0px 0px 0px 1px #000;
   -moz-box-shadow:inset 0px 0px 0px 1px #000;
   box-shadow:inset 0px 0px 0px 1px #000;
}

<canvas id="canvas1" width="50" height="50"></canvas>
<canvas id="canvas2" width="50" height="50"></canvas>

画布边框增加区域，在画布内绘制边框

1 个答案: