22 lines
762 B
HTML
22 lines
762 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<style>
|
|
html, body { margin: 0; padding: 0; }
|
|
</style>
|
|
<body>
|
|
<canvas id ="canvas" width="120" height="120"></canvas>
|
|
<script>
|
|
var canvas = document.getElementById('canvas');
|
|
var context = canvas.getContext("2d");
|
|
// The test geometry-border-image4.html has a 100*100 paint canvas, it specifies
|
|
// border-width=10 and border-image-outset=10, which means that it is drawing to
|
|
// a 140*140 area. However, because the test has "border-image-slice: 0 fill",
|
|
// together with the border-width=10, makes it draw to a 120*120 area.
|
|
// In this ref html, we draw to a 140*140 area, but scale it to fit the 120*120
|
|
// canvas.
|
|
context.scale(120/140, 120/140);
|
|
context.fillStyle = 'green';
|
|
context.fillRect(0, 0, 140, 140);
|
|
</script>
|
|
</body>
|
|
</html>
|