打印

[讨论] CSS的语义化命名规范

网上大部分文章在谈到网站设计中的语义问题时,大都只集中于语义化的Html标签,或者谈到CSS的语义命名时也只局限于少数几个例子,比如命名中不应出现left,right,red等表象性(描述性)命名,而未给出较完整的命名规范。

命名规范在开发(不管是团队或是个人)中的重要性大家自是明了。而CSS命名规范的意义不同于一般,不仅仅在提高开发效率上,比如,有两个网站A和B,你喜欢A的内容而B却有更佳的排版方式,如果这两个网站具有相同的命名规范,那么这两个网站的设计者将能够让访问者把B的CSS样式应用到A中,那将是一件多么美妙的事情.......^_^


下面针对大部分网站均有的区块给出一个命名规范(欢迎大家一起补充完善):

Page container 页面容器                            #container

Branding areas 标记(logo)区域        #branding(不要用#header)

Navigation(main) 主导航                      #nav_main

Navigation(sub) 副导航                         #nav_sub

Navigation(supplementary)支持导航 #nav_supp

Search input 搜索输入框                   #search_input

Main content 主要内容                     #content_main

Addintional content 附加内容            #content_sub(不要用#sidebar)

Supplementary content补充内容       #content_supp

Site information站点信息                    #site_info(不要用#footer)


参考资料:《超越CSS》

[ 本帖最后由 oceaniver 于 2008-6-11 13:58 编辑 ]
谢过
CSSBBS.com
还好没买那本书。。
结构简单的够用,但是对于复杂的结构……

TOP

还在为头像烦恼?还在为不能关注好友动态烦忧?快来蓝色理想家园吧!
跟我的有点像

TOP