前些时间看到别人做的一个界面粗糙的网站,自己动手试着做一下前端,过程并不简单,一不小心几个夜晚都过去了。
偶尔上网看到http://960.gs/(960 gridsystem)正是我想要的。
- 小巧简单,功能单一(仅仅做排版的工作,其他东西靠自己。)(三个文件:reset.css,960.css,font.css)
- 界面宽960px,适合目前主流1/2以上显示器都满屏宽度的1024x768的屏幕。
使用也很简单。主要css的div类:
- container_Y 容器。限定960px宽。(960分成Y份)(Y=12或24)
- grid_x。(x<Y)
- perfix_x, suffix_x, push_x, pull_x 分别左右补空、左右偏移.
- alpha,omega:取消左右magine。
- 当然嵌套够一行了要记得用clear。
- 一般不超过三层。再嵌套的排版就不适合我了。
呵呵,新手上路,除了擅长刹车外,也得总结点其他的:
- font-family有中文字体有时候不能正常呈现样式,记得把.css存储为UTF-8格式。
- 字体大小定义最好不要用font-size单项定义。否则好像IE6不好呈现。
- css最好外部连接。
- css距离标签越近越不容易被覆盖,越晚调用越不容易被覆盖。thema样式中优先级要高于外部的。
- 待续……