是否有适用于 Chrome 的 -webkit 或摆脱由 PHP require_once() 引起的空白的方法？

Posted

技术标签:

【中文标题】是否有适用于 Chrome 的 -webkit 或摆脱由 PHP require_once() 引起的空白的方法？【英文标题】：Is there a -webkit for Chrome or a way to get rid of whitespace caused by PHP require_once()? 【发布时间】：2017-04-03 17:16:33 【问题描述】：

好的，所以当我使用 include()、include_once()、require() 或 require_once() 时，我遇到了 php 在我的网站顶部创建空白的小问题。我已经弄清楚如何使用 CSS -webkit 和 -moz 关键字调整适当元素的位置但是我不知道如何在 Chrome 中调整位置。

我附上了三种不同浏览器（Edge、Firefox 和 Chrome）的屏幕截图。

这是我网站左侧蓝色 div 的 CSS。

#nav_menu 
position: fixed;
height: 100%;
width: 300px;
background-color: #3C7AF3;
opacity: .6;
padding: 50px 0px 0px 0px;
z-index: 2;
-moz-transform: translateY(-2px);

• -moz-transform: translateY(-2px); 在 Firefox 中工作...

• 我尝试通过在 Notepad++ 中“转换为 UTF-8 w/o BOM”来修复空白（没有用）。

• 我需要在这里有一种-chrome-transform: translateY(-2px);，但这不是真正的代码。

• 注意：-webkit-transform: translateY(-20px); 不适用于 Chrome

如果我能摆脱由 PHP 的 require_once() 引起的空白，那么一切都会好起来的......

这是在网站的第一行（account.php）：

<?php require_once('../includes/initialize.php'); ?>

这是initialize.php：

<?php 
defined('DS') ? null : define('DS', DIRECTORY_SEPARATOR);

defined('SITE_ROOT') ? null : 
    define('SITE_ROOT' , 'C:'.DS.'wamp64'.DS.'www'.DS.'my_company');

defined('LIB_PATH') ? null : define('LIB_PATH', SITE_ROOT.DS.'includes');

// 1. load config file first
require_once(LIB_PATH.DS."config.php");

// 2. load basic functions next so that everything after can use them
require_once(LIB_PATH.DS."functions.php");

// 3. load core objects
// require_once(LIB_PATH.DS."obj".DS."session.php");
require_once(LIB_PATH.DS."database.php");
require_once(LIB_PATH.DS."obj".DS."database_object.php");

// 4. load database-related classes
require_once(LIB_PATH.DS."obj".DS."user.php");
require_once(LIB_PATH.DS."obj".DS."item.php");
?>

这些 php require_once() 中的每一个都调用纯 PHP。

这是关键：我可以注释掉（甚至删除）整个 initialize.php，但它不能修复空白。

这是 require_once() 应该留在 &lt;head&gt; 中但导致 &lt;head&gt; 标记结束的代码：

【问题讨论】：

除非包含的文件弄乱了您的布局，或者 PHP 吐出错误或警告，否则它不会导致空白。请向我们提供更多信息。 修复您的 PHP 脚本。任何泄漏的空白只会在以后给您带来更多问题。任何纯 PHP 的 PHP 脚本都不应有结束 PHP 标记 ?&gt;。 所以从initialize.php中删除php结束标签?&gt;。你真的不需要它。 @DonaldWayneMooreII 在您的代码中的某处。您的 IDE 可能正在将一堆 BOM 插入到您的代码中。 en.wikipedia.org/wiki/Byte_order_mark @DonaldWayneMooreII 另外，将您的 PHP 标记放在一个纯 PHP 文件中打开绝对没有任何问题。如果他们知道自己在做什么，没有一个理智的理性人会让他们敞开心扉。它被写入如此多的风格指南是有原因的...... 【参考方案1】：

文件开头的垃圾字符通常是 unicode 字节顺序标记。这些字符告诉解析器在解析文件时使用什么字节序。它们在 UTF-8 中无关紧要，但仍然可以配置您的 IDE 以插入它们。您可能在包含的文件中有这些。

