2017-06-02 51 views
0

我的网站是www.rosstheexplorer.com布局问题当我展开的宽度我的浏览器

当设备宽度小于601px大于我想下面的情况发生

  1. 我不想在菜单和 自定义标题之间永远有空间
  2. 我不希望有任何空间位于客户标题之上。我现在已经解决了这个问题,请看这里的解决方案Reducing White Space Above Your Header Image Regardless Of The Browser Size
  3. 我不希望H1,插件或页面上的任何其他内容与客户标题重叠。我现在通过使用我在'无论浏览器大小的情况下减少标题图像上方的空白空间'链接讨论的代码来解决此问题。
  4. 我不希望有任何空白的客户头左侧或右侧。我现在已经解决了这个问题,请看这里的解决方案Increasing The Width Of Your Header
  5. 我想总能看到'Ross The Explorer'的全文,我不想让最后一个R被删除。我现在使用'增加标题宽度'链接中的代码讨论解决了这个问题。
  6. 导航菜单栏始终是页面的全长。

请看www.nomadicmatt.com,了解我想达到的目标。

回答

1

我不认为您正在正确加载所需的Bootstrap CSS和JS。

加载http://www.rosstheexplorer.com/wp-content/themes/penscratch/css/bootstrap-3.3.7.css会导致404错误(未找到),并且http://www.rosstheexplorer.com/wp-content/themes/penscratch/js/bootstrap.min.js也会发生。

所以发现这个样子你的排队功能:

wp_enqueue_style('bootstrap_css', get_template_directory_uri() . '/css/bootstrap-3.3.7.css'); 
wp_enqueue_script('bootstrap_js', get_template_directory_uri() . '/js/bootstrap.min.js'); 

并将其更改为:

wp_enqueue_style('bootstrap_css', 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css'); 
wp_enqueue_script('bootstrap_js', 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js'); 
+0

请参阅我的问题的底部。我现在已根据您的回复对其进行了编辑。 –

+0

@RossSymonds这是因为你不再试图加载这些网址。由于您在服务器上没有正确位置的文件,因此我上面给出的代码会从maxcdn服务器加载引导文件。因此,当使用我的代码时,尝试添加一些引导html,如一个按钮,看看它是否工作 - “' –

+0

我在哪里添加代码<按钮类型=“按钮”class =“btn btn-primary”>主? –

0

你指的是引导,3.3.7.css在你的头,但这个文件在您的服务器上/此地址上不存在。 你可以使用一个CDN加载自举CSS和JS所以你不会费心让您的服务器上的这些文件,只是头部标签中添加这两个标签:

CSS:

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 

JS:

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
+0

您的自定义标题没有显示的原因是因为您使用百分比来定义它的高度,但没有容器可供参考。如果您使用像素或任何其他非相对单位,您的自定义标题将显示出来。 例如,编辑您在第一篇文章中提供给我们的CSS代码,而不是'height:40%'将其设置为'height:500px'。 这并不完美,但应该把你放在正确的方向。 另外,如果您使用我的解决方案,为了摆脱404错误,请删除您在function.php中添加的代码。 'wp_enqueue_style ...' 和 'wp_enqueue_script ...'。 –

+0

@RossSymonds为了使它看起来更好看,把你的'

'从父母div(col-sm-12和row)中取出。您不需要创建行或在此处使用列系统,您的自定义标题具有绝对位置 - 相对于您的页面本身。 –

+0

我现在已经尝试将自定义标题放入容器中,但仍无法解决问题。 –

相关问题