简体   繁体   English

PHP包含会导致页面顶部出现空白区域

[英]PHP include causes white space at the top of the page

I have a problem on a site that I am making. 我在我正在制作的网站上遇到了问题。 There is this line of white space at the top of my page. 我页面顶部有这一行空白区域。 I can not find out where it is coming from. 我无法找到它的来源。 It might be because of extra line breaks in my page thanks to php include() or maybe it is just some faulty css. 这可能是因为我的页面中有额外的换行符,这要归功于php include()或者它可能只是一些有缺陷的CSS。

I got it! 我知道了! I must admit, this was a very strange one. 我必须承认,这是一个非常奇怪的问题。

This was my exact problem, and his solution fixed it perfectly. 是我的确切问题,他的解决方案完美地修复了它。


The problem was because of the include() . 问题是因为include()

When you save a page as UTF-8, a special signature called a byte-order mark (or BOM) is included at the beginning of the file, indicating that it is a UTF-8 file. 将页面保存为UTF-8时,文件开头会包含一个称为字节顺序标记(或BOM)的特殊签名,表示它是UTF-8文件。 You can only see BOMs with low level text editors (such as DOS edit ). 您只能看到具有低级文本编辑器的BOM(例如DOS编辑 )。 You need to remove this signature from the included file in order to get rid of the white space at the top of the page. 您需要从包含的文件中删除此签名,以便摆脱页面顶部的空白区域。

DOS编辑

In Notepad++ you can change the encoding of the file to "UTF-8 without BOM" from the "Encoding" menu. 在Notepad ++中,您可以从“编码”菜单将文件的编码更改为“无BOM的UTF-8”。 This fixes the problem for me. 这解决了我的问题。

  1. Open file in Notepadd++ 在Notepadd ++中打开文件

  2. From top bar: Encoding->Encode in UTF8 without BOM 从顶部栏开始: 编码 - >在没有BOM的UTF8中编码

  3. Save the file 保存文件

In Dreamweaver 在Dreamweaver中

Press CTRL + J or go to Change->Page Settings->Tile/Encoding and unchek UNICODE BOM if it is cheked. 按CTRL + J或转到更改 - >页面设置 - >平铺/编码 ,如果已取消,则取消选中UNICODE BOM

Well you're missing a DOCTYPE for starters... You also don't have a character encoding specified. 好吧,你错过了一个初学者的DOCTYPE ......你也没有指定一个字符编码。