如果它只是普通的空白，通常的罪魁祸首是 PHP 结束标签 ?&gt; 出现在早期或不需要它们的地方。例如，如果您有一个包含的类文件，并且您的 ?&gt; 末尾有一个空行，那么您无意中在包含该类的任何内容的输出中包含了一个空行。建议永远不要关闭纯 PHP 文件中的 PHP 标记。还要仔细检查以确保在开始 PHP 标记 &lt;?php 之前没有任何内容。

【讨论】：

— Sublime Text 记录到控制台（在底部）您在每个 Save 上保存的编码。我所要做的就是进入 NotePad++ 并转换为 UTF-8。我删除了我的纯 .php 文件的所有结束标签，我不再得到 BOM，但我所有的元标签都卡在我的头标签下面......我不知道这是怎么发生的。有什么建议吗？ @DonaldWayneMooreII 发布一个新问题，包括通过网络发送的实际 html，与浏览器在 DOM 浏览器中显示的内容。 – 已删除所有 BOM。我不得不返回并将所有底层文件转换为 UTF-8。非常感谢您的帮助，先生。 -唐纳德​​【参考方案2】：

更新：空白确实是由 BOM 创建的。在 NotePad++ 中打开文件，转到： Encoding -> Convert to UTF-8 和 Save 文件。确保您没有选择UTF-8 with BOM。

如果这不起作用，请尝试将 top 设置为 0px（它适用于 fixed 定位。否则，Chrome 是唯一（我称之为第三方）不支持 -webkit 的浏览器。 

#nav_menu 
    position: fixed;
    top: 0px;
    height: 100%;
    width: 300px;
    background-color: #3C7AF3;
    opacity: .6;
    padding: 50px 0px 0px 0px;
    z-index: 2;

如果这不起作用，有办法用 javascript 修复它：

if (navigator.appVersion.indexOf("Chrome/") != -1) 
var nm = document.getElementById('your_id');
nm.style.top = '-px';

【讨论】：

我和@Brad 一起讨论这个问题，我敢打赌你的问题不在于样式，而在于?&gt; 结束标签。之后的任何字符都被视为文本，并且这些结束标记可以在任何包含的文件（配置、函数、数据库...）中 我回去检查了。不是那样的。我刚刚发布了require_once() 留在&lt;head&gt; 顶部的代码截图。这不是第一次发生这种情况......参考：***.com/questions/14815400/… 我尝试转换为 ANSI 和一切。都没有用。 @DonaldWayneMooreII 您已转换为 ANSI？现在你遇到了一个真正的问题。 :-( 难怪在那个屏幕截图中一切都搞砸了。你已经将你的 UTF-8 BOM 转换为 ANSI。你很可能不得不拿出你的十六进制编辑器来解决这个问题。你能在你的版本控制？ 我使用 Notepad++ 转换回 UTF-8。没关系，我现在已经修好了……我会将这个问题标记为“已回答”，但 *** 不会让我这样做。 :D @DonaldWayneMooreII 欢迎您接受或不接受您想要的任何答案，但如果您认为您已经解决了 CSS 问题，那您就错了。尝试验证您的页面，然后看着它失败。尝试在你的页面上使用一个挑剔的解析器，然后看着它失败。如果您认为不关闭纯 PHP 文件上的 PHP 标记会破坏您的包含，那您就错了。如果您认为尽管它已在 PHP 文档、PSR 标准和许多其他样式指南中列出，但这是一种不好的做法，那您就错了。如果你关心你的工作质量，我建议你重新考虑你的方法。

以上是关于是否有适用于 Chrome 的 -webkit 或摆脱由 PHP require_once() 引起的空白的方法？的主要内容，如果未能解决你的问题，请参考以下文章

当您使用“badidea”或“thisisunsafe”绕过 Chrome 证书/HSTS 错误时，它是不是仅适用于当前站点？ [关闭]

JavaScript 时钟适用于 Chrome，但不适用于 Firefox 或 IE

jQuery背景按钮动画适用于Chrome和IE8，但不适用于Firefox或IE9 [重复]

如何检查 Angular 模块延迟加载是不是适用于 Chrome？

适用于Chrome或Firefox的Kiosk模式

formatDate JavaScript 函数仅适用于 Chrome