关于浮动,怪异模式

font-family:字体,后面一般有多个属性,表示为候选项。

em相对与父级元素而言,默认为16px,如果是默认的话是1em=16px;

如果父级是24px;而子级别的设置为2em,则是48px;

rem是相对与body而言的,常应用移动端。

7-21

块元素是占据整行的,高度由里面的内容(如果高度没有设置的话)所撑高,非替换行内元素em,var,strong,a的高度是由行高所决定的,宽度是由内边的内容所田宽,所以非替换行内元素设置的宽高都不生效,垂直方向的margin也不生效。

替换元素(img, input)是可以设置宽高,垂直方向上的margin也是生效的。

块之间的左右外边距相加,上下外边距却去最大值(未浮动),如果是已经浮动,上下外边距还是相加。

display:none:元素已经消失,不占空间

visibility:hidden:元素隐藏,占据空间

标准模式下:width=content+padding+border+margin;设置的宽width=content

怪异模式下:width=content+margin;设置的宽度width=border+padding+content

7-22

float:

行内元素浮动后,变成块元素,可以设置宽高,跟垂直方向上的margin,padding;

如果要浮动的话,前面一个兄弟元素也要浮动,否则会导致内容环绕。

在编辑时确定的width和height是内容的width和height,而在浏览器中,我们确定一个块的时候,往往要给的是一个盒子的宽度高度等等。清除浮动的话,一般确定一个类为clearfix然后在父元素中加入该类,在css中写clearfix{

*zoom:1;(表示ie7一下版本使用,触发IE的布局属性haslayout)

}

clearfix:after{

clear:both;content:"";visibility:hidden;

display:block;font-size:0;height:0;

}

时间: 2024-08-03 23:29:49

关于浮动,怪异模式的相关文章

IE 怪异模式(Quirks Mode)对 HTML 页面的影响

本文主要描述 Quirks Mode 和 Standards Mode 这两种文档模式渲染页面时的差异由来,并且给出一些详细的例子说明差异所在.通过阅读本文,Web 开发工程师可以对浏览器工作原理有更为深刻的理解,避免自己所开发的 Web 应用在不同的浏览器上产生不同的效果. Quirks Mode 概述 定义 什么是 Quirks Mode? 简单来说,Quirks Mode 就是浏览器为了兼容很早之前针对旧版本浏览器设计.并未严格遵循 W3C 标准的网页而产生的一种页面渲染模式. 历史 由渲

怪异模式(Quirks Mode)对 HTML 页面的影响

Quirks Mode 概述 定义 什么是 Quirks Mode? 简单来说,Quirks Mode 就是浏览器为了兼容很早之前针对旧版本浏览器设计.并未严格遵循 W3C 标准的网页而产生的一种页面渲染模式. 历史 由渲染引擎产生的两种文档模式 谈到 Quirks modes 首先就要从浏览器渲染引擎说起.我们知道所有的浏览器都有自己的页面渲染引擎,渲染引擎主要包含两部分,一部分负责 HTML.CSS 代码的解析,另一部分负责脚本代码解析,这两部分合起来就可以绘制出完整的页面. 表 1 各浏览

浏览器的标准模式和怪异模式的区别

所谓的标准模式是指,浏览器按W3C标准解析执行代码:怪异模式则是使用浏览器自己的方式解析执行代码,因为不同浏览器解析执行的方式不一样,所以我们称之为怪异模式.浏览器解析时到底使用标准模式还是怪异模式,与你网页中的DTD声明直接相关,DTD声明定义了标准文档的类型(标准模式解析)文档类型,会使浏览器使用相应的方式加载网页并显示,忽略DTD声明,将使网页进入怪异模式(quirks mode).

浏览器的标准模式与怪异模式的设置与区分方法

由于历史的原因,各个浏览器在对页面的渲染上存在差异,甚至同一浏览器在不同版本中,对页面的渲染也不同.在W3C标准出台以前,浏览器在对页面的渲染上没有统一规范,产生了差异(Quirks mode或者称为Compatibility Mode):由于W3C标准的推出,浏览器渲染页面有了统一的标准(CSScompat或称为Strict mode也有叫做Standars mode),这就是二者最简单的区别.W3C标准推出以后,浏览器都开始采纳新标准,但存在一个问题就是如何保证旧的网页还能继续浏览,在标准出

浏览器标准模式与怪异模式-CSS1Compat and BackCompat

由于历史的原因,各个浏览器在对页面的渲染上存在差异,甚至同一浏览器在不同版本中,对页面的渲染也不同.在W3C标准出台以前,浏览器在对页面的渲染上没有统一规范,产生了差异(Quirks mode或者称为Compatibility Mode):由于W3C标准的推出,浏览器渲染页面有了统一的标准(CSScompat或称为Strict mode也有叫做Standars mode),这就是二者最简单的区别. W3C标准推出以后,浏览器都开始采纳新标准,但存在一个问题就是如何保证旧的网页还能继续浏览,在标准

浏览器标准模式与怪异模式的区别

两种模式的不同主要表现在盒模型和渲染模式的不同上 要想写出跨浏览器的CSS,必须知道浏览器解析CSS的两种模式:标准模式(strict mode)和怪异模式(quirks mode) 所谓的标准模式是指,浏览器按W3C标准解析执行代码:怪异模式则是使用浏览器自己的方式解析执行代码,因为不同浏览器解析执行的方式不一样,所以我们称之为怪异模式.浏览器解析时到底使用标准模式还是怪异模式,与你网页中的DTD声明直接相关,DTD声明定义了标准文档的类型(标准模式解析)文档类型,会使浏览器使用相应的方式加载

网页上传到服务器后访问时出现怪异模式(Quirks mode)

1.更多内容请参考:http://blog.csdn.net/freshlover/article/details/11616563 http://blog.csdn.net/barebear/article/details/5100260 2.当使用jsp+tomcat+mysql开发时,将tomcat上传到服务器后,使用360浏览器通过ip访问网站时,本来很好的网站样式会变得混乱,导航栏,图片,特别是盒模型会有很大的变化.使用360的工具->开发人员工具.查看网页文档模式时,发现使用的是Qi

浏览器 怪异模式(Quirks Mode) 与 标准模式(Standards Mode)

怪异模式,浏览器使用自己的方式解析渲染页面,在不同的浏览器就会显示不同的样式.标准模式,浏览器使用W3C的标准解析渲染页面. 通过 document.compatMode 的值可以知道当前用的是什么模式.BackCompat:怪异模式CSS1Compat:标准模式 IE 6 for Windows/mac, Mozilla, Safari和Opera 都实现了这两种模式,但是IE 6以下版本永远定在了怪异模式.没有指定dtd将会开启浏览器的怪异模式,这种说法是错的!正确的说法应该是没有定义doc

浏览器的标准模式和怪异模式

要想写出跨浏览器的CSS,必须知道浏览器解析CSS的两种模式:标准模式(strict mode)和怪异模式(quirks mode). 标准模式: 浏览器按W3C标准解析执行代码: 怪异模式: 使用浏览器自己的方式解析执行代码,因为不同浏览器解析执行的方式不一样,所以我们称之为怪异模式. 浏览器解析时到底使用标准模式还是怪异模式,与你网页中的DTD声明直接相关. DTD声明定义了标准文档的类型(标准模式解析)文档类型,会使浏览器使用相应的方式加载网页并显示: 忽略DTD声明,将使网页进入怪异模式