Aside from that, make sure that if you've saved the files as UTF-8, they must not have a BOM at the start. 除此之外,请确保如果您将文件保存为UTF-8,则它们必须在开始时没有BOM Also ensure that you didn't leave any empty lines (although whitespace is probably ignored, otherwise every layout I've ever written would break) 还要确保你没有留下任何空行(尽管可能忽略了空格,否则我写过的每个布局都会破坏)

For some reason after your body tag before the first div you have some funky character... just delete them and re-indent as needed. 出于某种原因,在第一个div之前你的身体标签后你有一些时髦的角色......只需删除它们并根据需要重新缩进。 the character  角色 to be precise... (you can see it in Firebug if you inspect the HTML for the page...but you can't see it in the view-source because it renders as whitespace). 确切地说......(如果你检查页面的HTML ,你可以在Firebug中看到它......但你在view-source中看不到它,因为它呈现为空格)。

unrelated to the alignment issue ... you also have a miss-matched closing </li> tag after your login/signup link. 与对齐问题无关 ...在登录/注册链接后,您还有一个未匹配的结束</li>标记。

you can solve this problem doing the following... 你可以解决这个问题,做以下事情......

based in what scunliffe said... you can avoid this character... example 根据scunliffe所说的......你可以避免这个角色...例子

$file = file_get_contents('header.php');
$file = substr($file, 3, strlen($file));
echo $file;

so, you're skipping this bug... 所以,你正在跳过这个bug ...

regards 问候

重要提示:如果您使用utf-8在我的网站上有多个php页面,则需要确保将每个页面的编码更改为“在没有BOM的情况下在utf-8中编码”。

Yep, there's extra whitespace included before anything else. 是的,在其他任何事情之前都有额外的空白。

May I recommend the use of output buffering to you? 我可以向您推荐使用输出缓冲吗? You will gain a fine grained control of what is pushed to the client. 您将获得对推送给客户的内容的精细控制。

After you declare a DOCTYPE make sure to add CSS reset into the first line of your CSS code to make it consistent across all browsers : 声明DOCTYPE后,请确保将CSS重置添加到CSS代码的第一行,以使其在所有浏览器中保持一致:

*{margin:0;
 padding:0;
 }

While reviewing your website output on firebug, i found small issue on top of html rendering. 在firebug上查看您的网站输出时,我发现了html呈现之上的小问题。 view in screen shot. 在屏幕截图中查看。 萤火虫报告

It may be due to missing doctype on top of page. 这可能是由于页面顶部缺少doctype。 Add the following doctype on top of page and see output again. 在页面顶部添加以下doctype并再次查看输出。

<!doctype html>
<html itemtype="http://schema.org/WebPage" xmlns="http://www.w3.org/1999/xhtml"   xmlns:og='http://opengraphprotocol.org/schema/'
xmlns:fb='http://www.facebook.com/2008/fbml'>

Tested all suggestion online, solved with notepad, procedure : 在线测试所有建议,用记事本解决,程序:

  1. Copy all content of the file to include, from php without <? 该文件包含的所有内容,从复制php<?
  2. Open Notepad and type <? 打开记事本并输入<? then paste all code 然后粘贴所有代码
  3. Enjoy 请享用

This problem has also bothered me for a long time, until I found a very simple solution. 这个问题也困扰了我很长一段时间,直到找到一个非常简单的解决方案。

This problem is caused by a BOM character, which is used to tell code page and which endian is of a text file. 此问题是由BOM字符引起的,该字符用于表示代码页以及哪个字节序是文本文件。 When you include a PHP file, this character will be included as well. 当您包含PHP文件时,也会包含此字符。 Although you will not see the BOM character, but it might cause gap on your page. 虽然您不会看到BOM字符,但可能会导致页面出现间隙。

My solution is here. 我的解决方案在这里。 You don't have to remove this character from files. 您不必从文件中删除此字符。 What you have to do is like this: 你要做的是这样的:

<!-- <?php
include_once (dirname(__FILE__) . "/_include.php");
?> -->

Using HTML comment mark to wrap php code which includes other php files. 使用HTML注释标记来包装包含其他php文件的php代码。 And the BOM character will be considered as comment and will not appear on page. BOM字符将被视为注释,不会出现在页面上。

BOM Character creates that problem. BOM Character会产生这个问题。 Sometimes it does not create such visual character that one see. 有时它不会创造出人们看到的视觉特征。 Just check the file editor settings and set to "no BOM" to prevent such blank line. 只需检查文件编辑器设置并设置为“无BOM”以防止出现此类空行。

Sometimes images won't work because of this character, since the character set of image is corrupted by such character. 有时图像因为这个字符而无法工作,因为图像的字符集被这样的字符破坏了。

To avoid such situations, i). 为避免这种情况,i)。 check if your Code Editor creates new file with BOM. 检查代码编辑器是否使用BOM创建新文件。 If so, change this setting. 如果是,请更改此设置。 ii). ⅱ)。 Open all the files of your code and check BOM character at start ( 打开代码的所有文件并在开始时检查BOM字符(

Try this this is the best idea that I know, cheers 试试这个,这是我知道的最好的主意,干杯

<div style="position:absolute;">
<?php include("conn.php"); ?>
</div>
<!DOCTYPE html>

I just downloaded Notepad++ and should advise UTF-8 without BOM is not an encoding option. 我刚刚下载了Notepad ++,应该建议没有BOM的UTF-8不是编码选项。 Choose only "UTF-8" not the "UTF-8 BOM". 仅选择“UTF-8”而不是“UTF-8 BOM”。 That worked. 那很有效。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM