div+css命名规则

       我们开发div+css网页时候，比较困惑和纠结的事莫过于CSS命名，特别是新手，不知道什么地方该如何命名，怎样命名才好。但正所谓国有国法，家有家规。在div+css中也有一套约定俗成的命名规则，下面请随我们一起来看看吧！

　　一、网页元素及常用功能的命名规则

    （1）导航方面命名规则

　　导航：nav

　　主导航：mainbav

　　子导航：subnav

　　顶导航：topnav

　　边导航：sidebar

　　左导航：leftsidebar

　　右导航：rightsidebar

　　菜单：menu

　　子菜单：submenu

　　标题:title

　　摘要:summary

　　（2）页面结构方面命名规则

　　容器:container

　　页头：header

　　内容：content/container

　　页面主体：main

　　页尾：footer

　　导航：nav

　　侧栏：sidebar

　　栏目：column

　　页面外围控制整体布局宽度：wrapper

　　左右中：left right center

　　（3）网页常用功能命名规则

　　标志：logo

　　广告：banner

　　登陆：login

　　登录条：loginbar

　　注册：regsiter

　　搜索：search

　　功能区：shop

　　标题：title

　　加入：joinus

　　状态：status

　　按钮：btn

　　滚动：scroll

　　标签页：tab

　　文章列表：list

　　提示信息：msg

　　当前的:current

　　小技巧：tips

　　图标:icon

　　注释：note

　　指南：guild

　　服务：service

　　热点：hot

　　新闻：news

　　下载：download

　　投票：vote

　　合作伙伴：partner

　　友情链接：link

　　版权：copyright

　　 二、CSS文件命名规则

　　主要的master.css

　　模块module.css

　　基本共用base.css

　　布局，版面layout.css

　　主题themes.css

　　专栏columns.css

　　文字font.css

　　表单forms.css

　　补丁mend.css

　　打印print.css

　　三、命名的注意事项

　　了解了常用的命名规则之后，我们来谈谈命名的注意事项，具体如下：

　　1.所有的命名最好都小写

　　2.属性的值一定要用双引号("")括起来，且一定要有值如class="thinkcss",id="thinkcss"

　　3.每个标签都要有开始和结束，且要有正确的层次，排版有规律工整

　　4.空元素要有结束的tag或于开始的tag后加上"/"

　　5.表现与结构完全分离，代码中不涉及任何的表现元素，如style、font、bgColor、border等

　　6.<h1>到<h5>的定义，应遵循从大到小的原则，体现文档的结构，并有利于搜索引擎的查询。

　　7.给每一个表格和表单加上一个唯一的、结构标记id

　　8.给图片加上alt标签

　　9.尽量使用英文命名原则

　　10.尽量不缩写，除非一看就明白的单词

　　以上为div+css的命名规则总结,这套规则大致跟日常用的中英词汇吻合,所以非常容易理解。合理规范的命名在团队开发中将有助于各成员快速看懂我们的代码，同时还能方便维护。所以我们课课家网站建议大家尽量按照本文中所给出的规则对CSS文件和各网页元素及常用功能进行命名！