<!DOCTYPE html>声明未添加结果毁坏

最新推荐文章于 2023-04-26 17:30:26 发布

转载最新推荐文章于 2023-04-26 17:30:26 发布 · 55 阅读

·

0

·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/Agrass/p/6595867.html

文章标签：

#前端 #ViewUI

本文记录了一个前端新手在制作微信H5页面过程中遇到的问题，特别是由于缺少<!DOCTYPEhtml>声明导致的页面布局错误。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

身为一个刚工作半个月的前端小白，以此来记录那些自己踩过的坑。

<!DOCTYPE html>

在w3c的介绍是：
<!DOCTYPE> 声明必须是 HTML 文档的第一行，位于标签之前。
<!DOCTYPE> 声明不是 HTML 标签；它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。
<!DOCTYPE html>为html5的标签。

前几天老板让我做一个微信的h5页面，老实讲我这是我第一次写手机页面，自学的时候并没有有意的去接触，对于布局也是很蛋疼，不能按照psd设计的尺寸来，只能自己换算。
直接在 sublime 敲出 html，按tab回车敲出这样的结果，然后就开始写页面，对于 div 在页面中的定位大多是 position:absolute。

<html>
<head>
    <title></title>
</head>
<body>

</body>
</html>

写了一天，几个页面都写好了，做交互，要引入公司已经一些js文件，里面有一些封装好的方法，但再控制台就报了两个错误，然后寻找原因，发现是未添 <!DOCTYPE html>声明导致报错，好吧，添加上去再次F5刷新页面，没有报错了，但是页面布局却毁掉了，我写了一天啊喂，晚上要交的啊喂，说没了就没了，于是审查元素琢磨原因，发现 body 的高度是0，已 body 为父元素定位的div 都消失，很无奈，给设置高度为100%试试，还是不行，最后还是强行给body设定了一个死高度，页面才恢复过来，不过这样的方法并不可取，以后再写页面之前的时候一定记得添加上 <!DOCTYPE html>声明。

转载于:https://www.cnblogs.com/Agrass/p/6595867.html

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。