ホームページ バックエンド開発 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 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

フロントエンドの面接官からよく聞かれる質問 フロントエンドの面接官からよく聞かれる質問 Mar 19, 2024 pm 02:24 PM

フロントエンド開発のインタビューでは、HTML/CSS の基本、JavaScript の基本、フレームワークとライブラリ、プロジェクトの経験、アルゴリズムとデータ構造、パフォーマンスの最適化、クロスドメイン リクエスト、フロントエンド エンジニアリング、デザインパターン、新しいテクノロジーとトレンド。面接官の質問は、候補者の技術スキル、プロジェクトの経験、業界のトレンドの理解を評価するように設計されています。したがって、候補者はこれらの分野で自分の能力と専門知識を証明するために十分な準備をしておく必要があります。

純粋な CSS を使用してウォーターフォール フロー レイアウトを実装する方法とテクニック 純粋な CSS を使用してウォーターフォール フロー レイアウトを実装する方法とテクニック Oct 20, 2023 pm 06:01 PM

純粋な CSS を使用してウォーターフォール フロー レイアウトを実装する方法とテクニック。ウォーターフォール レイアウト (ウォーターフォール レイアウト) は、Web デザインで一般的なレイアウト方法です。コンテンツを高さの異なる複数の列に配置して画像を形成します。ウォーターフォールのような視覚効果です。このレイアウトは、写真表示や商品表示など、大量のコンテンツを表示する必要がある場面でよく使用され、ユーザーエクスペリエンスが優れています。ウォーターフォール レイアウトを実装するにはさまざまな方法があり、JavaScript または CSS を使用して実行できます。

CSS レイアウト単位の進化と応用: ピクセルからルート要素のフォント サイズに基づく相対単位へ CSS レイアウト単位の進化と応用: ピクセルからルート要素のフォント サイズに基づく相対単位へ Jan 05, 2024 pm 05:41 PM

px から rem へ: CSS レイアウト ユニットの進化と応用 はじめに: フロントエンド開発では、多くの場合 CSS を使用してページ レイアウトを実装する必要があります。過去数年にわたって、CSS レイアウト ユニットは進化し、発展してきました。最初は要素のサイズと位置を設定する単位としてピクセル (px) を使用しました。しかし、レスポンシブ デザインの台頭とモバイル デバイスの普及により、ピクセル ユニットにはいくつかの問題が徐々に明らかになってきました。これらの問題を解決するために、新しい単位 rem が登場し、CSS レイアウトで徐々に広く使用されるようになりました。 1つ

CSS レイアウトのヒント: 円形グリッド アイコン レイアウトを実装するためのベスト プラクティス CSS レイアウトのヒント: 円形グリッド アイコン レイアウトを実装するためのベスト プラクティス Oct 20, 2023 am 10:46 AM

CSS レイアウトのヒント: 円形グリッド アイコン レイアウトを実装するためのベスト プラクティス グリッド レイアウトは、最新の Web デザインにおける一般的で強力なレイアウト手法です。円形のグリッド アイコン レイアウトは、よりユニークで興味深いデザインの選択です。この記事では、円形グリッド アイコン レイアウトの実装に役立ついくつかのベスト プラクティスと具体的なコード例を紹介します。 HTML 構造 まず、コンテナ要素を設定し、このコンテナにアイコンを配置する必要があります。順序なしリスト (<ul>) をコンテナとして使用でき、リスト項目 (<l

レスポンシブな画像レイアウトを実装する CSS Positions レイアウト メソッド レスポンシブな画像レイアウトを実装する CSS Positions レイアウト メソッド Sep 26, 2023 pm 01:37 PM

レスポンシブな画像レイアウトを実装するための CSSPositions レイアウト メソッド 現代の Web 開発では、レスポンシブ デザインは必須のスキルとなっています。レスポンシブ デザインでは、画像のレイアウトは重要な考慮事項の 1 つです。この記事では、CSSPositions レイアウトを使用してレスポンシブ画像レイアウトを実装する方法を紹介し、具体的なコード例を示します。 CSSPositions は、必要に応じて要素を Web ページ内に任意に配置できるようにする CSS のレイアウト方法です。レスポンシブ画像レイアウトでは、

CSS レイアウト チュートリアル: 聖杯レイアウトを実装する最良の方法 CSS レイアウト チュートリアル: 聖杯レイアウトを実装する最良の方法 Oct 19, 2023 am 10:19 AM

CSS レイアウト チュートリアル: 聖杯レイアウトを実装する最良の方法、コード例付き はじめに: Web 開発において、レイアウトは非常に重要な部分です。優れたレイアウトにより、Web ページがより読みやすくアクセスしやすくなります。その中でもHoly Grailレイアウトは非常に古典的なレイアウト方法であり、コンテンツを中央に配置し、エレガントな表示効果を維持しながら適応性を実現します。この記事では、聖杯レイアウトを実装する最適な方法と具体的なコード例を紹介します。 1. 聖杯レイアウトとは何ですか? Holy Grail レイアウトは、一般的な 3 列レイアウトです。

フロントエンド SEO — 詳細な説明 フロントエンド SEO — 詳細な説明 Mar 12, 2024 pm 06:13 PM

1. 検索エンジンの動作原理 入力ボックスにキーワードを入力し、検索またはクエリをクリックすると、結果が得られます。その背後にあるストーリーを掘り下げてみると、検索エンジンは多くのことを行っています。 Baidu などの検索エンジン Web サイトは、バックグラウンドで非常に大規模なデータベースを備えており、そこには多数のキーワードが格納されており、各キーワードは多くの URL に対応しており、これらの URL は、Baidu プログラムによって広大なインターネットから 1 つずつ抽出されて収集されます。ダウンロードをクリックすると、これらのプログラムは「検索エンジン スパイダー」または「Web クローラー」と呼ばれます。これらの勤勉な「スパイダー」は、毎日インターネット上を巡回して、あるリンクから別のリンクに移動し、コンテンツをダウンロードし、分析して絞り込み、キーワードを見つけます。ユーザーにとって役に立たない、役に立つ

CSS レイアウト チュートリアル: 2 列のレスポンシブ レイアウトを実装する最良の方法 CSS レイアウト チュートリアル: 2 列のレスポンシブ レイアウトを実装する最良の方法 Oct 18, 2023 am 11:04 AM

CSS レイアウト チュートリアル: 2 列レスポンシブ レイアウトを実装する最良の方法 はじめに: Web デザインにおいて、レスポンシブ レイアウトは、ユーザーのデバイスの画面サイズと解像度に応じて Web ページが自動的にレイアウトを調整できるようにする非常に重要なテクノロジであり、より優れたパフォーマンスを提供します。ユーザー体験。このチュートリアルでは、CSS を使用して単純な 2 列のレスポンシブ レイアウトを実装する方法を示し、具体的なコード例を示します。 1. HTML 構造: まず、以下に示すような基本的な HTML 構造を作成する必要があります: <!DOCTYPEht

See all articles