#65279导致页面顶部空白一行解决方法

    今天做了两个静态html页面,在浏览器中测试的时候,发现其中一个html页面的顶部多出了些许空白,而另一个页面显示正常。在浏览器中进行了审查对比,发现有空白的那个页面的head标签里面的元素全部跑到了body里面,而且body中还多出了一个,当把这个东西删除之后就正常了。然后又在编辑器中,对比了一下这两个页面的源码,发现head部分完全一样,body中的代码也没有什么异常。最后通过查阅相关资料,才发现原来是编码的问题。

    页面的编码如果是UTF-8 + BOM,会在body开头处加入一个可见的控制符,导致页面头部会出现一个空白。这种编码方式一般会在windows操作系统中出现,比如记事本编辑器,在保存一个以UTF-8编码的文件时,会在文件开始的地方插入三个不可见的字符(0xEF 0xBB 0xBF,即BOM)。它是一串隐藏的字符,用于让记事本等编辑器识别这个文件是否以UTF-8编码。对于一般的文件,这样并不会产生什么麻烦。但对于html来说,BOM是个大麻烦。因为浏览器在解析html页面时,并不会忽略BOM,所以在解析html文件时,会把BOM作为该文件开头正文的一部分,这串字符也将会被直接执行(在页面中并不显示)出来。由此造成即使页面的 top或者padding 设置为0,也无法让整个网页紧贴浏览器顶部,因为在html一开头有这3个隐藏字符

 

解决办法:

    在各种编辑器中,都有相应的保存utf-8编码的方法,我用的是sublime text,点击file>save with Encoding 选择utf-8就可以了,详细步骤如下图所示:

 

转载于:https://www.cnblogs.com/webhome/p/6182566.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/572912.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

计算机应用技术自我分析,计算机应用*个人自我鉴定

第1篇:计算机应用*个人自我鉴定时光匆匆溜走,短短三年的大学生活即将过去。在菁菁校园中,老师的教诲,同学的友爱以及各方面,使我获得了许多知识,懂得了许多道理。为了更好地适应社会的需要,我在…

怎么把桌面计算机放到快速启动栏,怎么把桌面图标放到快速启动栏

1. 如何把桌面图标放于快速启动栏拖动图标到任务栏,之后删除桌面图标不行的话点击“开始”菜单→“运行”命令,在弹出的“运行”对话框中输入 regsvr32 /n /i:u shell32 后回车,丢失的图标便又重新回到快速启动栏了再不行的话在Windows操作系…

html5 自适应手机布局,科技常识:html5移动端自适应布局的实现

今天小编跟大家讲解下有关html5移动端自适应布局的实现 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关html5移动端自适应布局的实现 的相关资料,希望小伙伴们看了有所帮助。场景:为适应各种大小的屏幕自适应布局我知…

js 两个map合并为一个map_ArcGIS API for JS3.x教程二:构建第一个简单的程序

本文衔接上文&#xff1a;不睡觉的怪叔叔&#xff1a;ArcGIS API for JS3.x教程一&#xff1a;本地开发环境配置​zhuanlan.zhihu.com一、创建简单的HTML文档创建一个简单的HTML文档&#xff1a;<!DOCTYPE html> <html lang"en"> <head><meta c…

hibernate、easyui、struts2整合

<!DOCTYPE html> <html> <head> <meta charset"UTF-8"> <title>学生表</title> <!-- 1jQuery的js包 --> <script type"text/javascript" src"jquery-easyui-1.4.4/jquery.min.js"></script&…

selinux= 为 disabled_CentOS7关闭防火墙和SELinux

关闭防火墙查看防火墙状态[rootlocalhost ~]# systemctl status firewalld临时关闭&#xff08;下次开机启动&#xff0c;自动启动防火墙&#xff09;[rootlocalhost ~]# systemctl stop firewalld永久关闭防火墙&#xff08;开机启动时不在启动&#xff09;[rootlocalhost ~]#…

selenium 基本的键盘方法

selenium 基本的键盘方法 今晚不想加班&#xff0c;于是赶紧回来看看书&#xff1a; 1.下了selenium的小工具&#xff1a;FireBug/FirePath。 2.确定了看书顺序&#xff0c;我觉得难度低点开始比较好&#xff0c;所以我还是先看基于Python的selenium&#xff0c;另一本书再看把…

计算机主机组成部分和功能,电脑的组成部分及作用

对于很多人来讲&#xff0c;电脑的使用似乎是一件很稀松平常的事情了。但是对于一些新手或者是一些初学者来说&#xff0c;电脑的相关组成部件还有相应的作用都不是很熟悉&#xff0c;那么电脑的组成部分及作用是什么呢?下面是学习啦小编收集的关于电脑的组成部分及作用&#…

android8 通知呼吸灯_正在消失的功能,为什么越来越多的手机没有呼吸灯?你知道原因吗...

正在消失的功能&#xff0c;为什么越来越多的手机没有呼吸灯&#xff1f;你知道原因吗其实说到手机呼吸灯&#xff0c;大家应该都不陌生&#xff0c;毕竟如果你有心心念念的人儿&#xff0c;每次呼吸灯闪烁&#xff0c;都会迫不及待的打开手机查看消息&#xff0c;想看看是不是…

