由javascript引起的页脚下方的空白区域...如何修复?

时间:2014-05-27 22:12:25

标签: javascript jquery wordpress

我在页脚问题下面有一个恼人的空白区域,无论我多久都找不到答案,我找不到它,因为它似乎不是我在CSS中可以做的任何事情来解决问题。此外,问题不是在每个页面上......它随意选择(看似)网站内的随机页面,这让我觉得可能是由于某些javascript代码而发生的,我似乎无法将其定位为违规方。

无论如何,经过几个小时的网站滚动,我决定加载没有javascript的网站,确定白色空间消失了。作为一个有点新手的程序员,我不确定下一步该怎么做。我把

<div class="clear"></div>

就在我的标题之前,瞧,它有效......在任何页面上都没有更多的空白区域。从技术上讲,我想这至少可以直观地解决了我的问题,但由于我是新手,我不知道这可能会产生什么影响呢?离开它可以吗?我能尝试别的吗?这个问题对任何人来说都很熟悉吗?非常感谢您的帮助!我不知道你是否需要更多的信息。

为了清楚起见,我正在使用别人的主题在Wordpress中开发一个儿童主题。该网站是一个多站点,尽管几乎所有相同的元素,但多站点上的另一个站点似乎根本没有被破坏。少数差异之一是联系表格7表格,其中每个表格都有自己的CF7表格实例。当我试图在CF7表单中添加一些javascript时,我相信它就会崩溃。由于我只将它添加到一个网站(在表单本身内),我认为这就是为什么只有一个网站打破了下面的空白区域。简单地删除代码是不够的。

顺便说一句,我应该补充一点,我以前在这个网站上遇到过这个问题,当时我的(怪异的)解决方案是重命名白色间隙出现的页面的链接......当然, 有效。显然,随着我的网站增长反向链接,我不想继续这样做。

那么,我的基本修复是否足够?

2 个答案:

答案 0 :(得分:1)

正如APAD1所说,<!DOCTYPE>声明必须始终是HTML文档中的第一个元素,否则它将无效!在<div class="clear"></div>声明之前放置<!DOCTYPE>似乎可以解决您的问题,这表明空白区域与某种特定HTML呈现模式的浏览器默认值有关或由此引起。

另外,您使用的浏览器是什么?您没有使用Internet Explorer,是吗?不同的浏览器甚至同一浏览器的不同版本可能会以不同的方式呈现您的页面。

至于<!DOCTYPE>声明,需要指出浏览器应该输入的特定布局模式。

例如,在Internet Explorer中,省略<!DOCTYPE>声明可能会导致浏览器进入 Quirks模式,而不是标准合规模式。请注意,<!DOCTYPE html>用于HTML5文档,而类似于:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">`

...用于HTML4。 (X)HTML doctype声明用于将浏览器置于特定的布局/呈现模式。不同的渲染模式导致不同的CSS默认样式。 CSS规则的某些组合可能会导致意外的空白区域。

我建议您熟悉(或至少使用)Firebug(一个FireFox扩展程序),Webkit Inspector(&#34;开发人员工具&#34;)来自Google Chrome和Safari,和/或IE Developer Tools。所有这些工具都可以帮助您检查&#34;您网页Document Object Model (DOM)中的元素。这些工具甚至可以让您查看和修改DOM中元素的HTML源代码和CSS规则。 (请注意,使用这些工具所做的任何更改都不会保存,因此持久!)这意味着使用其中一个工具,您可以选择页脚元素并查看其应用(& #34;计算&#34;)CSS样式。这不仅有助于对网页或WordPress主题进行故障排除,还有助于对其进行开发。

所以,总结一下:

  • 如果您不将<!DOCTYPE>声明作为第一个元素,那么您可以完全省略它。
  • <!DOCTYPE>声明将浏览器置于具有某些CSS默认值的特定布局模式中。
  • CSS规则的组合可能会导致意外的空白区域。
  • 您可以使用浏览器&#34;开发人员工具&#34;比如FireBug来检查(和修改)你的网页。

答案 1 :(得分:0)

好的,这已经解决了(截至目前)。问题是插件冲突是将javascript写入页脚。当我将javascript添加到Contact Form 7插件时,它只会引起问题。

为了解决这个问题,我按照你的建议编辑了firebug中的HTML,Alex。一旦我发现有问题的插件,我就禁用了冲突的脚本。

感谢您的帮助,伙计们。这已经解决了。

相关问题