02.CSS+DIV之模板从偷、切、拼开始
身体欠佳,答应“宝贝干女儿”提早休息的,一想到我的“依葫芦画瓢学CSS+DIV”没有更新内容,的确难以入睡,于是不得不拖着病继续坚持把懒人教程的第二课时持撰写完。在开始学习CSS+DIV之前,先来准备一样道具:模板。模板的作用就是为整个页面做一个布局分布样图,使得每一个部分都有CSS+DIV。其实,我个人也非常缺少制作模板的能力与精力,但我学会制作的模板三种“歪术”,那就是偷、切、拼三术。郑重声明:此三术适合不会制作模板或懒于做模板样图人群,并有初步的图片软件处理能力。
准备图片处理软件:PhotoShop或FireWorks(简称PS或FW),二选一即可。图片处理软件会基本的操作,如复制、粘贴、切割、打字、配色等。接着来熟悉三术。所谓偷术:就是把几张最喜欢的模板偷过来使用的技术,可以全偷,也是可以部分偷。所谓切术:就是把偷到几张模板经过特殊图片处理软件,切去不喜欢的图片。所谓拼术:就是把几个喜欢部分的模板组合拼成一张完整的新图的技术。在我提供的模板中头部、中部、底部是来自于三个不同的模板切图最终组合而成,图在文章最后。
网上免费模板提供较多,我们可以免费下载用来学习CSS+DIV,有了模板就有了总体布局。所有模板布局大致分为三个部分。
其一,Header 区。顶部,包括网站Logo标志、栏目Menu和广告Banner等。
其二,PgBody 区。中部,包括内容主体,侧边栏,侧边栏有单与双之分。
其三,Footer 区。底部,包括网站声明,备案、流量统计、版权等信息。
这是最基本的网站布局,其他的布局都以此为基础细分与删减而成。因身体欠佳,所以偷懒点,内容不多。准备一张模板布局图片,了解布局的三个部分,为进入懒人CSS+DIV学习教程做准备!下篇精彩预告:学习Header 区以外代码编写!
依葫芦画瓢学CSS+DIV模板样图,放大效果更佳!
