您當(dāng)前位置:圖趣網(wǎng)(Tuquu) >> 網(wǎng)頁設(shè)計教程 >> 移動前端 >> 瀏覽設(shè)計教程

導(dǎo)致頁面頂部空白一行解決方法

模板文件生成html文件之后會在body開頭處加入一個可見的控制符&#65279,導(dǎo)致頁面頭部會出現(xiàn)一個空白行。原因是頁面的編碼是UTF-8 + BOM。

這種編碼方式一般會在windows操作系統(tǒng)中出現(xiàn),比如WINDOWS自帶的記事本等軟件,在保存一個以UTF-8編碼的文件時,會在文件開始的地方插入三個不可見的字符(0xEF 0xBB 0xBF,即BOM)。它是一串隱藏的字符,用于讓記事本等編輯器識別這個文件是否以UTF-8編碼。對于一般的文件,這樣并不會產(chǎn)生什么麻煩。但對于 PHP來說,BOM是個大麻煩。因?yàn)镻HP并不會忽略BOM,所以在讀取、包含或者引用這些文件時,會把BOM作為該文件開頭正文的一部分。根據(jù)嵌入式語言的特點(diǎn),這串字符將被直接執(zhí)行(顯示)出來。由此造成即使頁面的 top padding 設(shè)置為0,也無法讓整個網(wǎng)頁緊貼瀏覽器頂部,因?yàn)樵趆tml一開頭有這3個隱藏字符&#65279!

什么是bom頭?

在utf-8編碼文件中BOM在文件頭部,占用三個字節(jié),用來標(biāo)示該文件屬于utf-8編碼,現(xiàn)在已經(jīng)有很多軟件識別bom頭,但是還有些不能識別bom頭,比如PHP就不能識別bom頭,這也是用記事本編輯utf-8編碼后執(zhí)行就會出錯的原因了。其實(shí)UTF-8 的BOM對UFT-8沒有作用,是為了支援UTF-16,UTF-32才加上的BOM,BOM簽名的意思就是告訴編輯器當(dāng)前文件采用何種編碼,方便編輯器識別,但是BOM雖然在編輯器中不顯示,但是會產(chǎn)生輸出,就像多了一個空行。

類似WINDOWS自帶的記事本等軟件,在保存一個以UTF-8編碼的文件時,會在文件開始的地方插入三個不可見的字符(0xEF 0xBB 0xBF,即BOM)。它是一串隱藏的字符,用于讓記事本等編輯器識別這個文件是否以UTF-8編碼。對于一般的文件,這樣并不會產(chǎn)生什么麻煩。但對于 PHP來說,BOM是個大麻煩。PHP并不會忽略BOM,所以在讀取、包含或者引用這些文件時,會把BOM作為該文件開頭正文的一部分。根據(jù)嵌入式語言的特點(diǎn),這串字符將被直接執(zhí)行(顯示)出來。由此造成即使頁面的 top padding 設(shè)置為0,也無法讓整個網(wǎng)頁緊貼瀏覽器頂部,因?yàn)樵趆tml一開頭有這3個字符呢!最大的麻煩還不是這個。受COOKIE送出機(jī)制的限制,在這些文件開頭已經(jīng)有BOM的文件中,COOKIE無法送出(因?yàn)樵贑OOKIE送出前PHP已經(jīng)送出了文件頭),所以登入和登出功能失效。一切依賴COOKIE、SESSION實(shí)現(xiàn)的功能全部無效。因此,在編輯、更改任何文本文件時,請務(wù)必使用不會亂加BOM的編輯器。Linux下的編輯器應(yīng)該都沒有這個問題。WINDOWS下,請勿使用記事本等編輯器。推薦的編輯器是: Editplus 2.12版本以上; EmEditor; UltraEdit(需要取消‘添加BOM’的相關(guān)選項(xiàng)); Dreamweaver(需要取消‘添加BOM’的相關(guān)選項(xiàng)) 等。對于已經(jīng)添加了BOM的文件,要取消的話,可以用以上編輯器另存一次。(Editplus需要先另存為gb,再另存為UTF-8。)

去掉bom頭的辦法,簡單的是下面兩種:

1、editplus去BOM頭的方法

編輯器調(diào)整為UTF8編碼格式后,保存的文件前面會多出一串隱藏的字符(也即是BOM),用于編輯器識別這個文件是否是以UTF8編碼。

運(yùn)行Editplus,點(diǎn)擊工具,選擇首選項(xiàng),選中文件,UTF-8標(biāo)識選擇 總是刪除簽名,

然后對PHP文件編輯和保存后的PHP文件就是不帶BOM的了。

2、ultraedit去除bom頭辦法

打開文件后,另存為選項(xiàng)的編碼格式里選擇(utf-8 無bom頭),確定就ok了。

[教程作者:admin]
免責(zé)聲明:本站文章系圖趣網(wǎng)整理發(fā)布,如需轉(zhuǎn)載,請注明出處,素材資料僅供個人學(xué)習(xí)與參考,請勿用于商業(yè)用途!
本文地址:http://irelandcustomcontracting.com/tutorial/wd3271.html
關(guān)于input里面的輸入光標(biāo)高度問題
CSS強(qiáng)制英文、中文換行與不換行 強(qiáng)制英文換行
圖趣網(wǎng)微信
建議反饋
×