最近对CSS和整站建设感兴趣,把有关资料整理一下。代码编写也是一门艺术,我开始写的CSS和Html很不规范,现在向标准学习。下面的资料来源52CSS,我才发现这个站,原来是用PJBlog博客建的,同样是博客人家做得咋这么好呢。
一个站点成功与否,不是在于所用的程序语言是PHP还是ASP,也不在于用BLOG建站或是CMS建站,内容和专业很重要。博客很好起步,CMS体系很完整。但最终还是要看用户的需要了,是否能在最短的时间找到他们最需要的东西。
“苦力王的蓝球视频”就是一个例子,原来是用z-blog建的,自从CEO换人之后,页面改成了CMS,增加一些资讯,用户就反映不能快速找到,他们最需要的NBA视频了,从而把优势变为劣势。这是盲目追求“大而全”的一个失败教训,期望新站长能够及早发现。
个人还比较欣赏“站酷”这个设计素材站点,主站和论坛发展都很好,大有超越“经典论坛”之势。一开始只是网上素材收集,现在原创内容也搞得非常火热。页面简洁大气,内容丰富。这是网站专业定向精准、内容和形式结合非常好,网站分阶段发展,一个非常成功的例子。
Visc在聊天时说过,分阶段性的实施计划,这点非常重要,一开始就想做全,非常难而且耗时耗精力,如果先走一步看看发展方向,然后再继续,还是比较可行。说真的,在我们博客话题群,虽是一些小站长,但里面人才济济,看他们聊天,能学到不少东西。
以上是一些题外话,算是总结吧,下面开始转载。
有时候是先写了margin或color,然后再写width和height等等。我们有没有必要让我们的编码更加的工整,更加的科学呢?实践证明,书写工整、按一定的规则进行书写是很有好处的。
下面是Mozilla Firefox所建议的CSS书写顺序,对我们的代码书写很有参考价值:
* maintained by fantasai
* (classes defined in the Markup Guide -http://mozilla.org/contribute/writing/markup)
*/
/* Suggested order:
//显示属性
* display
* list-style
* position
* float
* clear
//自身属性
* width
* height
* margin
* padding
* border
* background
//文本属性
* color
* font
* text-decoration
* text-align
* vertical-align
* white-space
* other text
* content
*
*/<--文章内容结束标识,勿删!!--> <--page-->
下面这段是52CSS自己总结的,对上面的书写顺序规则作出自己的理解,而且里面有一些例程进行对比,两厢比较,就可以看出CSS书写顺序重要性了。
现在需要强调的是编码的顺序问题,这是一个非常微小的细节问题,但涉及到团队协作以及让您的编码更加工整,强烈推荐以一定的顺序来进行编码。看下面的例子:
#main {
font-size:13px;
width:500px;
background:url(http://www.zfnn.com/logo.jpg) no-repeat 20px 200px;
height:600px;
line-height:22px;
color:#c00;
float:left;
margin:10px 0 15px 0;
}
#main {
float:left;
width:500px;
height:600px;
margin:10px 0 15px 0;
background:url(http://www.zfnn.com/logo.jpg) no-repeat 20px 200px;
color:#c00;
font-size:13px;
line-height:22px;
}
推荐的CSS编码顺序分为三类,分别如下:
display
position
float
list-style
2、元素自身
width
height
margin
padding
border
background
3、文本外观
color
font
line-height
text-align
text-decoration
other