asp 使用TreeView控件

这段代码为了使用 TreeNodeCheckChanged 事件&#xff0c;会有回刷新的效果&#xff1b; 不喜欢的可查看改进版&#xff0c;利用js控制选择操作&#xff0c;无界面刷新&#xff0c; “http://www.cnblogs.com/GoCircle/p/6231985.html”&#xff1b; 前台代码 <style>.tn…

巴川数据科学炼成记_【脑王直通车】小小记忆高手炼成记

“ 记住150个随机数字&#xff0c;你需要多久&#xff1f;【脑王直通车】第8站到来&#xff0c;杨老师将他在《最强大脑》比赛中运用的记忆方法倾囊相授&#xff0c;孩子们变身小小记忆高手&#xff01;”记忆探秘你们知道记忆是什么吗&#xff1f;我们从小到大&#xff0c;无论…

2013年4月管理计算机应用,全国2013年4月高等教育自学考试管理系统中计算机应用试题及答案...

我自己整合过的,相当的详细,几乎设计了出现的所有的知识的哦!!全国2013年4月高等教育自学考试管理系统中计算机应用试题课程代码&#xff1a;00051请考生按规定用笔将所有试题的答案涂、写在答题纸上。选择题部分注意事项&#xff1a;1. 答题前&#xff0c;考生务必将自己的考试…

[BZOJ3173][Tjoi2013]最长上升子序列

[BZOJ3173][Tjoi2013]最长上升子序列 试题描述 给定一个序列&#xff0c;初始为空。现在我们将1到N的数字插入到序列中&#xff0c;每次将一个数字插入到一个特定的位置。每插入一个数字&#xff0c;我们都想知道此时最长上升子序列长度是多少&#xff1f;输入 第一行一个整数N…

lrange是取出所有值并移除么_图解双指针 | LeetCode 27. 移除元素

题目描述 原题链接&#xff1a;LeetCode 27. 移除元素给定一个数组 nums 和一个值 val&#xff0c;你需要原地移除所有数值等于 val 的元素&#xff0c;返回移除后数组的新长度。不要使用额外的数组空间&#xff0c;你必须在原地修改输入数组并在使用 O(1) 额外空间的条件下完成…

计算机辅助工程分析及应用论文,计算机辅助工程计量的论文

【摘要】随着科学技术的不断进步&#xff0c;计算机辅助工程计量的技术也日趋成熟并得到广泛应用。下面就广联达图形算量作以简要概述。【关键词】计算机、辅助、工程计量一、gcl7.0图形算量软件应用综述广联达图形算量软件gcl7.0是专为在目前传统定额模式向清单模式过渡时期量…

Effective前端5:减少前端代码耦合

什么是代码耦合&#xff1f;代码耦合的表现是改了一点毛发而牵动了全身&#xff0c;或者是想要改点东西&#xff0c;需要在一堆代码里面找半天。由于前端需要组织js/css/html&#xff0c;耦合的问题可能会更加明显&#xff0c;下面按照耦合的情况分别说明&#xff1a; 1. 避免全…

戴尔笔记本电脑的计算机配置在哪,戴尔电脑的便签在哪里?笔记本电脑怎么设置便签?...

戴尔电脑是国内一些用户所使用的电脑品牌。如果戴尔电脑安装的是Windows系统&#xff0c;是可以在电脑附件中找到系统自带的便笺或者Sticky Notes工具的&#xff0c;可以粘贴在电脑桌面上记录简单的文字内容&#xff0c;但并不支持设置待办提醒事项。除了系统自带便笺之外&…

12帧跑步动画分解图_画出人物跑步的动画运动规律,并上传动画效果视频和逐帧图片。...

【判断题】在竞争激烈的市场环境中,职业生的就业优势是证书【简答题】请把今天的语文作业拍照、语音上传,谢谢!【简答题】请把今天的语文作业拍照上传,今日古诗语音上传,谢谢!【简答题】请把今天的作业拍照、语音上传,谢谢!【判断题】职业纵向发展只体现在技术和职务提升。【判…

VMWare MAC系统调整磁盘

VMware&#xff0c;打开虚拟文件&#xff0c;调整磁盘大小。 从40G调整到80G 进入虚拟机&#xff0c;打开终端 diskutil list;diskutil resizeVolume disk0s2 80GB http://blog.csdn.net/binyao02123202/article/details/51629288转载于:https://www.cnblogs.com/cb168/p/62096…

约翰诺曼超级计算机研究中心,第433章 拉泽尔松教授的决定_学霸的黑科技系统_晨星LL作品_du00...

就在陆舟与格林教授达成共识的时候&#xff0c;他在普林斯顿高等研究院的办公室外面&#xff0c;正晃悠着一个奇怪的人影。似乎是犹豫了一会儿&#xff0c;那人敲开门&#xff0c;走进了办公室。“请问这里是陆舟教授的办公室吗&#xff1f;”停下手中的笔&#xff0c;薇拉开口…