06 2009 档案

摘要:在前面的三篇系列文章中,我对九宫格布局作了详细的介绍。先从一个基本布局入手,将在制作过程中遇到的问题逐一进行了讲解。这三篇文章都是基本原理的讲解,没有一个有力的应用案例来证明这种原理是否正确,可能有些朋友已经有点急不可烦,也有网友要求我能提供案例。因此,在这一篇文章中,我将介绍一个九宫格案例—极酷的播放器。 阅读全文
posted @ 2009-06-29 08:44 Biny 阅读(6680) 评论(19) 推荐(1) 编辑
摘要:在我的前一篇教程《牢不可破的九宫格布局》中,我介绍了一种比较完美的九宫格布局方法,它能完全弹性地调整自己的宽高,从而实现比较灵活的布局风格。 然而为了弹性功能完美地体现出来,所付出的代价还是很沉重的,从结构上看,其结构是比较臃肿的,但是每个节点又是必不可少的,无法精简,否则会导致其灵活性不够。 在实战运用中,可能好多设计师并不喜欢这种布局结构,嫌其结构冗余。 一个完美的九宫格设计应该是一种三层分离的结构,我想达到的理想的九宫格应该是这样的: 1、 只需要应用一个class样式给想应用九宫格布局的容器,就能自动创建这种布局。结构应该足够精简,只用很少的结构就能实现丰富的颜色风格。 2、 能够将这种布局样式应用于一个页面的多个容器中。 3、 三层分离的设计,能提供丰富的颜色皮肤方案,便 阅读全文
posted @ 2009-06-24 08:47 Biny 阅读(7020) 评论(10) 推荐(0) 编辑
摘要:在我的前一篇教程《九宫格基本布局》中,我介绍了用相对定位加绝对定位的方法来制作九宫格的基本布局。这是一种比较符合人们惯性思维的方法,好像制作过程中一切都是顺理成章的事情,然而因为IE6让人恶心的奇偶性BUG,使得这种布局方法要想通用变得有点遥不可及,因为国内大多数用户还是用着IE6,我们不能因此而丢掉这部分用户。 这个BUG目前是无药可治,也没有什么Hack技巧能运用,唯一能用的方式就是绕开它。也就是说我要定位这九宫格的四个角容器的位置,绝对定位的方法是不能采用的了,这不吝是一个重大的打击,这将完全推翻我前一篇文章中用到的方法,我们只好另起炉灶了。 阅读全文
posted @ 2009-06-22 08:41 Biny 阅读(5929) 评论(18) 推荐(0) 编辑
摘要:九宫格是一种比较古老的设计,它最基本的表现其实就像是一个三行三列的表格。其实它最初是在window的c/s结构中用得比较多,比如我们经常看到软件中的一个窗体,其实就是一个九宫格的典型应用,因为窗体需要在八个方向拉伸,所以在C/S软件中大量采用这种技术来布局设计。在B/S系统大行其道的当今社会,这种布局逐渐被一些网页设计师运用在网页中去,用得最多的就是在圆角框布局中应用。 阅读全文
posted @ 2009-06-18 12:07 Biny 阅读(10160) 评论(16) 推荐(4) 编辑

点击右上角即可分享
微信分享提示