在HTML中使用标签<Pre></pre>时出现的问题

HTML代码如下：
图片说明

以上代码，在后缀名为“HTML”的文件中打开，如图显示： 图片说明，
框的顶部会有空白区域，黄色区域不会到框的顶部；

如果把HTML代码上面的”<!DOCTYPE html>“删除， 如图显示：图片说明，此时顶部不会出现空白；

在VisualStudio中页面设计中 无论有无“<!DOCTYPE html>”，设计页面都不会出现上面有空白.图片说明
，编译运行后还是会出现上面的情况

请问为什么会出现以上问题，该如何解决？

HTML代码如下：







xxxx
     cccc
    xxxxx

</form>


把table换掉就好了