摘要:什么是等高布局? 先来看一个案例: 上图中的页面的主体内容是两列结构,左列是用来导航的,右列是用来显示内容的。我们看到它们有一个共同的边框,中间还有一条分隔线,左右两列的高度都是不固定的。这种情况下就需要两列的高度保持一致了,左边高度增加,右边也跟着增加,右边高度增加,左边同样也要增加,否则就会出现“断层”的效果。在这里,等高布局是为了维护边框线条的完整性,在有些地方则可能是为了维护背景...
阅读全文
摘要:何为高度自适应? 高度自适应就是高度能跟随浏览器窗口的大小改变而改变,典型的运用在一些后台界面中上面一栏高度固定用作菜单栏或导航栏,下面一栏高度自适应用于显示内容。高度自适应不像宽度自适应那样简单,在兼容浏览器方面也稍微复杂一些。 布局思路 在IE7+及chrome、firefox等浏览器中,高度自适应可以利用绝对定位来解决。但一个元素是绝对定位时,如果没有给它设定高度或宽度,则它的的高度和...
阅读全文
摘要:css这个东西,说难不难,说容易也不容易。我觉得最重要的还是经验的积累,正所谓的不积硅步,无以至千里。这一系列文章讲述几种css特殊布局的实现,也当作为自己做个备忘吧。 首先讲的是三列布局,左右两列宽度固定,中间一列宽度自适应 这个很好实现,左右两列分别左浮动和右浮动并给一个固定宽度,中间不浮动,也不设定宽度。这样基本就可以了。但为了兼容IE还必须做些工作。 看下代码结构: 效果为:...
阅读全文
摘要:先看代码: 非IE浏览器效果: IE浏览器效果: 注意到在IE中,代码中的<style>p{background:#f00}</style> 这段样式声明并没有起作用。 解决方法:在样式表前必须要有其他的html代码,即使是一个   也行。 参考:http://since2006.com/blog/83/innerHTML-CSS-style ...
阅读全文
摘要:现在有许多成熟的js模块加载器,比如requirejs和seajs等,但是对一些小的项目来说,它们的功能可能太过于“强大”,也许我们只是想要有一个能动态加载js的功能,或许我们只是想装B一下,让自己写出的页面没有一大堆的<script src=”a.js”></script>这样的东西。前面说的两种js加载器都是更强调模块性,也就是更强调js文件的组织和管理,更适用于大的项目。就像刚刚说的,我只想有一个js文件加载器,我只需提供给它一个js文件的地址就行了的那种呢?那就进入我们的主题了,使用headjs吧。headjs其实是一整套的工具,但我只想介绍的是它其中的Java
阅读全文
摘要:话不多说,先看测试代码: 该段代码在标准浏览器(包括IE8+)中的效果为: 但在万恶的IE6和IE7中的却是这样的: 外面看到li元素的子元素是列表元素时(既ul,ol,dl),li的顶部会莫名其妙的空出一段来,就像是给li设了一个padding-top一样。 解决方法:触发li的hasLayout属性,最好的方法是设置 zoom:1
阅读全文