添加html5(或任何doctype)的doctype会破坏我的网站

时间:2014-01-10 04:13:46

标签: html css html5 debugging doctype

将文档类型添加到任何照片系列页面(鲑鱼,伙伴,漂白水,水彩画)会破坏页面并导致div的固定附件背景图像不会出现。

我不确定这个网站是如何运作的,但是如果有人能帮我弄清楚网站的哪些部分在怪癖模式之外没有工作(在任何浏览器中),我真的很感激。

这是该网站的实时版本以及在github上托管的链接:

http://emilyduda.pancakeapps.com/stories.html

https://github.com/Michaelzrobin/duda-2-beta/tree/gh-pages

我知道我应该从宣布我的doctype开始 - 代码有很多错误,我没有很好地规划网站,因为我按照我的编码设计它,而且我是两个都是新手。我有很多混乱的样式和多余的样式表,还有很多调试和重构,但我想看看我是否可以处理这个doctype问题,而不必完全重新编码该网站,首先。

2 个答案:

答案 0 :(得分:3)

现代网页需要具有doctype。如果没有人,你会进入quirks mode并且它会像1995年一样再次导致你有一个破碎的box model。这就是写入任何新页面的第一件事是doctype。

Here is a link explaining many of the different modes.向下滚动查看“效果”标题,了解怪癖如何影响浏览器布局。

你唯一的行动方法是咬紧牙关并添加doctype并修复所有标记,因为除此之外你什么都不做,只能打一场艰苦的战斗。

答案 1 :(得分:2)

简答:如果<!DOCTYPE html>符合您的格式,请检查您是否涉及使用%单元,和/或是否将%替换为vw vh<!DOCTYPE html>可能有所帮助。

在这里加上我2美分的价值,以防其他人帮忙。

我有一个没有 <!DOCTYPE html>的网页运行良好,即格式正确。有一次我加入了<!DOCTYPE html>,高度被搞砸了。长话短说,我最终发现,在没有100%的情况下,包含<!DOCTYPE html>的高度计算工作正常,但是当添加100%时,它就会崩溃。我将100vh转换为%,瞧,页面格式再次有效。

我没有完成(并且不会解决)发生这种情况的原因,但也许它与%单位在怪癖模式下的表现方式有关,而不是现代“非怪癖“模式。例如,也许在怪癖模式下,<!DOCTYPE html>相对于元素的父对象之外的其他东西,比如视口......但我只是在猜测。在任何情况下,如果%打破了您的格式,请考虑调查您对vw单元的使用情况,以及使用vh / %代替dhcp-option=6 是否可能更合适。