2015-06-17
一、DOCTYPE的作用?严格模式和混杂模式的区别和触发条件?
- DOCTYPE用以规定浏览器要以哪种标准来解析(html或者xhtml页面)。
- 在严格模式下,页面以标准规范呈现,而在混杂模式下,页面以一种宽松的向后兼容的规范呈现。
- 触发条件:严格模式:1.包含完整DOCTYPE时,将会执行严格模式,包含严格DTD的DOCTYPE和包含过渡DTD与URI的DOCTYPE一般是以严格模式执行,但是包含过渡DTD但没有URI的DOCTYPE以混杂模式解析,DOCTYPE不存在或者存在方式不正确也会由混杂模式解析。
- 在IE6以及以前的浏览器中有一个BUG是,如果第一个元素不是DOCTYPE,那么浏览器将会按照混杂模式解析,所以不要随意加入xml的申明到xhtml中。
二、行内元素有哪些?块级元素有哪些?CSS的盒模型?
- 块级元素:div p h1 h2 h3 h4 form ul
- 行内元素: a b br i span input select
- Css盒模型:内容,border ,margin,padding
三、IE6下常见BUG
一、IE6双倍边距bug
当页面上的元素使用float浮动时,不管是向左还是向右浮动;只要该元素带有margin像素都会使该值乘以2,例如“margin-left:10px” 在IE6中,该值就会被解析为20px。想要解决这个BUG就需要在该元素中加入display:inline 或 display:block 明确其元素类型即可解决双倍边距的BUG
二、IE6中3像素问题及解决办法
当元素使用float浮动后,元素与相邻的元素之间会产生3px的间隙。诡异的是如果右侧的容器没设置高度时3px的间隙在相邻容器的内部,当设定高度后又跑到容器的相反侧了。要解决这类BUG的话,需要使布局在同一行的元素都加上float浮动。
三、IE6中奇数宽高的BUG
IE6中奇数的高宽显示大小与偶数高宽显示大小存在一定的不同。其中要问题是出在奇数高宽上。要解决此类问题,只需要尽量将外部定位的div高宽写成偶数即可。
四、IE6中图片链接的下方有间隙
IE6中图片的下方会存在一定的间隙,尤其在图片垂直挨着图片的时候,即可看到这样的间隙。要解决此类问题,需要将img标签定义为display:block 或定义vertical-align对应的属性。也可以为img对应的样式写入font-size:0
五、IE6下空元素的高度BUG
如果一个元素中没有任何内容,当在样式中为这个元素设置了0-19px之间的高度时。此元素的高度始终为19px。
解决的方法有四种:
1.在元素的css中加入:overflow:hidden
2.在元素中插入html注释:<!– >
3.在元素中插入html的空白符:
4.在元素的css中加入:font-size:0
六、重复文字的BUG
在某些比较复杂的排版中,有时候浮动元素的最后一些字符会出现在clear清除元素的下面。
解决方法如下:
1.确保元素都带有display:inline
2.在最后一个元素上使用“margin-right:-3px
3.为浮动元素的最后一个条目加上条件注释,<!–[if !IE]>xxx<![endif]–>
4.在容器的最后元素使用一个空白的div,为这个div指定不超过容器的宽度。
七、IE6中 z-index失效
具体BUG为,元素的父级元素设置的z-index为1,那么其子级元素再设置z-index时会失效,其层级会继承父级元素的设置,造成某些层级调整上的BUG。详细解释可以阅读IE6中部分情况下z-index无效的原因,以及解决办法
结语:实际上IE6中,很多BUG的解决方法都可以使用display:inline、font-size:0、float解决。因此我们在书写代码时要记住,一旦使用了float浮动,就为元素增加一个display:inline样式,可以有效的避免浮动造成的样式错乱问题。使用空DIV时,为了避免其高度影响布局美观,也可以为其加上font-size:0 这样就很容易避免一些兼容上的问题。
转载于:https://www.cnblogs.com/binhuguang/p/4583035.html
2015-06-17相关推荐
- 【跃迁之路】【497天】程序员高效学习方法论探索系列(实验阶段254-2018.06.17)...
@(跃迁之路)专栏 实验说明 从2017.10.6起,开启这个系列,目标只有一个:探索新的学习方法,实现跃迁式成长 实验期2年(2017.10.06 - 2019.10.06) 我将以自己为实验对象. ...
- 苹果开发者账号(公司级)和邓白氏编码(D-U-N-S)申请记录(2015.06)
苹果开发者账号(公司级)和邓白氏编码(D-U-N-S)申请记录(2015.06) 第一次接触苹果开发者账号申请,记录下 一.简单介绍 详情介绍请看官方链接 https://developer.appl ...
- 2015.08.17 Ubuntu 14.04+cuda 7.5+caffe安装配置
2016.06.10 update cuda 7.5 and cudnn v5 2015.10.23更新:修改了一些地方,身边很多人按这个流程安装,完全可以安装 折腾了两个星期的caffe,windo ...
- 日报2015/11/17(第一行代码读书笔记)
ContentResolver 使用内容提供器是Android实现跨程序共享数据的标准方式. 基本用法 这里要访问的是通讯录,里面已经有一个系统自己的ContentProvider 数据查询无非是要最 ...
- 欢迎参加 2015 Autodesk 产品开发培训课程 (2015/8/17开始)
欢迎参加 2015 Autodesk 产品开发培训课程 尊敬的Autodesk 合作伙伴: 当前互联网及BIM热潮正在席卷中国的建筑工程设计行业,随之而来的是BIM行业的各种设计需求如雨后春笋般涌现, ...
- 2015.7.17( NOI2015 day1 )
今天早起做了NOI2015网络同步赛.... 最近NOI是越来越向NOIP靠拢了....但是我还是不会做..... 第一题:程序自动分析 先离散化一下..然后最多就剩20w个数 , 不等于就存起来.. ...
- 【今日早报】2019/06/17
今日看点 ✦ 中国移动公布核心网5G大单,华为中兴爱立信诺基亚中标 ✦ 恒大新能源汽车三大基地落户沈阳,投资1200亿 ✦ 台积电官宣:正式启动2nm工艺研发,全球首家 ✦ 苹果与康卡斯特和Chart ...
- 【转】小生我怕怕工具包[2010.06.17](转自52破解论坛)
该破解工具包是52破解论坛的斑竹小生我怕怕搜集制作,喜欢的可以下了啊------------------------------------------------------------------ ...
- Mculover666的博客文章导航(嵌入式宝藏站)(2021.06.17更新)
一.MCU系列 1. 开发环境 [Keil MDK](一)Keil MDK 5.28 的下载.安装.破解 [Keil MDK](二)Keil MDK中芯片器件包的安装 [Keil MDK](三)Kei ...
- 【2015/4/17】学习servlet笔记1--servlet生命周期函数
又是很久没更新.这阵子大三找实习啊.像什么腾讯啊,华为啊,我都去了.一面都被刷下来了.我痛定思痛!然后又继续痛...舍友进了网易游戏实习一个月有4k,设计类,而听说技术类的光实习就7k到9k.给我们留 ...
最新文章
- 业余快速学习虚幻引擎教程
- css左固定右自适应常用方法
- 在 Linux 下忘记 mysql root 密码的解决方法
- Python 程序打包 -- 使用pyinstaller
- ASP.NET中进行消息处理(MSMQ) 一
- 恒流电路的分析(一)
- 只有22%的人做对了这道数据分析题,你来试试吗?
- 硬核评测:企业上云的极速存储挑战,华为云全新极速IO云硬盘性能评测
- hash值为负_java – HashCode给出负值
- java map操作_Java HashMap的基本操作
- 第 15 章 代理模式
- RHEL7.0手动安装
- r语言plotmds_利用R语言进行数据分析
- python数据清洗 - Numpy库
- APK查壳软件(根据so名)
- 【软件】串口助手小软件,无需安装下载即可使用
- 个人住房抵押贷款流程让你的贷款更轻松
- 笔记本Ubuntu安装失败的一般原因
- 程序员35岁前成功的12条黄金法则
- python图灵_python图灵机器人