Question

每个人，好吧，我在这里请求各位技术人员帮助修复一个名为“Story”的Wordpress模板的问题。虽然除了UC Mini和Opera Mini之外，大多数网页浏览器都没有这个主题的大问题，我知道这只是因为这些浏览器不会渲染大部分的CSS和JavaScript代码。当我使用Story模板打开我的Wordpress驱动的网站时，它在导航和主要内容之间提供了很多空白区域。我尝试使用Firefox的Inspector功能解决问题，发现有一行不断更改其参数，即<div id="content" class="site-content">。

有时候改为

<div id="content" class="site-content" style="margin-top: 121px;">和

<div id="content" class="site-content" style="margin-top: 441px;">等。

margin-top的值会自动更改。

请帮帮我！

Answer 1

在这个主题中，＆＃34;故事＆＃34;主题，作者正在使用Top Nav的高度，然后在其中添加50px，结果总数被作为使用JS的内联CSS放置为内容div的上边距。

您可以更改此信息，请访问functions.php文件，在第157行您会看到以下行：

            $('#content').css('margin-top', $('#masthead').height() + 50);

就是这样！您可以使用固定整数来控制上边距，即50，通过将其减少到20或10将适用于窄上边距。或者您可以使用注释标签对此行进行简单注释，例如：

            //$('#content').css('margin-top', $('#masthead').height() + 50);

然后在header.php html标记中以您想要的简单方式应用您的上边距。

我相信这会解决您的问题。如果没有，请告诉我！

Answer 2

由于桌面版本没有问题，我只是为移动版本定制了代码。

<div id="content" class="site-content" <?php if ( wp_is_mobile() ) 
{ echo 'style="margin-top:70px;"';} 
else { echo 'style="margin-top:120px;"';} ?>>

到header.php

并加入书签

//$('#content').css('margin-top', $('#masthead').height() + 50);

functions.php

中的

我还要感谢Moshin

如何删除导航和主要内容之间多余的空格？

2 个答案: