www.baike369.com
百科369 > CSS教程 > CSS命名规范

CSS命名规范


CSS命名规范

命名规范并不是一成不变的,除了一部分是程序语言的要求以外,大部分内容只是一个大家约定俗成的规范。

CSS命名的基本原则是:在CSS 2.1中,标识符(包括元素名、类和ID)只能包含字符[A-Za-z0-9]以及ISO10646字符编号U+00A1及以上,加上连字号“-”和下划线“_”,它们不能以数字开头或者连字号后面跟一个数字。

同时需要特别注意以下两点:

1. 使用有意义的单词

尽量使用易于辨认的英文单词来做名称,以求清晰易懂,最好不要使用缩写。例如:

页头:header 页脚:footer 标志:logo 滚动:scroll
登录条:loginbar 注册:regsiter 状态:status 导航:nav
子导航:subnav 菜单:menu 子菜单:submenu 标签页:tab
侧栏:sidebar 页面主体:main 内容:content 文章列表:list
栏目标题:title 提示信息:msg 小技巧:tips 热点:hot
新闻:news 搜索:search 下载:download 服务:service
投票:vote 指南:guild 广告:banner 版权:copyright
友情链接:friendlink 合作伙伴:partner 加入:joinus  

当一个单词无法完全表现内容的意义时,可以使用多个单词来定义,如news_title、news_list、content_title等。

2. 分段书写方法

当需要用多个单词来表示,单词之间如何连接?一般的书写方法有以下几种:

  • 骆驼命名法(camelCasing):第一个字母小写,随后的每个单词的第一个字母大写。混合使用大小写字母来构成名称,如newsTitle、subMenu等。
  • 帕斯卡命名法(PascalCasing):与骆驼命名法类似。只不过骆驼命名法是首字母小写,而帕斯卡命名法是首字母大写,如NewsTtile、SubMenu等。
  • 下划线命名法:就是在命名中加入了英文的下划线“_”的命名规则,如news_title、news_list等。
  • 连字符命名法:使用英文连字符“-”来连接单词,如sidebar-menu、content-main。对于属性选择器和CSS 3中的某些选择器,连字符“-”无疑更加具有优势。

上述几种书写方法都得到了广泛的应用,但是,由于有时候页面要结合不同的服务器端程序来实现交互和动态显示等功能,因此,还要遵守相应的程序语言的命名规则。

Copyright© 2011-2016 www.baike369.com All Rights Reserved