当我们做一个页面时，默认页面元素距页面左右上下都有一个很小的间隙。如下所示：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>三角形</title> </head> <style> .three{ width: 100px; height: 100px; border-style: solid; border-width: 1px; } </style> <body> <div class="three"> </div> </body> </html>
效果如下图所示：
这是由于盒子模型中，默认的body与整个页面间的外边距不为0，将body的margin设置为0px即可消除该间隙。如下所示：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>三角形</title> </head> <style> .three{ width: 100px; height: 100px; border-style: solid; border-width: 1px; } body{ margin: 0px; } </style> <body> <div class="three"> </div> </body> </html>
效果如下图所示：
