Front Tech

YAML对三栏布局中CSS浮动问题的解决

Preface Mentor在项目中提到一种叫做YAML的置标语言。在网上搜了一下,这是一种强调可读性,以数据为中心的置标语言,YAML的意思是YAML Ain’t a Markup Language(YAML不是一种置标语言),语法比较简单,Structure通过空格来展示。Sequence里的项用”-“来代表,Map里的键值对用”:”分隔,知道这几点就可以了,YAML比JSON还简单,借用官方的说法,是一种非常Friendly的格式。 很有趣的是我同时搜到了一个CSS框架,也叫YAML,不过这里是YAML是Yet Another Multicolumn Layout(另一个多栏布局)的缩写。本文主要针对的是后一个YAML,但不侧重于它的用法,而是学习它的写法。 YAML YAML又一次体现了德国人的严谨作风,它有一份优秀易读,循序渐进的文档,有良好的目录结构,详细的注释,兼容所有我能找到的浏览器(包括IETEST上的IE5.5),而且考虑到了对网页打印格式的兼容。 在继续以下的无聊内容之前,先来看一个有趣的东西,YAML的在线Builder,可以以所见即所得的制作样式,它可以使用YAML已所见即所得的方式生成可用的HTML+CSS。

Continue Reading
Front Website

为什么要用960px?——网页内容宽度分析

液晶还没普及的年代,网页设计需要考虑800×600的分辨率。但如今800×600的分辨率使用率不到2%,已经可以忽略了。比这个分辨率高一级别的1024×768,使用率接近50%(国内),所以很多网站都是以1024的宽度为标准进行设计的,最常见的页面宽度是两种:1004和960。 早期的网页设计师使用1004px作为页面宽度,是基于这样的考虑:在1024*768的分辨率下打开IE,左边框宽度是2px,右边滚动条的宽度是18px,于是得出宽度就是1004px了。但这种宽度的设置并不利于栅格化布局的计算,如果选择三栏式的布局,就很难平均分配,所以现在很少有使用1004px宽度的网页了。

Continue Reading