css常用命名参考

作为一个web前端初学者，最令我痛苦的就是，css的命名很纠结。虽然class=””可以随意命名，但是很头疼的问题就是不知道用什么命名才合适。为了让自己的网页代码更具有可读性，以便日后自己回来修改和别人阅读，我觉得有必要弄一下稍微跟大家的认识有共同点的命名方式，英文的命名方式很不错。网页的每一块都用与之对应的英文单词或者单词组命名，这样就能一看大概就知道这块是写的是哪个部分的了。
常用的CSS命名规则:
 (1)页面结构
容器: container 页头：header 内容：content/container
页面主体：main 页尾：footer 导航：nav
侧栏：sidebar  栏目：column   页面外围控制整体布局宽度：wrapper
左右中：left right center
(2)导航
导航：nav   主导航：mainbav   子导航：subnav
顶导航：topnav 边导航：sidebar 左导航：leftsidebar
右导航：rightsidebar  菜单：menu  子菜单：submenu
标题: title   摘要: summary
(3)功能
标志：logo 广告： banner 登陆： login 登录条：loginbar
注册：regsiter 搜索：search  功能区：shop
标题：title   加入：join us   状态：status  按钮：btn
滚动：scroll  标签页：tab  文章列表：list  提示信息：msg
当前的: current  小技巧：tips  图标: icon  注释：note
指南：guild  服务：service  热点：hot  新闻：news
下载：download  投票：vote  合作伙伴：partner
友情链接：link   版权：copyright


同时，还可以用单词组的方式进行命名，比如说购物车的文字可以用shopcarText等等，在一个大栏目下的命名就可以使用单词组。


样式文件命名：
主要的 master.css
布局，版面 layout.css
专栏 columns.css
文字 font.css
打印样式 print.css
主题 themes.css