首頁 後端開發 php教程 浏览器预览PHP文件时顶部出现空白影响布局分析原因及解决办法_php技巧

浏览器预览PHP文件时顶部出现空白影响布局分析原因及解决办法_php技巧

May 17, 2016 am 09:07 AM
css佈局

在编写PHP文件过程中,发现在浏览器预览PHP文件时,顶部会出现一行空白,影响了页面的布局。

关于BOM header的解释如下

通常情况下,使用Windows系统自带的记事本程序编写网页程序,但在编写或修改php博客系统代码后,进行调试时总是会出现如同以下几点问题:

–不能登入或者不能登出;
–页顶出现一条空白;
–页顶出现错误警告;
–其它不正常的情况。

分析原因
由于使用UTF-8编码,在编写或修改代码后都保存为utf-8编码格式。虽然现在几乎所有的文本编辑软件都可以显示并编辑UTF-8编码的文件,但是很遗憾的是其中很多软件的表现并不理想。

类 似WINDOWS自带的记事本等软件,在保存一个以UTF-8编码的文件时,会在文件开始的地方插入三个不可见的字符(_0xEF _0xBB _0xBF,即BOM——Byte Order Mark)。它是一串隐藏的字符,用于让记事本等编辑器识别这个文件是否以UTF-8编码。对于一般的文件,这样并不会产生什么麻烦。但对于 PHP来说,PHP在设计时就没有考虑BOM的问题,不会忽略UTF-8编码的文件开头BOM的那三个字符,会把BOM作为该文件开头正文的一部分。由于必须在
解决办法

在编辑、更改任何文本文件时,请务必使用不会乱加BOM的编辑器。Linux下的编辑器应该都没有这个问题。WINDOWS下,请勿使用记事本等编辑器。推荐的编辑器是:
Editplus 2.12版本以上;
EmEditor;
UltraEdit(需要取消‘添加BOM'的相关选项);
Dreamweaver(需要取消‘添加BOM'的相关选项);
Notepad(需要进行“转换为不带BOM的UTF-8”)等。

对于已经添加了BOM的文件,要取消的话,可以用以上编辑器另存一次。(Editplus需要先另存为gb,再另存为UTF-8。Dreamweaver在”页面属性“的 “包含Unicode 签名(BOM)”取消即可)

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

前端面試官常問的問題 前端面試官常問的問題 Mar 19, 2024 pm 02:24 PM

在前端開發面試中,常見問題涵蓋廣泛,包括HTML/CSS基礎、JavaScript基礎、框架和函式庫、專案經驗、演算法和資料結構、效能最佳化、跨域請求、前端工程化、設計模式以及新技術和趨勢。面試官的問題旨在評估候選人的技術技能、專案經驗以及對行業趨勢的理解。因此,應試者應充分準備這些方面,以展現自己的能力和專業知識。

CSS佈局單位的演變與應用:從像素到根據根元素字體大小的相對單位 CSS佈局單位的演變與應用:從像素到根據根元素字體大小的相對單位 Jan 05, 2024 pm 05:41 PM

從px到rem:CSS佈局單位的演變與應用引言:在前端開發中,我們經常需要用到CSS來實現頁面佈局。在過去的幾年間,CSS佈局單位也經歷了演變和發展。最開始我們使用的是像素(px)作為單位來設定元素的大小和位置。然而,隨著響應式設計的興起和行動裝置的普及,像素單位逐漸暴露出一些問題。為了解決這些問題,新的單位rem應運而生,並逐漸廣泛應用於CSS佈局中。一

CSS佈局技巧:實現圓形網格圖示佈局的最佳實踐 CSS佈局技巧:實現圓形網格圖示佈局的最佳實踐 Oct 20, 2023 am 10:46 AM

CSS佈局技巧:實現圓形網格圖示佈局的最佳實踐在現代網頁設計中,網格佈局是一種常見且強大的佈局技術。而圓形網格圖示佈局則是更獨特有趣的設計選擇。本文將介紹一些最佳實踐和具體程式碼範例,幫助你實現圓形網格圖示佈局。 HTML結構首先,我們需要設定一個容器元素,在這個容器裡放置圖示。我們可以使用一個無序列表(<ul>)作為容器,列表項目(<l

如何透過純CSS實現瀑布流佈局的方法與技巧 如何透過純CSS實現瀑布流佈局的方法與技巧 Oct 20, 2023 pm 06:01 PM

如何透過純CSS實現瀑布流佈局的方法和技巧瀑布流佈局(WaterfallLayout)是一種在網頁設計中常見的佈局方式,它透過將內容以多列的方式排列,每一列的高度不一致,從而形成像瀑布般的視覺效果。這種佈局常常被應用於圖片展示、商品展示等需要展示大量內容的情境中,具有良好的使用者體驗。實作瀑布流佈局的方法有很多種,可以使用JavaScript或CSS來完成。

CSS Positions佈局實現響應式圖片排版的方法 CSS Positions佈局實現響應式圖片排版的方法 Sep 26, 2023 pm 01:37 PM

CSSPositions佈局實現響應式圖片排版的方法在現代Web開發中,響應式設計已成為必備的技能。而在響應式設計中,圖片排版是一個重要的考量因素之一。本文將介紹如何使用CSSPositions佈局實現響應式圖片排版,並提供具體的程式碼範例。 CSSPositions是CSS的一種佈局方式,它可以讓我們根據需要在網頁中任意定位元素。在響應式圖片排版中,

CSS版面技巧:實現堆疊卡片效果的最佳實踐 CSS版面技巧:實現堆疊卡片效果的最佳實踐 Oct 22, 2023 am 08:19 AM

CSS版面技巧:實現堆疊卡片效果的最佳實踐在現代網頁設計中,卡片式佈局成為了一種非常流行的設計趨勢。卡片佈局能夠有效地展示訊息,提供良好的使用者體驗,並且方便響應式設計。在這篇文章中,我們將分享一些實現堆疊卡片效果的最佳CSS佈局技巧,同時提供具體的程式碼範例。使用Flexbox佈局Flexbox是CSS3中引入的一種強大的佈局模型。它能夠輕鬆地實現堆疊卡片效果

CSS版面教學:實現聖杯佈局的最佳方法 CSS版面教學:實現聖杯佈局的最佳方法 Oct 19, 2023 am 10:19 AM

CSS佈局教學:實現聖杯佈局的最佳方法,附帶程式碼範例引言:在網頁開發中,佈局是非常重要的一部分。好的佈局能夠使網頁達到更好的可讀性和可訪問性。其中,聖杯佈局是一種非常經典的佈局方式,它能夠在實現自適應的情況下使內容居中,並保持優雅的顯示效果。本文將為大家介紹如何使用最佳的方法實現聖杯佈局,並給出具體的程式碼範例。一、什麼是聖杯佈局?聖杯佈局是一種常見的三欄佈局,

CSS佈局指南:實現網格佈局的最佳實踐 CSS佈局指南:實現網格佈局的最佳實踐 Oct 26, 2023 am 10:00 AM

CSS佈局指南:實現網格佈局的最佳實踐引言:在現代網頁設計中,網格佈局已經成為一種非常流行的佈局方式。它可以幫助我們更好地組織頁面結構,使其更有層次感和可讀性。本篇文章將介紹網格佈局的最佳實踐,以及具體的程式碼範例,幫助你更好地實現網格佈局。一、什麼是網格佈局?網格佈局是指透過網格將頁面分成多個列和行,使得頁面的元素可以方便地按照一定的規律進行排列。網格佈局

See all articles