DIV CSS 佈局教程網

這兩天需要用到同事Html5畫圖的東東，發現裡面畫矩形的函數畫出來的邊框出現了樣式不一致的問題，最後我通過一些排除法找到了問題的症結，現分享給大家。

先附上Html5畫矩形的的代碼：

復制代碼代碼如下:
<canvas id="myCanvas" width="578" height="200"></canvas> 
<script> 
var canvas = document.getElementById('myCanvas'); 
var context = canvas.getContext('2d'); 

context.beginPath(); 

context.rect(188.0, 50, 200, 100.375); 
context.fillStyle = 'white'; 
context.fill(); 
context.lineWidth = 1; 
context.strokeStyle = 'red'; 
context.stroke(); 
</script>

你會發現執行後邊框樣式不一樣，明顯底部很細。顏色也略有不同

把context.rect(188.0, 50, 200, 100.375)修改為context.rect(188.0, 50, 200, 100)後，發現樣式就完全一致了。
由此說明：畫矩形的時候，如果裡面的參數有不是整數的話，容易導致邊框問題，所以建議大家取整後再用。